/**** Font Reference ****/

@font-face {
	font-family:'OpenSans';
	src:url('../fonts/OpenSans-Regular.ttf') format('truetype'), url('../fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype');
	font-weight:normal;
	font-style:normal
	}
	
	@font-face {
	font-family:'OpenSansLight'; 
	src:url('../fonts/OpenSans-Light.ttf') format('truetype'), url('../fonts/OpenSans-Light.eot?#iefix') format('embedded-opentype');
	font-weight:normal;
	font-style:normal
	}
	
	@font-face {
	font-family:'OpenSansSemibold'; 
	src:url('../fonts/OpenSans-Semibold.ttf') format('truetype'), url('../fonts/OpenSans-Semibold.eot?#iefix') format('embedded-opentype');
	font-weight:normal;
	font-style:normal
	}
	
	@font-face {
	font-family:'OpenSansBold'; 
	src:url('../fonts/OpenSans-Bold.ttf') format('truetype'), url('../fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype');
	font-weight:normal;
	font-style:normal
	}
	
	@font-face {
	font-family:'OpenSansExtraBold'; 
	src:url('../fonts/OpenSans-ExtraBold.ttf') format('truetype'), url('../fonts/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype');
	font-weight:normal;
	font-style:normal
	}

/*
	@font-face {
	font-family:'Cabin-Bold'; 
	src:url('../fonts/Cabin-Bold.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-BoldItalic'; 
	src:url('../fonts/Cabin-BoldItalic.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-Italic'; 
	src:url('../fonts/Cabin-Italic.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-Medium'; 
	src:url('../fonts/Cabin-Medium.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-MediumItalic'; 
	src:url('../fonts/Cabin-MediumItalic.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-Regular'; 
	src:url('../fonts/Cabin-Regular.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-SemiBold'; 
	src:url('../fonts/Cabin-SemiBold.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Cabin-SemiBoldItalic'; 
	src:url('../fonts/Cabin-SemiBoldItalic.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Montserrat-Medium'; 
	src:url('../fonts/Montserrat-Medium.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Montserrat-Regular'; 
	src:url('../fonts/Montserrat-Regular.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Montserrat-SemiBold'; 
	src:url('../fonts/Montserrat-SemiBold.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'Montserrat-ThinItalic'; 
	src:url('../fonts/Montserrat-ThinItalic.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}

	@font-face {
	font-family:'IBMPlexSans-Medium'; 
	src:url('../fonts/IBMPlexSans-Medium.ttf') format('truetype');
	font-weight:normal;
	font-style:normal
	}
*/
	
	
	
	/**** Generic Layout  ****/
	
	html, body {
		height: 99%;
		margin:0; padding:0;
	}
	body {
		background: url(../images/body-bg.jpg) top center no-repeat fixed;
		background-size: cover;
		font-family:'OpenSans';
		overflow-x: hidden;
	}
	a:hover,a:focus,a:active{
		text-decoration: none;
	}
	.no-padding{padding:0;}
	.no-margin{margin: 0;}
	.inner-bg{
		background-color: #f7f7f7;
		/*background: url(../images/bg-repeat.jpg) top center repeat; */
		height:100%; 
		margin:0; 
		padding:0;
		background-image:none;
	}
	.img-center{margin-left: auto;margin-right: auto}
	.main-content h1{font-size:16px; color:#0e0e0e; text-transform:uppercase; font-family:'OpenSans';  font-weight:normal; padding:0px 0 10px; margin:5px 0 15px; width:100%; text-align:center; background:url(../images/heading-border.png) bottom center no-repeat;}
	
	.mgb-15{margin-bottom:15px !important; }
	
	.m-t-15{margin-top: 15px;}
	.m-t-20{margin-top: 20px;}
	.m-t-30{margin-top: 30px;}
	.m-t-25{margin-top: 25px;}

	.m-b-10{margin-bottom: 10px !important;}
	.m-b-15{margin-bottom: 15px !important;}
	.m-b-7{margin-bottom: 7px;}
	.m-b-5{margin-bottom: 5px !important;}
	.m-b-0{margin-bottom: 0 !important;}
	.m-b-30{margin-bottom: 30 !important;}
	.m-l-0{margin-left: 0 !important;}
	.m-r-50{margin-right: 50px !important;}
	.m-t-0{margin-top: 0 !important;}

	.p-l-0{
		padding-left: 0 !important;
	}
	.p-l-20{ padding-left: 20px; }
	.plr-0{
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	
	.m-t-10{margin-top: 10px}
	
	.m-t-b-20{
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	.p-r-10{
		padding-right: 10px;
	}
	
	.p-r-15{
		padding-right: 15px;
	}

	.p-b-15{
		padding-bottom: 15px;
	}

	.m-r-10{
		margin-right: 10px;
	}
	.m-r-30{
		margin-right: 30px;
	}
	.m-l-10{
		margin-left: 10px;
	}
	.p-a-5{
		padding: 5px !important;
	}
	.display_inlineB{
		display:inline-block;
	}
	.width-100{width: 100% !important;}
	.width-90{width: 90% !important;}
	.width-65{width: 65% !important;}
	.width-33{width: 33% !important;}
	.width-150{width: 150px !important;}
	.width-124{width: 124px !important;}
	.width-69{width: 69px !important;}
	.width-180{width: 180px !important;}
	.width-auto{width: auto !important;}
	
	.display_inlineB{
		display: inline-block;
	}

	.m-a-0{ margin: 0 !important;}

	.m-auto{ margin: 0 auto !important; }
	
	.text-blue{color: #3a95e4}
	.text-green{color: #32bb37 !important;}

	.vertical-unset{
		vertical-align: unset;
	}
	.cursor-pointer {
		cursor: pointer;
	}
	.dis-flex{
		display: flex !important;
	}
	.has-error{border-color: #a94442 !important}
	.white-space-inherit{
		white-space: inherit;
	}
	.data-result-box{float:left; width:100%; display:table; padding:0;}
	
	.data-view-wrap{display:inline-block; background:url(../images/box-shadow.png) bottom center no-repeat; padding-bottom:12px; margin:0px 1% 0px 0px; width:19%;/*16%; */cursor: pointer}
	
	@media (max-width: 767px) {
		.data-view-wrap{
			background: none;
		  }
	}
	
	div.data-view-wrap:last-of-type{margin:0px; width:17%;}

	#trends-data-view-wrap .data-view-wrap , #timesheet-data-view-wrap .data-view-wrap{
		width:13%;
		}
	#trends-data-view-wrap div.data-view-wrap:last-of-type, #timesheet-data-view-wrap div.data-view-wrap:last-of-type{width: 13%;}
	

	.data-view-box{
		display:flex-box; 
		margin:0; 
		border:1px solid #e0e9ec; 
		background:#fff; 
		width:100%; 
		padding:0 0 15px 0; 
		float:left;
	}

	@media (max-width: 1024px) {
		.data-view-box{
			margin-bottom: 10px;
		  }
	}
	
	.data-view-box h4{
		color: #424242;
		font-size: 15px;
		font-family: 'OpenSansbold';
		padding: 10px 15px 5px;
		text-align: left;
		margin: 0 0 0px 0;
	}
	
	.graph-view-wrap{ background:url(../images/graph-box-shadow.png) bottom center no-repeat; padding-bottom:13px;}
	.graph-view-box{display:flex-box; margin:25px 2% 0px; border:1px solid #e0e9ec; background:#fff; width:96%; padding:0; float:left;}
	
	.graph-view-box h4{color:#424242;font-size:14px;font-family:'OpenSansSemibold'; background:#dbf3f9; padding: 10px 0; text-align: center; margin:0 0 10px 0;}
	
	.graph-view{float:left; display:block; width:98%; margin:10px 1%;}
	
	.subscription-box,.panel{display:flex-box; margin:0 0 30px; background:transparent; width:100%; padding:0; float:left;box-shadow: none;border: none;}
	/* .subscription-box:last-child{margin-bottom: 0;} */
	/* .panel-body .subscription-box:first-child{margin: 0} */
	.subscription-box .panel-heading,.panel-heading{color: #424242 !important;
		font-size: 14px;
		font-family: 'OpenSansSemibold';
		background: #ffffff !important;
		display: inline-block;
		padding: 10px;
		margin: 0;
		border: none;
		border-radius: 10px 10px 0px 0px !important;
		box-shadow: 0px -6px 12px 1px rgba(195,192,248,0.3);}
	.panel .panel-collapse,.panel-body { background: #ffffff; border-radius: 0 10px 10px 10px;box-shadow: 0px 0px 12px 1px rgba(195,192,248,0.3);}
	.subscription-box .pagination{margin:0px;}
	/* .subscription-box .panel{border:none;} */
	
	.pagination > li > a, .pagination > li > span{border:none; padding:6px 10px;}
	
	.footer {
		float: right;
		position: fixed;
		bottom: 10px;
		right: 10px;
		color: #e3e3e3;
		font-size: 10px;
		font-family:'OpenSansLight';
	}
	
	.table {
		width: 99.9%;
	}
	.table > thead > tr > th{
		color:#3895e3;
		font-size:12px;
	}
	
	.table > tbody > tr > td{
		color:#3f3f3f;
		font-size:12px;
		border:none;
	}
	
	.table-striped > tbody > tr:nth-of-type(1n+1){
		background-color:#eeeeee;
	}
	.table-striped > tbody > tr:nth-of-type(2n+1){
		background-color:#fff;
	}
	
	.panel-title{
		color:#424242;
		font-size:14px;
		font-family:'OpenSansSemibold';
		text-transform: uppercase;
	}
	.panel-title.main-head {
		font-family: 'openSansbold';
		font-size: 15px;
	}
	.panel-title a i{
		color:#909090;
		font-size:12px;
		margin:0px 3px;
	}
	
	
	.generate-link-btn a{
		text-transform:uppercase;
		font-size:14px;
		font-family:'OpenSansSemibold';
		text-decoration:none;
		padding:5px;
		margin:5px;
		display:inline-block;
	}
	
	.generate-link-btn a:hover{
		text-decoration:none;
	}
	
	/***** Form style ****/
	
	.form-control{
		border:1px solid #e5e5e5;
		background:#fff;
		border-radius:0;
		/* margin-left:5px;
		width:90%; */
		box-shadow: none;
	}
	
	.small-input{width:20% !important; display:inline-block;}
	.mid-input{width:50% !important; display:inline-block;}
	.large-input{width:80% !important; display:inline-block;}
	
	.days span{display:inline-block; margin:5px 0; padding:0;}
	
	.btn-custom{
	background:#247ada;
	border-radius:0;
	color:#fff;
	font-size:14px;
	border:none;
	outline:none;
	text-transform:uppercase;
	padding:7px 35px;
	}
	
	/**** Header Layout  ****/
	
	.logo-strip {
		width: 100%;
		min-width: 1000px;
		/* background: #2980b9; */
		background: #004a6b;
		text-align: center;
		padding: 5px 0;
		margin-bottom: 20px;
		color:#fff;
	}
	
	.logo {margin-top:10px;}
	
	.logo-strip img {
		margin: 0;
		padding: 0;
	}
	
	.logo-strip b{font-family:'OpenSansBold';  font-weight:normal;}
	.navbar-brand{padding:0px;}
	.navbar-brand img{max-height: 100%; margin-top: 17px;}
	/*.navbar-brand img {height:30px; padding:2px;}*/
	
	.user-option{background:#f4f4f4; border:1px solid #e8e8e8; height:38px; width:38px; display:inline-block; float:right; margin:0px 3px; line-height:38px; border-radius:44px;overflow:hidden;}
	.user-option img{width:100%; vertical-align:top;}
	.user-control{background:none; border:none; outline:none; color:#515151; margin-top:8px;}
	.user-control:hover,
	.user-control:focus,
	.user-control:active{background:none !important; border:none !important; outline:none !important; color:#fff !important; /*margin-top:15px;*/}
	
	
	.lang-option{font-size:12px; display:inline-block; border:none; padding:3px; height:30px; margin-top:5px; margin-bottom:10px;}
	
	.lang-option a{font-size:12px; display:inline-block; padding:0px; margin:0px 3px; color:#fff; border:2px solid transparent;}
	
	.lang-option a.selected img{border:2px solid #fff;}
	
	.user-lang-box{
	margin-top:13px;
	margin-bottom:3px;
	}
	
	.top-header{background:#fff; display:block;}
	.top-header.panel-dashboard{background: #2980b9;min-height: 65px;color: #fff;}
	.top-header h3{font-size:16px; font-weight:700;}
	
	.navbar-nav .popover{
		width: 400px !important;
	}

	/*CSS for solve long user name text issue in header*/

	.userName-designation{
		margin-top: 3px;
		Text-overflow: ellipsis;
	   	overflow: hidden;
	   	max-width: 120px;
	}

	.userName-designation b{
		white-space: nowrap;
	}
	
	/****** For Menu bar *******/
	
	.navbar-default{
		/*background: #2980b9;*/
		/* background: #1F5B95; */
		/* background:#004a6b; */
		background-color: #00ADB5;
		padding:0 ;
		margin-bottom: 00px;
		color:#fff;
		border:none;
		border-radius:0;
		min-height:65px;
		z-index:1000;
	}
	
	.navbar-default .navbar-nav > li > a{
		color:#fff;
		font-size:12px;
		text-align:center;
		padding:20px 9px;
		display: flex;
		align-items: center;
	}
	.navbar-default .navbar-nav > li > a b {
		margin-left: 4px;
		font-size: 15px;
	}
	
	#menu-small .navbar-nav{
		float: inherit;
	}

	/*.navbar-default .navbar-nav > li > a > span{
	visibility:hidden;
	
	}*/
	
	.navbar-default .navbar-nav > .active > a,
	.navbar-default .navbar-nav > .active > a:hover,
	.navbar-default .navbar-nav > .active > a:focus,
	.navbar-default .navbar-nav > li > a:hover,
	.navbar-default .navbar-nav > li > a:focus{
		color:#fff;
		border-bottom:2px solid #fff;
		background:none;
	}
	.navbar-default .navbar-nav > .open > a,
	.navbar-default .navbar-nav > .open > a:hover,
	.navbar-default .navbar-nav > .open > a:focus {
		color: #fff;
		background-color: #039299;
	}
	/*.navbar-default .navbar-nav > .active > a > span,
	.navbar-default .navbar-nav > .active > a:hover > span,
	.navbar-default .navbar-nav > .active > a:focus > span,
	.navbar-default .navbar-nav > li > a:hover > span,
	.navbar-default .navbar-nav > li > a:focus > span{
		visibility:visible;
	}*/
	#menu-big .nav .open > a, #menu-big .nav .open > a:hover, #menu-big .nav .open > a:focus, 
	#menu-small .nav .open > a, #menu-small .nav .open > a:hover, #menu-small .nav .open > a:focus {
		background-color: #039299;
		border-color: #337ab7;
		color: white;
	}
	
	.navbar-nav > li{
		float:none;
		display:inline-block;
	}
	
	.navbar-toggle{float:none; }
	
	
	.nav li a img{width:27px;}
	
	/**** Login page specific style  ****/
	
	
	.loaded {
		width: 100%;
		float: left;
	}
	.simon-logo{
		float: left;
		display: inline-block;
	}
	.simon-logo img{
		margin-left: 0;
		left: 20px;
		margin-top: 30px;
		opacity: 0.5;
	}
	.shape {
		display: block;
		width: 1000px;
		margin: 30px auto 0;
		z-index: 2;
	}
	.shape-one {
		z-index: 2;
		position: absolute;
	}
	.shape-two {
		z-index: 1;
		position: absolute;
		margin-top: 166px;
	}
	.form{
		position: absolute;
		z-index: 3;
		margin-top: 150px;
		width: 390px;
		margin-left: 335px;
		opacity: 0;
	}
	#body.loaded .shape img.shape-one {
		-webkit-transition: margin-left 2s; /* For Safari 3.1 to 6.0 */
		transition: margin-left 2s;
	}
	#body.loaded .shape img.shape-one {
		margin-left: 304px;
	}
	#body.loaded .shape img.shape-two {
		-webkit-transition: margin-left 2s; /* For Safari 3.1 to 6.0 */
		transition: margin-left 2s;
	}
	#body.loaded .shape img.shape-two {
		margin-left: 312px;
	}
	#body.loaded .shape .form {
		-webkit-transition: opacity 3s; /* For Safari 3.1 to 6.0 */
		transition: opacity 3s;
	}
	#body.loaded .shape .form {
		opacity: 1;
	}
	.showbox {
		float: left;
		margin: 4em 1em;
		width: 100px;
		height: 60px;
		border: 2px solid green;
		background-color: #fff;
		line-height: 60px;
		text-align: center;
		-webkit-transition: 1s ease-in-out;
		-moz-transition: 1s ease-in-out;
		-o-transition: 1s ease-in-out;
		transition: 1s ease-in-out;
	}
	.showbox.slideright:hover {
		-webkit-transform: translate(3em, 0);
		-moz-transform: translate(3em, 0);
		-o-transform: translate(3em, 0);
		-ms-transform: translate(3em, 0);
		transform: translate(3em, 0);
	}
	.shape h3{
		color: #fff;
		font-size: 18px;
		text-transform: uppercase;
		background: url(../images/login-title-underline.png) bottom left no-repeat;
		padding-bottom:5px;
	}
	.shape input[type=text], .shape input[type=password] {
		color: #fff;
		font-size: 14px;
		padding: 4px 10px 4px 0px;
		background: none;
		border: none;
		outline: none;
		height: 30px;
		width: 230px;
	}
	.shape input[type=submit] {
		color: #00577d;
		font-size: 19px;
		padding: 0;
		background: #fff;
		width: 62px;
		height: 62px;
		border: none;
		outline: none;
		border-radius: 62px;
		font-family:'OpenSansSemibold';
	}
	.form-box-left {
		float: left;
		position: relative;
		width: 300px;
		margin: 23px 0 0 0;
		min-height: 165px;
	}
	.form-box-right {
		float: right;
		position: relative;
		width: 65px; 
		min-height: 165px;
	}
	.form-box-left hr {
		border-color: #b9e1f3;
		margin: 5px 0;
	}
	.form-box-links {
		float: left;
		position: relative;
		margin: 0;
		width: 250px;
	}
	.form-box-left i {
		color: #fff;
	}
	.form-box-links a {
		color: #fff;
		font-size: 14px;
		margin: 7px 0;
		display: block;
		text-decoration: none;
		font-family:'OpenSansLight';
		cursor: pointer;
	}
	
	.error{color:#FF0004; background:#F4A8B3; border: 1px solid #F4A8B3; padding: 3px 5px; float:left; display: block; font-size: 12px; margin: 5px;}
	
	::-webkit-input-placeholder { /* WebKit, Blink, Edge */
		color:    #5d5d5d;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	   color:    #5d5d5d;
	   opacity:  1;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
	   color:    #5d5d5d;
	   opacity:  1;
	}
	:-ms-input-placeholder { /* Internet Explorer 10-11 */
	   color:    #5d5d5d;
	}
	.forgot-password-form,
	#forgot-password-form{
		position: absolute;
		z-index: 3;
		margin-top: 140px !important;
		width: 340px !important;
		margin-left: 335px !important;
	}
	
	#register-form{
		position: absolute;
		z-index: 3;
		margin-top: 130px;
		width:395px;
		margin-left: 335px;
	}
	
	#login-form .form-box-left {
		width: 200px;/*260px*/
		margin: 44px 0 0 0;
	}
	
	#login-form .form-box-right {
		margin: 55px 0 0 0;
	}
	
	#register-form .form-box-left{
		width:275px;
		margin: 23px 0 40px 0;
	}
	
	#register-form .form-box-right{
		margin:65px 0 0 0;
	}
	
	.forgot-password-form .form-box-left,
	#forgot-password-form .form-box-left{
		margin:15px 0 0 0 !important;
	}
	
	.forgot-password-form .form-box-right,
	#forgot-password-form .form-box-right{
		margin:18px 0 0 0 !important;
	}
	
	#forgot-password-form, #register-form{display:none;}
	
	/*New Login screen Start*/
	.login-container2 #bgVideo {
		position: fixed;
		right: 0;
		top: 0;
		width: auto;
		min-height: 100%;
		z-index: -1;
	}
	.login-container2 .login-info {
		display: flex;
		padding: 4vw;
	}
	.login-container2 .login-info .login-section {
		padding: 4rem;
		backdrop-filter: blur(16px) saturate(153%);
		-webkit-backdrop-filter: blur(16px) saturate(153%);
		background-color: rgba(9, 9, 9, 0.53);
		border-radius: 12px;
		border: 1px solid rgba(255, 255, 255, 0.125);
		color: #8e8e8e;
		font-size: 13px;
		width: 400px;
		flex: 0 0 400px;
	}
	.login-container2 .login-info .login-section .logo {
		/* width: 240px; */
		/* margin-left: -25px; */
		margin-top: 0;
	}
	.login-container2 .login-info .login-section .form-signin .form-signin-heading{
		color: #ffffff;
	}
	.login-container2 .login-info .login-section .form-signin .form-group label{
		font-weight: normal;
	}
	.login-container2 .login-info .login-section .form-signin .form-group .form-control{
		background: rgba(256,256,256,0.1);
		border: none;
		color: #ffffff;
	}
	.login-container2 .login-info .login-helper{
		width: 100%;
		padding: 4rem;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}
	.login-container2 .login-info .login-helper h2{
		font-size: 60px;
		font-weight: bold;
		color: #ffffff;
	}
	.login-container2 .login-info .login-helper .typed-text{
		font-size: 48px;
		color:transparent;
		-webkit-text-stroke: 1px #ffffff;
		font-weight: bold;
		min-height: 68px;
		letter-spacing: 3px;
		font-family: sans-serif;
	}
	
	@media only screen and (max-width : 1199.97px) {
		.login-container2 .login-info .login-helper h2{
			font-size: 48px;
		}
		.login-container2 .login-info .login-helper .typed-text{
			font-size: 36px;
			min-height: 51px;
		}
	}
	@media only screen and (max-width : 991.97px) {
		.login-container2 .login-info{
			margin-top: 6vh;
		}
		.login-container2 .login-info .login-section{
			width: 350px;
			flex: 0 0 350px;
		}
	}
	@media only screen and (max-width : 767.97px) {
		.login-container2 .login-info{
			flex-direction: column-reverse;
			margin-top: 0;
			align-items: center;
		}
		.login-container2 .login-info .login-helper{
			padding: 1rem;
		}
		.login-container2 .login-info .login-helper h2{
			font-size: 36px;
		}
		.login-container2 .login-info .login-helper .typed-text{
			font-size: 24px;
			min-height: 34px;
		}
	}
	@media only screen and (max-width : 479.97px) {
		.login-container2 .login-info .login-section{
			width: 100%;
			flex: 0 0 100%;
		}
	}
	/*New Login screen Ends*/
	/**** Home panel page specific style  ****/
	
	
	.main-content{height:85%;}
	.panel-container {
		display: table;
		width: 90%;
		margin: 0 auto;
	}
	.link-block{padding:15px 0; min-width:205px; text-align:center; display:block; cursor:pointer;}
	.link-block img{height:40px;}
	
	.top-block-primary{background:#005c99;}
	.top-block-secondary{background:#2ecc71;}
	.bottom-block-primary{background:#9b59b6; padding:51px 0;}
	.bottom-block-secondary{background:#e67e22; padding:51px 0;}
	.layout-divider{display:block; height:10px; clear:both;}
	
	.link-block:hover{text-decoration:none}
	.link-block b{opacity:1; transition:all 0.50s ease; margin-top:10px; display:block; color:#fff; text-transform:uppercase; font-family:'OpenSansSemibold';  font-weight:normal; font-size:16px;}
	
	.link-block:hover b{opacity:1; transition:all 0.50s ease; color:#fff;}
	
	.update-panel{display:block; color:#fff; box-sizing: border-box; margin-left: 15px;    padding: 0;}
	.update-panel ul{background:#34495e; padding:20px 0px 20px 50px;overflow:auto; height:265px;}
	
	.update-panel li{font-size:14px; line-height:30px; color:#fff;}
	.update-panel li:first-child{margin-top:25px;}
	.update-title{background: #34495e none repeat scroll 0 0; display: block; font-family: "OpenSansSemibold"; font-size: 16px; font-weight: normal; margin: 0 0 0 31px; padding: 15px 0 10px;  position: absolute; text-transform: uppercase;  width: 90%;}
	.alerts-panel{display:block; color:#fff; box-sizing: border-box; margin-left: 15px;    padding: 0;}
	.alerts-panel ul{background:#e74c3c; padding:20px 0px 20px 34px;overflow:auto; height:220px;}
	
	.alerts-panel li{font-size:14px; line-height:30px; color:#fff; list-style-type:none; padding-left:30px;}
	.alerts-panel li:first-child{margin-top:25px;}
	.warning-icon{min-height:15px; background:url(../images/warning-icon.png) 0px 7px no-repeat;}
	.error-icon{min-height:15px; background:url(../images/error-icon.png) 0px 7px no-repeat;}
	.alerts-title{background: #e74c3c none repeat scroll 0 0; display: block; font-family: "OpenSansSemibold"; font-size: 16px; font-weight: normal; margin: 0 0 0 31px; padding: 15px 0 10px;  position: absolute; text-transform: uppercase;  width: 90%;}
	
	.small-heading{font-size:16px; color:#0e0e0e; text-transform:uppercase; font-family:'OpenSans';  font-weight:normal; padding:0px 0 2px; margin:5px 0 5px; background:url(../images/heading-border.png) bottom left no-repeat;}
	
	
	/**** Filter and search form section style  ****/
	
	
	.search-bar {
		height: 34px;/*29px;*/
		background-color:transparent;
		position:relative;
		border-bottom:1px solid #8d8d8d;
		color:#5d5d5d;
		font-size:14px;
	}
	
	.search-bar .searchbutton {
		position:absolute;
		top:23%;
		right:5px;
		outline:none;
	}
	.search-bar .input-group-btn .btn{
		background: transparent;
		border: none;
	}
	.sfield {
		float: left;
		margin: 5px 0 0 0px;
		color:#5d5d5d;
		font-size:14px;
		height: 20px;
		line-height: 18px;
		padding: 0;
		background: transparent;
		border: 0;
		width:100%;
		outline:none;
	}
	
	.viewdata-interval{
		border:none;
		border-bottom:1px solid #000;
		color:#5d5d5d;
		font-size:14px;
		background:none;
		width:35%;
		margin:0 0 0 20px;
		height: 29px;
		outline:none;
	}
	.input-with-icon {
		display: inherit;
		position: relative;
	}
	.input-with-icon>i {
		position: absolute;
		right: 5px;
		top: 8px;
	}
	.page-title {
		color: #316e9d;
		font-size: 20px;
		text-transform: uppercase;
	}
	
	
	
	
	
	/**** Dashboard page ****/
	
	.data-view{
		display: flex;
		width: 100%;
		align-items: flex-end;
	}
	.data-view-value {
		width: 100%;
		display: flex;
		justify-content: space-around;
	}
	.data-view-number {
		font-family: 'opensansbold';
		font-size: 30px;
	}
	.data-view-element {
		color: #7b7e8a;
		font-size: 14px;
	}
	.status-info {
		padding: 10px 15px;
		color: #fff;
	}
	.status-number {
		font-size: 30px;
		font-family: 'opensans';
		font-weight: bold;
		margin-bottom: 15px;
	}
	.status-data{
		width: 50%;
		float: left;
	}
	.status-graph {
		width: 50%;
		float: left;
		height: 97px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.status-graph img{
		max-height: 100%
	}
	.purple-font{
		color: #716aca;
	}
	.sky-font{
		color: #39c5dc;
	}
	.green-font{
		color: #23b14d !important;
	}
	.red-font{
		color: #f1494f !important;
	}
	.text-blue{
		color: #3895e3 !important;
	}
	.orange-font{
		color: #f39c12 !important;
	}
	.black-font{
		color: #000 !important;
	}
	.sr-no,
	.currency-symbol{color:#ff585a; font-size:18px;font-family:'OpenSansSemibold'; border-right:1px solid #cfcfcf; width:25px; padding:0 25px 0 15px; float:left; line-height:34px;}
	
	.number-value{color:#025d9c; font-size:16px;font-family:'OpenSansSemibold'; margin:0 0 0 15px; line-height:34px; float:left;}
	.amount-value{color:#016f01; font-size:18px;font-family:'OpenSansSemibold'; margin:0 0 0 15px; line-height:34px; float:left;}
	
	.info-about{float:right; margin-right:10px; width:20px; text-align:center; color:#c4cace; line-height:34px;}
	
	.info-about a{color:#c4cace;}
	.info-about a:hover,
	.info-about a:focus{color:#2980B9;}
	
	.data-view-wrap .popover{color:#777;font-family:'OpenSans';}
	.data-view-wrap .popover h3{color:#000;font-family:'OpenSansSemibold'; }
	
	.pin-link{color:#2980b9;-ms-transform: rotate(14deg); /* IE 9 */
		-webkit-transform: rotate(14deg); /* Chrome, Safari, Opera */
		transform: rotate(14deg); position:absolute; margin-left:20px; margin-top:-4px; font-size:18px;}
	
	.info-box{
		color: #fff;
		margin: 10px 3px;
		text-align: left;
		font-size: 16px;
		height: 130px;
		padding: 8px 10px;
		border-radius: 4px;
		width: 20%;
		display: inline-block;
	}
	.kpi-number {
		font-size: 24px;
		font-weight: bold;
	}
	.kpi-detail {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
	.kpi-graph{
		height: 66px;
	}
	.kpi-graph img{
		max-width: 100%;
		height: 100%;
		margin: 0 auto;
	}
	.info-box h4{font-size:30px; font-weight:700;}
	
	
	.pink-box{background:#ff4081}
	.Dblue-box{background:#3f51b5}
	.purple-box{background: #8E44AD;}
	.green-box{background:#26a69a}
	.blue-box{background: #2196f3}
	.yellow-box{background: #ffae00}
	.red-box{background: #de3d3d}
	.grey-box{background:#7f8c8d}
	
	.red-box i,
	.green-box i,
	.blue-box i{float:right; font-size:50px; opacity:0.5; margin-top:-54px;}
	
	
	.emp-headcount{
		width: 200px; 
		height: 200px; 
		border: 5px solid #399fe0; 
		border-radius: 100%; 
		margin: 0 auto;
	}

	.emp-headcount img{
		width: 130px; 
		height: auto; 
		margin: 20px auto;
	}

	.onboarding-metrics{
		border-left: 3px solid #2bc32b; 
		padding-bottom: 5px; 
		padding-top: 5px;
	}
	.onboarding-metrics .title{ 
		text-transform: uppercase; 
		font-weight: 600; 
		font-size: 18px;
	}
	.onboarding-metrics-border{
		margin-top: 10px; 
		border-bottom: 1px dashed #cacaca;
	}
	.onboarding-metrics-table p{
		border-bottom: 1px dashed #dcdcdc;
		padding-bottom: 10px;
		padding-top: 10px;
		margin-bottom: 0;
    	        font-weight: 600;
	}

	.onboarding-no-data{    
		height: 350px;
		text-align: center;
		padding-top: 20%;
	}

	/**** Media query section ****/
	
	
	@media (min-width: 768px) and (max-width:1366px){
	
			/* img.shape-one{
			height:495px;
			}
	
			img.shape-two{
			height:377px;
			}*/
	
			.form {
			margin-left: 325px;
			margin-top: 150px;
			width: 350px;
			}
	
			#login-form .form-box-left {
			margin: 60px 0 0;
			min-height: 120px;
			width: 215px;/*250px;*/
			}
	
			#login-form .form-box-right {
			margin: 55px 0 0;
			right: -40px;
			}
			#forgot-password-form {
			margin-left: 325px;
			margin-top: 123px;
			position: absolute;
			width: 343px;
			z-index: 3;
			}
	
			.form-box-left {
			float: left;
			position: relative;
			width: 270px;
			margin: 28px 0 0 0;
			min-height: 165px;
			}
	
			.shape h3{
			font-size: 16px;
			}
	
			#register-form .form-box-left {
				margin: 39px 0 20px;
				width: 195px;
			}
	
			#register-form {
				margin-left: 325px;
				margin-top: 67px;
				width: 351px;
			}
	
			#register-form input[type="text"],
			#register-form input[type="password"] {
				width: 180px;
			}
	
			#forgot-password-form .form-box-right {
				margin: 31px 0 0;
			}
	
			#register-form .form-box-right {
				margin: 86px 0 0;
			}
			.shape {
				margin: 15px auto 0;
			}
	
			.forgot-password-form,
	#forgot-password-form{
		position: absolute;
		z-index: 3;
		margin-top: 140px !important;
		width: 340px !important;
		margin-left: 335px !important;
	}
	.forgot-password-form .form-box-left,
	#forgot-password-form .form-box-left{
		margin:15px 0 0 0 !important;
	}
	
	.forgot-password-form .form-box-right,
	#forgot-password-form .form-box-right{
		margin:18px 0 0 0 !important;
	}
	
	}
	
	@media (min-width: 320px) and (max-width:1024px){
	
			.data-view-wrap, #trends-data-view-wrap .data-view-wrap, #timesheet-data-view-wrap .data-view-wrap{width:100%; display:block;}
	
			div.data-view-wrap:last-of-type, #trends-data-view-wrap div.data-view-wrap:last-of-type, #timesheet-data-view-wrap div.data-view-wrap:last-of-type{margin:0px; width:100%;}

			
	
	}
	
	/*** Comparison Page ***/
	
	.blue-panel,
	.green-panel,
	.red-panel,
	.orange-panel,
	.yellow-panel{
		padding-left:0 !important;
		padding-right:0 !important;
		padding-bottom:0 !important;
		text-align:center;
	}
	
	
	.blue-panel table,
	.green-panel table,
	.red-panel table,
	.orange-panel table,
	.yellow-panel table{
		margin-bottom:0 !important;
	
	}
	
	.blue-panel td,
	.green-panel td,
	.red-panel td,
	.orange-panel td,
	.yellow-panel td{
		border-right:1px solid #d7d7d7 !important;
	}
	
	.blue-panel .heading a i,
	.green-panel .heading a i,
	.red-panel .heading a i,
	.orange-panel .heading a i,
	.yellow-panel .heading a i{
		color:#fff;
		margin-right:10px;
	}
	
	.blue-panel{
		border-bottom:5px solid #2980b9 !important;
	}
	
	.green-panel{
		border-bottom:5px solid #16a085 !important;
	}
	
	.red-panel{
	border-bottom:5px solid #c0392b !important;
	}
	
	.orange-panel{
	border-bottom:5px solid #d35400 !important;
	}
	
	.yellow-panel{
	border-bottom:5px solid #f39c12 !important;
	}
	
	.remove-box a{
	font-size: 14px;
	color: #626262;
	border-radius: 20px;
	border: 2px solid #626262;
	padding: 0px 4px;
	/* line-height: 40px; */
	margin: 0 0 10px 0;
	}
	
	.blue-panel .heading{
	background:#2980b9;
	font-size:16px;
	color:#fff;
	font-family:'OpenSansSemibold';
	height:36px;
	line-height:36px;
	border-right:1px solid #d7d7d7 !important;
	border-left: 1px solid #d7d7d7 !important;
	}
	
	.keyword-box .mid-input{
		min-width: 140px !important;
		display: inline-block;
	}
	.blue-panel .keyword-box{
	background:url(../images/blue-panel-bg.jpg) center -2px no-repeat;
	height:100px;
	padding:10px 5px;
	background-size:100% 85%;
	border-right:1px solid #d7d7d7 !important;
	border-left: 1px solid #d7d7d7 !important;
	}
	
	
	.green-panel .heading{
	background:#16a085;
	font-size:16px;
	color:#fff;
	font-family:'OpenSansSemibold';
	height:36px;
	line-height:36px;
	border-right:1px solid #d7d7d7 !important;
	}
	
	.green-panel .keyword-box{
	background:url(../images/green-panel-bg.jpg) center -2px no-repeat;
	height:100px;
	padding:10px 5px;
	background-size:100% 85%;
	border-right:1px solid #d7d7d7 !important;
	}
	
	
	.red-panel .heading{
	background:#c0392b;
	font-size:16px;
	color:#fff;
	font-family:'OpenSansSemibold';
	height:36px;
	line-height:36px;
	border-right:1px solid #d7d7d7 !important;
	}
	
	.red-panel .keyword-box{
	background:url(../images/red-panel-bg.jpg) center -2px no-repeat;
	height:100px;
	padding:10px 5px;
	background-size:100% 85%;
	border-right:1px solid #d7d7d7 !important;
	}
	
	
	.orange-panel .heading{
	background:#d35400;
	font-size:16px;
	color:#fff;
	font-family:'OpenSansSemibold';
	height:36px;
	line-height:36px;
	border-right:1px solid #d7d7d7 !important;
	}
	
	.orange-panel .keyword-box{
	background:url(../images/orange-panel-bg.jpg) center -2px no-repeat;
	height:100px;
	padding:10px 5px;
	background-size:100% 85%;
	border-right:1px solid #d7d7d7 !important;
	}
	
	.yellow-panel .heading{
	background:#f39c12;
	font-size:16px;
	color:#fff;
	font-family:'OpenSansSemibold';
	height:36px;
	line-height:36px;
	border-right:1px solid #d7d7d7 !important;
	}
	
	.yellow-panel .keyword-box{
	background:url(../images/yellow-panel-bg.jpg) center -2px no-repeat;
	height:100px;
	padding:10px 5px;
	background-size:100% 85%;
	border-right:1px solid #d7d7d7 !important;
	}
	
	table.compare-list{
	border-right:1px solid #d7d7d7 !important;
	margin-top:100px;
	}
	
	.equalizer{
		padding-top:144px !important;
	}
	
	table.compare-list td{
	padding-left:0px;
	padding-right:0px;
	text-align:right;
	}
	
	#compare-table tr td{
		font-size: 14px;
		font-weight: 600;
	}

	.compare-kpi .btn{
		border: none;
		text-align: left;
	}
	.compare-kpi .btn-default:hover{
		background: transparent;
	}

	.compare-kpi .btn .caret{
		float: right;
		margin-top: 8px;
	}

	.compare-kpi .btn:active, .compare-kpi .btn.active{
		box-shadow: none;
	}

	/**** Chart demos ****/
	
	#container,
	#container2{
		margin: 0 auto
	}
	
	
	/**** Report Page ****/
	
	.report-filter .viewdata-interval{
		width:46%;
		margin:10px 1%;
	}
	
	.report-sr-no{
		width: 60px;
	}

	.report-name{
		width: 300px;
	}
	#onboarding-table{
		width: 500px;
	}
	#onboarding-table tr th{
		color: #3895e3;
		width: 50%;
	}
	#onboarding-table tr td{
		font-weight: 600;
		font-size: 14px;
	}

	/* .report-description{

	} */

	/*employee detail report css*/

	#emp-detail-report .filter-Popover .popover{
		width: 680px;
		top: -79px !important;
	}

	#emp-detail-report .filter-Popover .popover.right > .arrow{
		top: 22% !important;
	}
	
	/*employee detail report css over*/

	/*** Trends Page ****/
	
	.arcat-list {
	 border-right:1px dashed #ddd;
	}
	.arcat-list h4{
	 font-size:14px;
	 text-transform:uppercase;
	 font-family:'OpenSansSemibold';
	 margin:0 0 10px 0;
	 padding:0 0 5px 0;
	}
	
	.arcat-list ul{
	 margin:0;
	 padding:0;
	}
	
	.arcat-list li{
	 margin:0;
	 padding:0;
	 list-style-type:none;
	 line-height:30px;
	}
	
	.arcat-list span{
	 width:10px;
	 height:10px;
	 display:inline-block;
	 margin-right:5px;
	}
	
	.lightblue-square{
	 background:#3ad9ea;
	}
	
	.darkblue-square{
	 background:#3aa0ea;
	}
	
	.lightgreen-square{
	 background:#2ee2a1;
	}
	
	.darkgreen-square{
	 background:#1aa774;
	}
	
	.lightorange-square{
	 background:#fdb354;
	}
	
	.darkorange-square{
	 background:#d68a28;
	}
	
	/***** Meta Data  ****/
	
	.metadata-value {color:#025d9c; font-size:40px;font-family:'OpenSansSemibold'; float:left; text-decoration:none; display:inline;}
	h4 span.metadata-value {color:#025d9c; font-size:40px;font-family:'OpenSansSemibold'; float:right; text-decoration:none; display:inline;}
	.metadata-value a{color:#025d9c; font-size:14px; text-decoration:none; display:inline; float:right; margin-right:5px;}
	
	.metainfo-about{color:#555;float:left; display:inline;font-size:12px;}
	.metainfo-about a{color:#025d9c; font-size:14px;font-family:'OpenSansSemibold'; text-decoration:none;}
	
	.name-format{font-size:14px !important;font-family:'OpenSansSemibold';}
	
	
	tfoot{font-weight:700; font-size:12px;}
	
	.select-custom{
	 border:none;
	 border-bottom:1px solid #000;
	 color:#5d5d5d;
	 font-size:14px;
	 background:none;
	 margin:5px 2% 15px;
	 width:94%;
	 height: 29px;
	 outline:none;
	}
	
	.select-custom .top-header h3{margin-top: 17px;}
	
	.modal-header {
		border-bottom: 1px solid #dcdcdc !important;
		background: #dbf3f9;
	}
	
	.alert{
		margin-top: 40px;
	}
	/*Dropdown-menu CSS*/
	/* To Dropdown navbar dropdown on hover */
	.navbar-nav > li:hover > .dropdown-menu {
		display: block;
	}
	.dropdown-submenu {
		position: relative;
	}
	
	.dropdown-submenu>.dropdown-menu {
		top: 0;
		left: 100%;
		margin-top: -6px;
		margin-left: -1px;
		-webkit-border-radius: 0 6px 6px 6px;
		-moz-border-radius: 0 6px 6px;
		border-radius: 0 6px 6px 6px;
	}
	
	.dropdown-submenu:hover>.dropdown-menu {
		display: block;
	}
	
	.dropdown-submenu>a:after {
		display: block;
		content: "\f105";
		float: right;
		width: 0;
		height: 0;
		font: normal normal normal 14px/1 FontAwesome;
		border-color: transparent;
		border-style: solid;
		/* margin-right: -5px; */
		margin-right: -15px;
	}
	.dropdown-submenu.pull-left {
		float: none;
	}
	
	.dropdown-submenu.pull-left>.dropdown-menu {
		left: -100%;
		margin-left: 10px;
		-webkit-border-radius: 6px 0 6px 6px;
		-moz-border-radius: 6px 0 6px 6px;
		border-radius: 6px 0 6px 6px;
	}	
	.dropdown-menu > li > a{
		/* padding: 8px 20px; */
		padding: 8px 30px 8px 15px;
	}
	.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
		color: #fff;
		background-color: #039299;
	}

	/* #manage-submenu .nav .open > a, #manage-submenu .nav .open > a:hover, #manage-submenu .nav > a:focus {
		background-color: #004a6b;
		border-color: #337ab7;
	} */

	.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
		background-color: #039299;
		border-color: #337ab7;
	}

	.dropdown-menu.adjust-menu.pull-right, .dropdown-menu.adjust-menu.float-right {
		right: 100%;
		left: auto;
	}
	/*Modal-css*/
	.check-body {
		display: flex;
		justify-content: space-around;
		margin-bottom: 10px;
	}
	.modal-footer {
		padding: 15px;
		text-align: right;
		background: #dbf3f9;
	}
	.footer-btn {
		font-weight: bold;
		color: #000;
		font-size: 15px;
	}
	.footer-btn.text-primary{
		color: #337ab7
	}
	/*Radio CSS*/
	.body-top {
		padding: 15px;
		border-bottom: 1px solid #dcdcdc;
	}
	.radio.radio-custom input[type="radio"], .radio-inline.radio-custom input[type="radio"], .checkbox.radio-custom input[type="checkbox"], .checkbox-inline.radio-custom input[type="checkbox"]{
		position: inherit;
		margin-left: 0;
	}
	.label-mini {
		font-size: 14px;
		color: #838383;
	}
	.lable {
		font-size: 18px;
	}
	/*Popover CSS*/
	.popover{
		font-family: 'OpenSans'
	}
	.filter-Popover .popover{
		max-width: 1000px;
		padding-bottom: 15px !important;
		padding-top: 10px;
		font-family: 'OpenSans';
	}
	#holidayFilter .filter-Popover .popover{
		max-width: 600px;
	}
	
	.graph-timesheet .popover{
		max-width: 310px;
		font-family: 'OpenSans';
	}
	
	.exception-title{
		background: transparent;
		color: #ff0000;
	}
	.exception-label-size{
		position: relative;
	}
	
	.exception-label-size.active + p.exception-name-text{
		font-weight: 600;
		color:#004a6b;
	}

	.uib-timepicker .form-control{
		padding-right: 5px;
	}
	.timesheet-popover.popover{
		min-width:500px;
	}
	
	.has-error-custom label{
		color:red !important;
	}

	.active.exception-label-size:before{
		content: "\f00c";
		font: normal normal normal 10px/1 FontAwesome;
		height: 10px;
		width: 10px;
		position: absolute;
		top: 0px;
		color: #fff;
		left: 0px;
	}
	
	.supervisor-coment{
		color:grey;
	}
	.custom-button button,.custom-button input[type="submit"]{
		float: right;
		margin-left: 5px;
		margin-bottom: 10px;
		height: 30px;
		padding: 5px 15px;
	}
	.filter-Popover  .glyphicon-filter{
		color: #8d8d8d;
		font-size: 22px;
		float: left;
	}
	.new-schedule-popover>.popover{
		min-width: 570px;
		font-family: 'OpenSans';
	}
	a.tab-main, a.tab-main:last-child {
		padding: 2px 16px;
		background: none;
		border: 1px solid #ccc;
		box-shadow: none;
		border-radius: 4px;
		color: #a2a2a2;
		cursor: pointer;	
		margin-right: 4px;
	}
	a.tab-main:last-child{
		margin-right: 0px;
	}
	a.tab-main.active{
		background: #00aeef;
		border-color:#00aeef; 
		color: #ffffff;
	}
	.week-tab{
		margin-bottom: 10px;
	}
	
	.alertify {
		z-index: 9999 !important;
	}
	.alertify-logs {
		z-index: 9999 !important;
	}
	
	.alertify-logs > .error{
		color:white !important;
	}
	/*Timesheet Agent Detail css*/
	.user-profile {
		/* width: 180px; */
		/* height: auto; */
		float: left;
		width: 15%;/*195px<-212px;*/
		height: 212px;
		background-color: #00b0f0;
		/* margin-right: 15px; */
		border: 1px solid #000;
	}
	.user-profile img{
		width: 100px;
		height: auto;
		border: 1px solid #fff;
		margin-left: 23%;
		margin-top: 25%;
		/* margin-left: 47px;
		margin-top: 55px; */
	}
	#timesheet-user-profile .user-profile {
		width: 180px;
		height: 180px;
		margin-right: 15px;
		margin-bottom: 15px;
	}
	#timesheet-user-profile .user-profile img {
		margin-left: 40px;
		margin-top: 40px;
	}

	.user-details {
		overflow: hidden;
	}
	.user-name {
		font-size: 20px;
		font-family: 'opensansbold';
		color: #3895e3;
		margin-bottom: 5px;
	}
	ul.user-more-info {
		padding: 0;
		list-style: none;
		float: left;
		color: #777777;
		margin-right: 25px;
	}
	.info-title {
		display: inline-block;
		width: 150px;
		font-family: 'opensansbold';
	}
	
	.emp-info-block{
		display: inline-block;
		padding-right: 15px;
		width:212px;/*200px*/
		float: left;
	}
	.not-editable{
		border: 1px solid #000;
		background-color: #f9f9f9;
		padding: 10px;
		width: 85%;
	}
	.not-editable label{
		margin-bottom: 0 !important;
	}
	.not-editable p{
		margin-bottom: 5px !important;
	}
	.editable{
		margin-left: 15px;
	}
	.editable .emp-info-block{
		width: 190px;
	}
	.emp-info-block-lg{
		width:428px; /*500px*/    
		display: inline-block;
	}
	.emp-info-block-lg p, #emp-history form  p{
		display: inline-block;
	}
	.employee-info .form-group, .emp-info-block-lg .form-group,
	#emp-history .form-group{
		margin-bottom: 0 !important;
	}
	
	#emp-history span.label.label-warning {
		font-size: 14px;
		font-weight: normal;
		margin-left: 30px;
	}
	#emp-history .link{
		margin-left: 45px;
    	text-decoration: underline;
    	cursor: pointer;
	}

	@media (max-width: 1279px) { 
		.user-profile{
			width: 120px;
    		        height: 212px;
		}
		.user-profile img{
			margin-left: 9px;
			margin-top: 55px;
		}
	}
	/*CSS for manage-schedule.html, addSchedule.html & assignCampaign.html*/
	
	.p-t-8{
		padding-top: 8px;
	}
	.date-rang{
		padding-top: 8px;
		margin: 0;
	}
	.schedule-name{
		border-bottom: 1px solid #dcdcdc;
		float: left;
		/*display: inline-flex;*/
		width: 100%;
	}
	.schedule-name-txt{
		width: 80%;
	}
	.schedule-name p{
		/* display: inline-block; */
		word-wrap: break-word;
	}
	.schedule-name i.fa.fa-trash{
		color: red;
		padding-left: 10px;
		font-size: 20px;
	}
	.daily-schedule{
		display: flex;
		padding-bottom: 10px;
	}
	.daily-schedule-icon{
		font-size: 18px;
		color: #16a916;
	}
	.daily-schedule-text{
		padding-left:10px;
		text-align: center;
	}
	.daily-schedule-text p{
		margin-bottom: 3px;
	}
	.daily-break-icon{
		font-size: 18px;
		color: #da0303;
	}
	.open-schedule{
		color:#ef8d00;
	}
	.open-schedule i{
		font-size: 18px;
		padding-left: 10px;
		color:#ef8d00;
	}
	.Not-schedule-icon{
		font-size: 24px;
	}
	.breakTime-section{
		border: 1px solid #e5e5e5;
		margin-bottom: 15px;
		padding-bottom: 10px;	
	}
	.breakTime-section h4{
		color: #209ac8;
	}   
	.breakTime-section .col-sm-4{
		padding-left: 0;
	}
	.breakTime-section p{
		font-size: 12px;
		color: #ff8600;
		margin-bottom: 0;
	}
	.breakTime-section button{
		padding: 7px 15px;
		font-size: 12px;
	}
	.breakTime-section .week-tab{
		margin-bottom: 7px;
	}
	.breakTime-section a.tab-main, .breakTime-section a.tab-main:last-child {
		padding: 1px 10px 1px 10px;
		font-size: 12px;
	}
	.breakTime-section a.tab-main.active {
		background: #50a7c8;
		border-color: #50a7c8;
	}
	.table-w-100{
		width: 100%;
	}
	.break-list-table table tbody{
		background: transparent;
	}
	.break-list-table{
		border-top: 1px solid #e5e5e5;
		padding-top: 5px;
		margin-top: 5px;
		font-size: 12px;
	}
	.break-list-table table th{
	color: #00aeef;
	}
	.break-list-table table td i{
		color: #afafaf;
		cursor: pointer;
	}
	
	.custom-chechbox, .custom-radiobtn {
		position: relative;
		padding-left: 28px !important;
		cursor: pointer;
	}
	/* Hide the browser's default checkbox */
	.custom-chechbox input, .custom-radiobtn input {
		position: absolute;
		opacity: 0;
		cursor: pointer;
	}
	
	/* Create a custom checkbox */
	.checkmark, .checkmark-radio {
		position: absolute;
		top: 0px;
		left: 0px;
		height: 20px;
		width: 20px;
		background-color: #cecece;
	}
	
	/* On mouse-over, add a grey background color */
	.custom-chechbox:hover input ~ .checkmark, .custom-radiobtn:hover input ~ .checkmark-radio {
		background-color: #ccc;
	}
	
	/* When the checkbox or radio button is checked, add a blue background */
	.custom-chechbox input:checked ~ .checkmark, .custom-radiobtn input:checked ~ .checkmark-radio {
		background-color: #2196F3;
	}
	
	/* Create the checkmark/indicator (hidden when not checked) or Create the indicator (the dot/circle - hidden when not checked) */
	.checkmark:after, .checkmark-radio:after {
		content: "";
		position: absolute;
		display: none;
	}
	
	/* Show the checkmark when checked */
	.custom-chechbox input:checked ~ .checkmark:after, .custom-radiobtn input:checked ~ .checkmark-radio:after  {
		display: block;
	}
	
	/* Style the checkmark/indicator */
	.custom-chechbox .checkmark:after {
		left: 7px;
		top: 3px;
		width: 7px;
		height: 13px;
		border: solid white;
		border-width: 0 3px 3px 0;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	
	.scheduleAgentTable{
		height: 230px;
		overflow-y: auto;
		margin-bottom: 15px;
		padding-top:5px;
	}
	
	.allready-scheduled{
		color: #ffa500 !important;
	}
	
	/* Create a custom radio button */
	.checkmark-radio {
		top: 0;
		left: 0;
		border-radius: 50%;
	}
	
	/* Style the indicator (dot/circle) */
	.custom-radiobtn .checkmark-radio:after {
		top: 6px;
		left: 6px;
		width: 9px;
		height: 9px;
		border-radius: 50%;
		background: white;
	}
	
	.pto-radiobtn{
		display: inline-flex;
		margin-right: 15px;
	}
	.form-control-feedback{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.form-control-feedback>i+i{
		pointer-events: auto;
		cursor: pointer;
	}
	
	/**********Manage Hierarchy CSS********/
	.manageHierarchy-container{
		width: 100%;
		overflow: auto;
	}
	
	.manageHierarchy-inner-container{
		width: 100%;
		white-space: nowrap;
		overflow: auto;
		/* height: calc(100vh - 210px); */
	}
	
	.manageHierarchy-blocks{
		width: 297px;
    	margin-right: 10px;
    	display: inline-block;
    	vertical-align: top;
	}
	
	.manageHierarchy-blocks .list-group-item{
		border-radius: 0;
	}
	
	.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus{
		background-color:#f3f3f3;
		color:#3895e3;
		border-color: #ddd;
	}
	
	a.title:hover, button.title:hover, a.title:focus, button.title:focus{
		background-color: #fbfbfb;
		color: #000;
	}
	
	.manageHierarchy-blocks .title{
		font-weight: 600;
		color: #000;
		background-color: #fbfbfb;
	}
	
	.manageHierarchy-blocks a i{
		float: right;
		padding-top: 2px;
		font-size: 18px;
	}

	.hierarchi-inner-list{
		height: calc(100vh - 310px);
		overflow: auto;
	}
	.hierarchi-inner-list button{
		width: 100%; background: #dbf3f9; margin-top: 5px;
	}
	
	.manageHierarchy-blocks .add-new{
		color: #3895e3;
		font-weight: 600;
		padding-bottom: 5px;
	}
	.w-65{
		width: 65px;
	}
	
	.w-75{
		width: 75px;
	}
	
	.w-95{
		width: 95px;
	}
	
	.w-115{
		width: 115px;
	}
	
	.hierarchi-Search {
		/* width: 96%; */
		vertical-align: middle;
		white-space: nowrap;
		position: absolute;
		right: 5px;
		top:6px
	}
	
	.hierarchi-Search .icon {
		position: absolute;
		margin-top: 3px;
		z-index: 1;
		color: #4f5b66;
		right: 5px;
	}
	
	.hierarchi-Search input#search {
		width: 26px;
		height: 28px;
		background: #fbfbfb;
		border: 1px solid #ccc;
		font-size: 10pt;
		float: right;
		padding-left: 26px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		color: #000;
		-webkit-transition: width .55s ease;
		-moz-transition: width .55s ease;
		-ms-transition: width .55s ease;
		-o-transition: width .55s ease;
		transition: width .55s ease;
	}
	
	.hierarchi-Search input#search:focus, .hierarchi-Search input#search:active{
	outline:none;
	width: 287px;
	}
	
	/* .hierarchi-Search:hover input#search{
	width: 100%;
	} */

	/* .hierarchi-Search span:hover + input#search {
		width: 287px;
	} */
	
	.hierarchi-Search:hover .icon{
	color: #93a2ad;
	}
	
	.inactive-hierarchy-label {
		width: 8px;
		height: 8px;
		border-radius: 10px;
		margin-top: 6px;
		float: left;
		margin-right: 5px;
		background-color: #F44336;
	}

	.active-hierarchy-label {
		width: 8px;
		height: 8px;
		border-radius: 10px;
		margin-top: 6px;
		float: left;
		margin-right: 5px;
		background-color: #1dc100;
	}

	.hierarchy-text{
		width: 220px;
		text-overflow: ellipsis;
		overflow: hidden;
		display: inline-block;
	}

	.f-left{
		float: left;
		font-size: 16px;
		margin-bottom: 0;
	}
	
	#main-payPeriod-content .nav > li > a:hover, #main-payPeriod-content .nav > li > a:focus {
		text-decoration: none;
		background-color: #fff !important;
		color: #337ab7;
	}
	
	#main-payPeriod-content .well {
		margin-bottom: 5px !important;
		padding: 10px;
	}
	
	#main-payPeriod-content .btn{
		padding: 5px 5px;
	}
	
	.upcoming-pay{
		font-size: 18px;
		color: #2980b9;
		display: inline-block;
		border-bottom: 3px solid #2980b9;
	}
	
	.list-brdr{
		border: 1px solid #e8e8e8;
		margin-bottom: 5px;
		padding: 10px 0;
		display: flex;
		align-items: center;
	}
/*CSS for showing current pay period differently*/
	.currentPay-period{
		border-left: 5px solid #32bb37;
		background: #fdfdfd;
	}
	
	.list-scroll{
		max-height: 400px !important;
		overflow: auto;
	}
	
	.pay-periodName{
		color: #3895e3;
		font-size: 16px;
	}
	
	.pay-periodCreator{
		padding-left: 10px;
		color: #9e9e9e;
	}
	
	.lb-size{
		font-size: 16px;
	}
	
	.current-btn > i{
		margin-top: 10px;
	}
	
	.current-btn > .btn{
			display: inline-block;
			padding: 6px 12px;
			margin-bottom: 0;
			font-size: 14px;
			font-weight: normal;
			line-height: 1.42857143;
			text-align: center;
			white-space: nowrap;
			vertical-align: middle;
			-ms-touch-action: manipulation;
			touch-action: manipulation;
			cursor: pointer;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
			user-select: none;
			background-image: none;
			border: 1px solid #4cae4c;
			border-radius: 4px;
			background: transparent;	
			color: #888;
	}
	
	
	/**********Tab***********/
	
	.custom-tab .nav-tabs > li > a {
		color: #bbb;
	}
	.custom-tab .nav-tabs > li.active > a, .custom-tab .nav-tabs > li:hover > a, .custom-tab .nav-tabs > li.active > a:focus, .custom-tab .nav-tabs > li.active > a, .custom-tab .nav-tabs > li.active > a:hover {
		border: 1px solid #dddddd;
		border-bottom-color: transparent;
		color: #555;
		border-top: 4px solid #2980b9;
		background: #fff;
	}
	.custom-tab .nav-tabs > li > a:hover{
		border: 1px solid #dddddd;
		background-color: #f8f9fb;
		color: #888;
	}
	/*
	.reasoncode-tab .nav-tabs > li > a {
		color: #bbb;
	}
	.reasoncode-tab .nav-tabs > li.active > a, .reasoncode-tab .nav-tabs > li:hover > a, .reasoncode-tab .nav-tabs > li.active > a:focus, .reasoncode-tab .nav-tabs > li.active > a, .reasoncode-tab .nav-tabs > li.active > a:hover {
		border: 1px solid #dddddd;
		border-right-color: transparent;
		color: #555;
		background: transparent;
	}
	.reasoncode-tab .nav-tabs > li > a:hover{
		border: 1px solid #dddddd;
		background-color: #f8f9fb;
		color: #888;
	}
	.reasoncode-tab .nav-tabs > li.active > a:after {
		content: "";
		position: absolute;
		width: 2px;
		height: 100%;
		background: #fff;
		right: -2px;
		top: 0;
		z-index: 1;
	}*/
	
	#vertical_tab .nav-tabs > li > a {
		color: #a2a2a2;
		background-color: #fbfbfb;
	}
	#vertical_tab .nav-tabs > li.active > a, #vertical_tab .nav-tabs > li:hover > a, #vertical_tab .nav-tabs > li.active > a:focus, #vertical_tab .nav-tabs > li.active > a, #vertical_tab .nav-tabs > li.active > a:hover {
		border: 1px solid #dddddd;
		border-right-color: transparent;
		color: #555;
		background: transparent;
		font-weight: 600;
	}
	#vertical_tab .nav-tabs > li > a:hover{
		border: 1px solid #dddddd;
		background-color: #f8f9fb;
		color: #888;
	}
	#vertical_tab .nav-tabs > li.active > a:after {
		content: "";
		position: absolute;
		width: 2px;
		height: 100%;
		background: #fff;
		right: -2px;
		top: 0;
		z-index: 1;
	}
	
	#vertical_tab .ui-select-multiple.ui-select-bootstrap{
		height: auto; /*34px*/
		min-width: 85%; /*90%*/
	}
	#vertical_tab .ui-select-multiple.ui-select-bootstrap .ui-select-match-item{
		border-right: 1px solid #ccc;
	}
	
	#vertical_tab .ui-select-multiple.ui-select-bootstrap input.ui-select-search{
		width: 440px !important;
	}

	/******Custom button css*****/
	.btn-primary{
		border-radius: 0;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: #337ab7;
	}
	.btn-success{  
		background-color: #32bb37;   
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
	}
	
	.btn-success:hover {
		color: #fff;
		background-color: #22ce29;
		border-color: transparent;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.5);
	}
	
	.btn-warning{
		background-color: #f9bc05; 
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
		color: #212529;
	}
	
	.btn-warning:hover {
		color: #212529;
		background-color: #fdc92f;
		border-color: transparent;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.5);
	}
	
	.btn-danger{
		background-color: #f34236;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
	}
	
	.btn-danger:hover {
		color: #fff;
		background-color: #ff5c58;
		border-color: transparent;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.5);
	}
	
	.btn-info{
		background-color: #00c5ff;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
	}
	
	.btn-custom{
		background-color: #03a8f3;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
	}
	
	.btn-custom:hover{
		color: #fff;
		background-color:#3ec1fd;
		border-color: transparent;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.5);
	}
	
	.grey-btn{
		background-color: #dddddd;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-color: transparent;
		border-radius: 0;
	}
	
	.grey-btn:hover{
		background-color:#d4d4d4;
		border-color: transparent;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.5);
	}
	
	@media (max-width: 1508px) { 
		.sr-no, .currency-symbol{
			padding: 0 15px 0 6px;
		}
		.data-view-element{
			font-size: 11px;
		}
		.data-view-number{
			font-size: 20px;
		}
		.info-box{
			font-size: 15px;
			height: 110px;
		}
		.kpi-graph {
			height:56px;
		}
		.kpi-number{
			font-size: 18px;
		}
	 }
	
	 .color-picker-wrapper .color-picker-input-wrapper {
		width: 300px !important;
	}
	#manage_schedule_table tbody tr td {
		vertical-align : unset !important;
	}
	.red{
		color: red !important;
	}
	
	#manage_schedule .table-scroll {
		position:relative;
		max-width:100%;
		margin:auto;
		margin-top: 10px
	}
	
	#manage_schedule .table-wrap {
		width:100%;
		overflow:auto;
	}
	#manage_schedule .clone {
		position:absolute;
		top:0;
		left:0;
		pointer-events:none;
		z-index: 3;
	}
	#manage_schedule .clone th, #manage_schedule .clone td {
		visibility:hidden;
	}
	#manage_schedule .clone .fixed-side {
		visibility:visible;
		background: #fff
	}
	#manage_schedule .fixed-side {
		width: 100px !important;
	} 
	
	button.kpi-data {
		padding: 0;
		width: 100%;
		border: none;
		vertical-align: unset;
	}
	
	.AddSchedule .checkmark-radio{
		left: 50%;
	}

	.AddSchedule .checkmark-radio1 .checkmark-radio {
		left: 0 !important;
	}

	label-mini{
		border-bottom: 2px solid #e6e6e6;
		padding-bottom: 5px;
	}
	
	
	.select-text-overflow .sfield{
		margin: 0;
	}
	/*Lobipanel css*/
	.lobipanel > .panel-body {
		overflow: inherit !important;
	}
	
	.reject-note{
		background-color: #dcdcdc;
		padding: 5px 15px;
		margin-bottom: 10px;
	}
	
	#update-AgentInfo .form-inline .form-group {
		margin-bottom: 15px !important;
	}
	
	.update-photo ::-webkit-file-upload-button {
		background-color: #03a8f3;
		color: #fff;
		border: none;
		padding: 5px 10px;
		margin-top: 5px;
		box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
		border-radius: 0;
		cursor: pointer;
	}
	
	/*CSS Changes related to training module*/
	
	/*.the-legend {
		border-style: none;
		border-width: 0;
		font-size: 14px;
		line-height: 20px;
		margin-bottom: 0;
		width: auto;
		padding: 0 10px;
		border: 1px solid #e0e0e0;
	}
	.the-fieldset {
		border: 1px solid #e0e0e0;
		padding: 10px;
	}
	.with-icon {
	 position: relative;
	}
	.icon-holder {
	 position: absolute;
	 right: 0;
	 top: 0;
	 height: 34px;
	 width: 34px;
	 text-align: center;
	 line-height: 34px;
	}
		.modal-elg{
			width: 1400px;
		}
	
	
		@media (max-width: 1420px) { 
			.modal-elg{
				width: auto;
				margin: 10px;
			}
		}*/

 .color-picker-wrapper .color-picker-input-wrapper {
    width: 300px !important;
}
#manage_schedule_table tbody tr td {
	vertical-align : unset !important;
}
.red{
	color: red !important;
}

#manage_schedule .table-scroll {
	position:relative;
	max-width:100%;
	margin:auto;
	margin-top: 10px
}

#manage_schedule .table-wrap {
	width:100%;
	overflow:auto;
}
#manage_schedule .clone {
	position:absolute;
	top:0;
	left:0;
	pointer-events:none;
	z-index: 3; 
}
@-moz-document url-prefix() {
	#manage_schedule .clone{border-color: transparent}
	#manage_schedule .clone > tbody > tr > td,#manage_schedule .clone > thead > tr > th{border-color: transparent !important;}
	#manage_schedule .clone > thead > tr > th:first-child{border-color:#dddddd !important }
}
#manage_schedule .clone th, #manage_schedule .clone td {
	visibility:hidden;
}
#manage_schedule .clone .fixed-side {
	visibility:visible;
	background: #fff
}
#manage_schedule .fixed-side {
	width: 100px !important;
} 

button.kpi-data {
    padding: 0;
    width: 100%;
    border: none;
    vertical-align: unset;
}

.AddSchedule .checkmark-radio{
	left: 50%;
}

label-mini{
	border-bottom: 2px solid #e6e6e6;
    padding-bottom: 5px;
}

.select-text-overflow .ui-select-bootstrap .ui-select-match-text{
	text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
}

.select-text-overflow .sfield{
	margin: 0;
}
/*Lobipanel css*/
.lobipanel > .panel-body {
    overflow: inherit !important;
}

.reject-note{
	background-color: #dcdcdc;
    padding: 5px 15px;
    margin-bottom: 10px;
}

#update-AgentInfo .form-inline .form-group {
    margin-bottom: 15px !important;
}

.update-photo ::-webkit-file-upload-button {
	background-color: #03a8f3;
	color: #fff;
	border: none;
	padding: 5px 10px;
	margin-top: 5px;
	box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
	border-radius: 0;
	cursor: pointer;
}

.profile-border{
    border: 1px solid #ddd;
    border-top-color: transparent;
}

/*CSS for PTO*/

#my-pto-request .notes{width:500px;}

.Action-icon i.fa.fa-check, .Action-icon i.fa.fa-eye , .Action-icon i.fa.fa-save{
	color: #02be00 !important;
	font-size: 20px !important;
	padding-right: 10px;
}

.Action-icon i.fa.fa-times, .Action-icon i.fa.fa-times-circle{
	color: red !important;
    font-size: 20px !important;
}
.Action-icon i.fa.fa-trash{
	color: red !important;
    font-size: 16px !important;
}

#manage_schedule .Action-icon i.fa.fa-info-circle{
	color:#f39c12 !important;
    font-size: 20px !important;
}
.Action-icon i.fa.fa-eye, .Action-icon i.fa.fa-download {
	color: #2ac106 !important;
    font-size: 16px !important;
	padding-right: 5px !important;
	cursor: pointer;
}

.Upload-icon i.fa.fa-download {
    font-size: 16px !important;
    padding-left: 15px !important;
	cursor: pointer;
}

.Action-icon i.fa.fa-pencil{
	color: #f39c12 !important;
    font-size: 16px !important;
    padding-right: 5px !important;
}
.Action-icon i.fa.fa-moon-o{
	color:#12bff3 !important;
	font-size: 20px !important;
	padding-left: 5px;
}

.Action-icon .btn {
    padding-bottom: 2px !important;
    padding-top: 2px !important;
}

.Action-icon .btn i.fa.fa-eye{
	color: #fff !important;
}

#my-pto-request td .label-warning, #my-pto-request td .label-success, #my-pto-request td .label-danger, #my-pto-request td .label-info,
#pto-request td .label-warning, #pto-request td .label-success, #pto-request td .label-danger, #pto-request td .label-info{    
	font-size: 12px;
	font-weight: normal;
}

/*CSS for Auto Time Punches*/

#autoTime-punches button{
	width: 160px;
	display: inline-block;
	margin-right: 5px;
}

#autoTime-punches button img{
	display: inline-block;
	padding-right: 15px;
}
#autoTime-punches i{
	font-size: 22px;
	margin-right: 10px;
}
#autoTime-punches table i{
	font-size: 18px;
	color: orange;
}

#autoTime-punches p{
	text-transform: uppercase;
	padding-top: 10px;
}

#autoTime-punches .btn-pressed{
	box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.8);
    border: 2px solid white;
}

#autoTime-punches .popover{
	min-width: 300px;
}

#autoTime-punches .popover-content i{
	color:#bababa;
	font-size: 12px;
}

.current-employee h5{
	margin-top: 0;
  }

.timesheet-summary  .green-font{
	color: #23b14d !important;
}

.timesheet-summary  .red-font{
	color: #f1494f !important;
}
.no-punches{
	background-color: #ececec;
    padding: 10px;
    width: 300px;
    border-radius: 2px;
    margin: 0 auto;
}

/*CSS for Trends page*/

#trends-filter multiselect button{
	text-align: left;
}

#trends-filter multiselect button .caret{
	float: right;
    margin-top: 7px;
}

	.modal-elg{
		width: 1400px;
	}


	@media (max-width: 1420px) { 
		.modal-elg{
			width: auto;
			margin: 10px;
		}
	}

	.ui-dropdown-top{
		top: inherit;
	}

	.redcolor{
		background-color: red;
	}
/*Start : ui-view animation */
  [ui-view].ng-enter, [ui-view].ng-leave {
	position: absolute;
	left: 0;
	right: 0;
	-webkit-transition:all .3s ease-in-out;
	  -moz-transition:all .3s ease-in-out;
	  -o-transition:all .3s ease-in-out;
	  transition:all .3s ease-in-out;
  }
  
  [ui-view].ng-enter {
	opacity: 0;
	-webkit-transform:scale3d(0.5, 0.5, 0.5);
	-moz-transform:scale3d(0.5, 0.5, 0.5);
	transform:scale3d(0.5, 0.5, 0.5);
  }
  
  [ui-view].ng-enter-active {
	opacity: 1;
	-webkit-transform:scale3d(1, 1, 1);
	-moz-transform:scale3d(1, 1, 1);
	transform:scale3d(1, 1, 1);
  }
  
  [ui-view].ng-leave {
	opacity: 1;
	/*padding-left: 0px;*/  
	-webkit-transform:translate3d(0, 0, 0);
	-moz-transform:translate3d(0, 0, 0);
	transform:translate3d(0, 0, 0);
  }
  
  [ui-view].ng-leave-active {
	opacity: 0;
	/*padding-left: 100px;*/
	-webkit-transform:translate3d(100px, 0, 0);
	-moz-transform:translate3d(100px, 0, 0);
	transform:translate3d(100px, 0, 0);
  }
  /*End : ui-view animation */
  .not_active {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color:gray !important;
  }


  .ui-select-bootstrap>.ui-select-choices, .ui-select-bootstrap>.ui-select-no-choice{
	top: inherit;
  }

/*CSS for custom Vertical Scroll Bar*/
.verticalScrollbar::-webkit-scrollbar {
    width: 9px;
    border-radius: 10px;
    background-color: #F5F5F5;
}
.verticalScrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #acacac;
}
.verticalScrollbar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 10px;
    background-color: #ebebeb;
}
/*CSS over for custom Vertical Scroll Bar*/

/*CSS for Add Subscription Modal*/
#addSubscription .recurrencePattern .cron-select-wrap .cron-select{
	width: 141.6px !important;
	border-radius:0 !important;
}

.border-b{
	border-bottom: 1px solid #f1f1f1;
    padding-bottom: 13px;
}

#addSubscription .ui-select-container.ui-select-bootstrap.dropdown{
	display: inline-block;
    vertical-align: middle;
}

#addSubscription .ui-select-container.ui-select-bootstrap.dropdown span.btn.btn-default.form-control.ui-select-toggle,
#addSubscription .ui-select-container.ui-select-bootstrap.dropdown input.form-control.ui-select-search{
	width: 200px !important;
}

/*media query for menu*/

@media (min-width: 960px) and (max-width: 1199px) {
	.navbar-default .navbar-nav > li > a{
		padding: 20px 5px;
	}
}

.borderSelectOption{
	border: 1px solid red;
}

/*CSS for Sign Log*/
#CreateSignLog label{
	color: #3a95e4;
}

#upload-file .update-photo ::-webkit-file-upload-button {
	background-color: #03a8f3;
	color: #fff;
	border: none;
	padding: 5px 10px;
	margin-top: 5px;
	box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.3);
	border-radius: 0;
	cursor: pointer;
}

#upload-file h3{
	color: #cecece;
    line-height: 35px;
}

/* for billing->taxable prices->my-ownership->view mark as stolen */
.strikethrough {
	text-decoration: line-through;
  }

.tooltip-add-subscription{
	padding: 5px 0px 10px 10px;
    display: inline-block;
}

  .drop-box {
	background: #F8F8F8;
    border: 5px dashed #DDD;
    width: 100%;
    height: 124px;
    text-align: center;
    padding-top: 20px;
    margin: 10px;
}
.drop-audio{
    width: 100%;
	text-align: center;
	margin: 10px;
}
.drop-audio button {
    margin-bottom: 20px;
}
.audio-list {
    max-height: 242px;
    overflow: auto;
}
.audio-list .file-upload:first-child {
    margin-top: 0;
}
.url-block {
    display: flex;
    margin-top: 10px;
}
.progress-action img{
	margin: 0 auto;
}
.no-audio {
    height: 242px;
    background: #f8f8f8;
    border: 1px solid #cccccc;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dragover {
    border: 5px dashed blue;
}
.assign-dropdown-show .ui-select-bootstrap>.ui-select-choices,.assign-dropdown-show .ui-select-bootstrap>.ui-select-no-choice{
	top: unset !important;
}

.assign-emp-dropdown .ui-select-placeholder{
	float: left;
}

/* .ui-select-bootstrap>.ui-select-choices {
    top: unset;
} */

/*dashboard search panel*/
.select-client .form-control, .select-client .btn-default, .select-project .form-control, .select-project .btn-default {
	background-color: transparent !important;
    border: none !important;
}

/*CSS for new change of status*/
.employee-info-display{
	background-color: #f9f9f9;
}
.employee-info-display legend{
	background-color: #fff;
}
.change-status-emp-info p {
	/* display: inline-block; */
	/* float: left; */
	/* padding-left: 3px; */
}

#review-terminate .dis-flex p{
	display: flex !important;
	padding-left: 0;
}

.label-inline p{
	display: inline-block; 
	float: left;
	padding-left: 3px;
	word-break: break-all;
	/*width: 245px;*/
	width: 238px;
}

.change-status-emp-info label {
	float: left;
	/* width: 120px; */
}

.terminate-emp-info label{
	float: unset !important;
}
#review-changes-table td{
	font-size: 14px;
}

#cos-type .cos-type-list{
	display: inline-block;
    /* border: 1px solid #f2f2f2; */
    border-radius: 2px;
    padding: 4px 10px;
	margin-right: 5px;
	color: #fff;
	background-color: #ababab;
	margin-bottom: 2px;
    margin-top: 2px;
}
.bold_text {
	font-weight: bold;
}

.change-type-width span.btn.btn-default.form-control.ui-select-toggle {
    width: 100%;
}

.change-type-width .ui-select .form-inline .form-control {
    width: 100% !important;
}

.change-type-width input.form-control.ui-select-search.ng-pristine.ng-valid.ng-empty.ng-touched {
    width: 100% !important;
}

/* ui-grid */
.grid-table{
	height: calc(100vh - 325px);/*365px*/
}
#candidate-grid-table .grid-table{
	    height: calc(100vh - 240px);
}
.full-height-grid .grid-table{
	height: calc(100vh - 240px);
}
#employee-grid-table .grid-table{
	height: calc(100vh - 267px);
}
.watermark {
    position: absolute;
    top: 50%;
    font-size: 14px;
    font-weight: 700;
    width: 100%;
    text-align: center;
    z-index: 1000;
    color: #333;
}
.spinner{
	position: absolute;
	height:100%;
	width:100%;
	background-color: rgba(0,0,0,0.5);
	z-index:999;
}
.spinner-img{
	left: 50%;
	top: 50%;
	height:80px;
	width:80px;
	margin:50% auto;
}
.ui-grid-loader{
	top: 37%;
    width: 15%;
    text-align: center;
    position: absolute;
}
.ui-table-status-red{
	color: #da0303;
}
.ui-table-status-green{
	color: #16a916;
}
.ui-grid-row:nth-child(odd) .ui-grid-cell{
	background-color: #f7f7f7;
}
/*job code*/
#jobcode .filter-Popover .popover{
	top: -103px !important;
}

#jobcode .popover.right > .arrow{
	top: 26% !important;
}

#jobcode .filter-Popover .form-group{
	margin-bottom: 5px !important;
}
/*job code css over*/

/*roles css*/
#roles .filter-Popover .popover{
    width: 600px;
}
/*roles css over*/
.custom-search-bar{
	height: 25px; 
	padding-left: 10px; 
	margin-left: 15px;
}

/**/
.cos-box{
	color: #fff;
    padding-top: 10px;
	padding-bottom: 10px;
	display: inline-flex;
}
.cos-content-block{
	float: left;
	padding-left: 20px;
}
.icon-block{
	float: right;
    width: 18%;
    height: 65px;
    font-size: 35px;
}

@media (min-width: 1025px) and (max-width: 1280px) {
  	.icon-block{
		width: 25%;
	  }
  }

@media (min-width: 950px) and (max-width: 1024px) {
	.icon-block{
		width: 28%;
	  }
}

@media (max-width: 949px) {
	.icon-block{
		width: 100%;
	  }
}

.cos-green-box {
	background: #26a69a;
	width: 100%
}
.cos-yellow-box {
	background: #ffae00;
	width: 100%
}
.cos-blue-box {
	background: #2196f3;
	width: 100%
}
.cos-yellow-box .icon-block{
    background-color: #e08d16;
}
.cos-blue-box .icon-block{
	background-color: #1880d2;
}
.cos-green-box .icon-block{
	background-color: #16887d;
}
.cos-yellow-box .icon-block i, .cos-blue-box .icon-block i, .cos-green-box .icon-block i{
	padding-top: 12px;
}
/*Ui-select text ellipse css*/
.ui-select-bootstrap .ui-select-match-text{
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 2em;
}

/*CSS for search bar*/
.custom-search-bar input#company-search,             .custom-search-bar input#clients-search,           .custom-search-bar input#projects-search,          
.custom-search-bar input#campaigns-search,           .custom-search-bar input#lob-search,               .custom-search-bar input#bu-search,                  
.custom-search-bar input#home-dept-search,           .custom-search-bar input#location-search,          .custom-search-bar input#job-code-search,   
.custom-search-bar input#payroll-search,             .custom-search-bar input#action-code-search,        .custom-search-bar input#action-reason-search,    
.custom-search-bar input#reason-subcategory-search,  .custom-search-bar input#dpt-family-search,        .custom-search-bar input#role-family-search,      
.custom-search-bar input#manage-user-search,         .custom-search-bar input#employee-search,          .custom-search-bar input#department-search,        
.custom-search-bar input#timesheet-exception-search, .custom-search-bar input#timesheet-summary-search, .custom-search-bar input#timesheet-detail-search,  
.custom-search-bar input#emp-detail-report-search,   .custom-search-bar input#tracker-his-search,       .custom-search-bar input#paycode-approver-search,
.custom-search-bar input#role-search,                .custom-search-bar input#cmpny-property,           
.custom-search-bar input#move-candidate-search,      .custom-search-bar input#track-cos-search,         .custom-search-bar input#trainer-report-search,
.custom-search-bar input#candidate-search,           .custom-search-bar input#threshold-summary-search, .custom-search-bar input#threshold-detail-search,
.custom-search-bar input#timesheet-aging-search,     .custom-search-bar input#vantage-search, 			.custom-search-bar input#time-card-search,
.custom-search-bar input#adp-report-search,			 .custom-search-bar input#attendance-rate-search,	.custom-search-bar input#wfn-hcc-search,
.custom-search-bar input#employee-hierarchy-search,	 .custom-search-bar input#adp-location-search,      .custom-search-bar input#headset-history-search
{
	margin-top: 0px !important;
    width: 300px;
    text-overflow: ellipsis;
	padding-right: 24px;
	transition: width .55s ease;
}
.custom-search-bar input#company-search:focus, 			 .custom-search-bar input#company-search:active,
.custom-search-bar input#clients-search:focus, 			 .custom-search-bar input#clients-search:active,
.custom-search-bar input#projects-search:focus, 		 .custom-search-bar input#projects-search:active,
.custom-search-bar input#campaigns-search:focus,         .custom-search-bar input#campaigns-search:active,
.custom-search-bar input#lob-search:focus, 				 .custom-search-bar input#lob-search:active,
.custom-search-bar input#job-code-search:focus, 		 .custom-search-bar input#job-code-search:active,
.custom-search-bar input#action-code-search:focus,       .custom-search-bar input#action-code-search:active,
.custom-search-bar input#action-reason-search:focus, 	 .custom-search-bar input#action-reason-search:active,
.custom-search-bar input#employee-search:focus, 		 .custom-search-bar input#employee-search:active,
.custom-search-bar input#department-search:focus, 		 .custom-search-bar input#department-search:active,
.custom-search-bar input#timesheet-summary-search:focus, .custom-search-bar input#timesheet-summary-search:active,
.custom-search-bar input#emp-detail-report-search:focus, .custom-search-bar input#emp-detail-report-search:active,
.custom-search-bar input#role-search:focus,              .custom-search-bar input#role-search:active,
.custom-search-bar input#cmpny-property:focus,           .custom-search-bar input#cmpny-property:active,
.custom-search-bar input#move-candidate-search:focus,    .custom-search-bar input#move-candidate-search:active,
.custom-search-bar input#threshold-summary-search:focus, .custom-search-bar input#threshold-summary-search:active,
.custom-search-bar input#threshold-detail-search:focus,  .custom-search-bar input#threshold-detail-search:active,
.custom-search-bar input#timesheet-aging-search:focus,   .custom-search-bar input#timesheet-aging-search:active,
.custom-search-bar input#headset-history-search:focus,	  .custom-search-bar input#headset-history-search:active{
	width: 510px;
}

.custom-search-bar input#time-card-search:focus,          .custom-search-bar input#time-card-search:active,
.custom-search-bar input#adp-report-search:focus,         .custom-search-bar input#adp-report-search:active,
.custom-search-bar input#attendance-rate-search:focus,    .custom-search-bar input#attendance-rate-search:active,
.custom-search-bar input#wfn-hcc-search:focus,		      .custom-search-bar input#wfn-hcc-search:active,
.custom-search-bar input#employee-hierarchy-search:focus, .custom-search-bar input#employee-hierarchy-search:active,
.custom-search-bar input#adp-location-search:focus,		  .custom-search-bar input#adp-location-search:active,
.custom-search-bar input#vantage-search:focus,			  .custom-search-bar input#vantage-search:active
{
	width: 400px;
}

.custom-search-bar input#track-cos-search:focus,          .custom-search-bar input#track-cos-search:active{
	width: 530px;
}
.custom-search-bar input#location-search:focus,           .custom-search-bar input#location-search:active,
.custom-search-bar input#reason-subcategory-search:focus, .custom-search-bar input#reason-subcategory-search:active{
	width: 580px;
}
.custom-search-bar input#dpt-family-search:focus,        .custom-search-bar input#dpt-family-search:active,
.custom-search-bar input#timesheet-summary-search:focus, .custom-search-bar input#timesheet-summary-search:active{
	width: 600px;
}
.custom-search-bar input#bu-search:focus,                  .custom-search-bar input#bu-search:active,
.custom-search-bar input#role-family-search:focus,         .custom-search-bar input#role-family-search:active,
.custom-search-bar input#timesheet-exception-search:focus, .custom-search-bar input#timesheet-exception-search:active,
.custom-search-bar input#timesheet-detail-search:focus,    .custom-search-bar input#timesheet-detail-search:active{
	width: 680px;
}

.custom-search-bar input#home-dept-search:focus, .custom-search-bar input#home-dept-search:active{
	width: 710px;
}

.alertify>.dialog button.cancel, .alertify>.dialog button.ok{
	border: 1px solid rgba(0,0,0,.1) !important;
}
.alertify .dialog .msg {
    padding: 12px 0;
}

/* sub-table for track-cos  */
.sub-table{
	width: 60%;
	margin-left: 6.5%;
}

/*trainer report css */
@-moz-document url-prefix() {
	#trainer_report .clone{border-color: transparent}
	#trainer_report .clone > tbody > tr > td,#trainer_report .clone > thead > tr > th{border-color: transparent !important;}
	#trainer_report .clone > thead > tr > th:first-child{border-color:#dddddd !important }
}
/* cos approvers color */
.bk-color-blue{
	background-color: #dbf3f9;
}
.bk-color-red{
	background-color: #f48c8c;
	color: #fff !important;
}
.bk-color-red-admin{
	background-color: #ff0000;
	color: #fff !important;
}
.bk-color-green{
	background-color: #07ee03;
}
.bk-color-green-admin{
	background-color: #086a08;
	color: #fff !important;
}

/*ID Management CSS*/
#request_other_access .filter-Popover .popover {
    width: 600px !important;
}
.modal-xlg {
    width: 1140px;
}

.modal-xxlg {
    width: 1140px;
}

#manage_schedule .filter-Popover .popover {
	width: 600px !important;
}

#lob .filter-Popover .popover{
	width: 650px !important;
}
@media (min-width: 925px) and (max-width: 1168px) {
	.modal-xxlg {
		width: 900px !important;
	}
}

@media (min-width: 830px) and (max-width: 924px) {
	.modal-xxlg {
		width: 810px !important;
	}
}

@media (min-width: 768px) and (max-width: 829px) {
	.modal-xxlg {
		width: 750px !important;
	}
}

@media (min-width: 925px) and (max-width: 1169px) {
	#jobcode .filter-Popover .popover{
		width: 800px;
	  }
	  #jobcode .popover.right > .arrow {
		top: 27% !important;}
}

@media (max-width: 924px) {
	#jobcode .filter-Popover .popover{
		width: 660px;
	  }
}

@media (min-width: 768px) and (max-width: 924px){
	#jobcode .filter-Popover .popover .col-sm-4 {
		width: 50%;
	}

	#jobcode .popover.right > .arrow {
		top: 21% !important;
	}
}

.track-cos-legend-list{
	display: inline-block;
	float: right;
	margin-left: 10px;
}

.track-cos-legend-list a{
	position: relative;
    margin-left: 17px;
}

.track-cos-label-size{
	width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 5px;
    position: absolute;
    margin-top: 4px;
    margin-left: -17px;
}

.track-cos-legend-text{
	display: inline-block;
    margin-right: 10px;
    margin-top: 0;
}

.more{
	display: block;
    width: 4px;
    height: 4px;
    margin-top: 2px;
    background-color: #337ab7;
}
.more-action{
	background: none;
    border: 0;
}

.more-action .btn:active{
	box-shadow: none !important;
}


.Action-column-width{
	width: 60px !important;
	min-width: 60px !important;
}

#headset-issue-property .Action-column-width{
	min-width: 80px !important;
}

.cos-file input[type=file]{
    width:105px;
    color:transparent;
}
.grid-align {
    text-align: center;
}

.create-class .input-group-btn>.btn[disabled] {
    background: #eeeeee;
    opacity: 1;
}
.ui-grid-pager-row-count-picker select{
	padding : 3px 5px;
}

/**reset password through security questions**/
.security-question-block{
	display: block;
    width: 50%;
    padding: 30px;
    margin: 100px auto 0;
    color: #000;
    z-index: 2;
    border: 10px solid #2980b9;
	background-color: #fff;/*#9e9e9e5c*/
	box-shadow: 0px 8px 20px 4px rgb(21, 21, 21);
}

.cos-pending-request{
	background-color: #f443363d !important;
}

.security-question-block .form{
	position: unset;
    z-index: unset;
    margin-top: unset;
    width: unset;
    margin-left: unset;
	opacity: unset;
}
.security-question-block input[type=text]
{
	border: 1px solid#eaeaea;
	padding-left: 5px;
	color: #000;
}
.security-question-block input[type=password]
{
	border: 1px solid#eaeaea;
	padding-left: 5px;
	color: #000;
}
.security-question-block .go-button{
	padding: 5px 10px;
    margin-top: 1px;
    background-color: #2980b9;
    margin-left: 5px;
    border: none;
}
.security-question-block .question-box{
	margin-top: 30px;
	margin-bottom: 5px;
}
.security-question-block .question-box input{
	width:100%;
}

.security-question-block .question-box .btn-info{
    background-color: #2980b9;
	padding: 7px 25px;
	margin-top: 20px;
}

.question-list{
	margin-top: 20px;
}

.bg-red{
	background-color: #ffb4b4 !important;
}
/* 10-12-2018 */

.request-by-me .data-view-wrap{	width: 32%; }
.my-approvels .data-view-wrap{	width: 30.5%; }
.request-by-me .data-view-wrap:last-of-type{ width: 32%; }
.my-approvels .data-view-wrap:last-of-type{	width: 34.5%; }
.request-by-me .for-supervisor .data-view-wrap {width: 18.5%;}
.data-view-3 .data-view-wrap {width: 32%;}
.data-view-3 .data-view-wrap:last-of-type{width: 32%}
.data-view-6 .data-view-wrap { width: 15%;}
.data-view-4 .data-view-wrap {width: 24%;}
.data-view-4 .data-view-wrap:last-of-type{width: 23%}
.past-data-24{ background: #fdc92f; }
.data-approching-pay-period { background: #ea2c22a8; }
.white-font { color: #fff }
.bg-green { background: #cefdd6;}
.bg-orange{background: #ffe7c4}
.bg-carret{background: #ffd5d3}
.data-view-box .sr-no i{color: #5cb71a}
.inner-group-list, .inner-permission-list {height: 360px; overflow-x: hidden;}

/*Select COS buttons*/
#select-cos-btn{
    padding-bottom: 10px;
	padding-top: 15px;
	width: 70%;
	margin: 0 auto;
	float: none;
}
@media (min-width: 1280px) and (max-width:1529px){
	#select-cos-btn{
		width: 84%;
	  }
}
#select-cos-btn .radio{
    position: absolute;
    margin-top: 0;
    margin-bottom: 0;
    left: 0;
    top:0;
}
#select-cos-btn .custom-radiobtn{
    left: 0;
}
#select-cos-btn .checkmark-radio{
    border-radius: 0;
    left: -2px;
    top: -2px;
    height: 30px;
    width: 30px;
	background-color: #ffffff;
	border: 2px solid;
}
#select-cos-btn .custom-radiobtn .checkmark-radio:after{
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f00c";
}
.cos-btn-terminate, .cos-btn-manager, .cos-btn-data, .cos-btn-loa, .cos-btn-gsc, .cos-btn-suspension, 
.cos-btn-rfl, .cos-btn-rec, .cos-btn-promote, .cos-btn-demote, .cos-btn-transfer, .cos-btn-payrate {
    display: inline-block;
    padding: 12px 20px;
    position: relative;
    text-align: center;
    width: 160px;
    height: 135px;
    vertical-align: bottom;
	margin-left: 5px;
	margin-right: 5px;
    margin-bottom: 10px;
	background-color: white; 
	border: 2px solid;
}
.cos-btn-rfl{
	width: 162px;
}
.cos-btn-terminate,  
.cos-btn-terminate .checkmark-radio, 
.cos-btn-terminate .custom-radiobtn .checkmark-radio:after{
	color: #f44336; 
}
.cos-btn-manager,
.cos-btn-manager .checkmark-radio, 
.cos-btn-manager .custom-radiobtn .checkmark-radio:after {
	color: #4CAF50; 
}
.cos-btn-data,
.cos-btn-data .checkmark-radio,
.cos-btn-data .custom-radiobtn .checkmark-radio:after{
	color: #008CBA; 
}
.cos-btn-loa,
.cos-btn-loa .checkmark-radio,
.cos-btn-loa .custom-radiobtn .checkmark-radio:after {
	color: #cfae02; 
}
.cos-btn-gsc,
.cos-btn-gsc .checkmark-radio,
.cos-btn-gsc .custom-radiobtn .checkmark-radio:after {
	color: #2e6d02;
}
.cos-btn-suspension,
.cos-btn-suspension .checkmark-radio,
.cos-btn-suspension .custom-radiobtn .checkmark-radio:after {
	color: #F6AE2D;
}
.cos-btn-rec,
.cos-btn-rec .checkmark-radio,
.cos-btn-rec .custom-radiobtn .checkmark-radio:after {
	color: #9a5517;
}
.cos-btn-rfl,
.cos-btn-rfl .checkmark-radio,
.cos-btn-rfl .custom-radiobtn .checkmark-radio:after {
	color: #6A4C93;
}
.cos-btn-promote,
.cos-btn-promote .checkmark-radio,
.cos-btn-promote .custom-radiobtn .checkmark-radio:after{
	color: #00BBD3;
}
.cos-btn-demote,
.cos-btn-demote .checkmark-radio,
.cos-btn-demote .custom-radiobtn .checkmark-radio:after{
	color: #ec6234;
}
.cos-btn-transfer,
.cos-btn-transfer .checkmark-radio,
.cos-btn-transfer .custom-radiobtn .checkmark-radio:after{
	color: #2A9D8F;
}
.cos-btn-payrate,
.cos-btn-payrate .checkmark-radio,
 .cos-btn-payrate .custom-radiobtn .checkmark-radio:after{
	color: #CC7E85;
}
.cos-btn-terminate.active, .cos-btn-terminate:hover, 
.cos-btn-manager.active, .cos-btn-manager:hover, 
.cos-btn-data.active, .cos-btn-data:hover ,
.cos-btn-loa.active,  .cos-btn-loa:hover,
.cos-btn-gsc.active,  .cos-btn-gsc.hover,
.cos-btn-suspension.active,  .cos-btn-suspension:hover,
.cos-btn-rfl.active,   .cos-btn-rfl:hover,
.cos-btn-rec.active, .cos-btn-rec:hover,
.cos-btn-promote.active, .cos-btn-promote:hover,
.cos-btn-demote.active, .cos-btn-demote:hover,
.cos-btn-transfer.active, .cos-btn-transfer:hover,
.cos-btn-payrate.active, .cos-btn-payrate:hover
{
    box-shadow: 0 5px 16px 0 rgba(0,0,0,0.20), 0 9px 20px 0 rgba(0,0,0,0.15);
    cursor: pointer;
}

.horizontal-line{
	border-bottom: 1px solid #ddd;
}

#change-report-mngr .searchable-block {
	height: 455px;
	overflow-x: unset;
}
#change-report-mngr .report-mngr-list{
	height:300px;
	padding: 0;
	overflow-x: hidden;
}

.report-mngr-list ul li p{
	width: 97%;
        display: inline-block;
        margin-bottom: 0;
}

#agentWFSubStatus-filter .filter-Popover .popover{
    width: 500px;
}

/* track cos */
.track-cos-label-size.label-border-radius {
    border-radius: 8px;
}
/*terminate emp cos*/
#term-comp-property .tab-content{
	padding: 15px;
}

.info-blue-text
{
	color: #007eff;
	font-size: 12px;
}
.red_color {
    background-color :red !important;
}
.red-light{
	background-color: #fb5b5b !important;
}
.blue_color {
    background-color :#00FFFF !important;
}
.yellow {
    background-color : #FFD700 !important; 
}
.green {
    background-color : 	#32CD32 !important; 
}
.pink {
    background-color : pink !important; 
}
/**/
.expand-child-button{
	float: left;
}
.expand-level-1{
	padding-left: 25px;
}

.expand-level-2{
	padding-left: 50px;
}
.expand-level-3{
	padding-left: 75px;
}
.expand-custom-button{
	border: none;
    background:#006998;;
    color: #fff;
	border-radius: 5px;
	padding: 2px 6px;
}

#headset-assignment .filter-Popover .popover{
	width: 680px;
}
#headset-return .filter-Popover .popover{
	width: 680px;
}
#company-code .filter-Popover .popover{
	width: 350px;
}
#attrition-report .filter-Popover .popover, 
#drafts .filter-Popover .popover,
#mtd-referrals .filter-Popover .popover{
	width: 680px;
}
#candidates .filter-Popover .popover{
	width: 1000px;
	top: -100px !important;
}
#track-cos .filter-Popover .popover,#termination-report .filter-Popover .popover{
	width: 1000px;
	top: -115px !important;
}
#track-cos .filter-Popover .popover.right>.arrow
{
	top: 130px !important;
}
#candidates .filter-Popover .popover.right>.arrow{
	top: 25% !important;
}
#candidates .filter-Popover .popover.right>.arrow:after{
	top: -10px !important;
}
#track-cos .filter-Popover .popover.right>.arrow,
#candidates-report .filter-Popover .popover.right>.arrow,
#wfn-other-changes .filter-Popover .popover.right>.arrow
{
	top: 30% !important;
}
#vantage-report .filter-Popover .popover,
#candidate-report .filter-Popover .popover{
	width: 1000px;
	top: -80px !important;
}
#employees .filter-Popover .popover {
    top: -110px !important;
}
#employees .filter-Popover .popover.right>.arrow{
	top: 120px !important;
}
#vantage-report .filter-Popover .popover.right>.arrow{
	top: 20% !important;
}
#candidate-report .filter-Popover .popover.right>.arrow{
	top: 16% !important;
}
#request-status-report .filter-Popover .popover,
#candidates-report .filter-Popover .popover,
#candidate-rr-report .filter-Popover .popover,
#employee-hierarchy-report .filter-Popover .popover,
#wfn-manager-change-filter .filter-Popover .popover,
#wfn-other-changes .filter-Popover .popover
{
	width: 680px;
	top: -80px !important;
}

#request-status-report .filter-Popover .popover.right>.arrow,
#wfn-manager-change-filter .filter-Popover .popover.right>.arrow{
    top: 24% !important;
}
#candidate-rr-report .filter-Popover .popover.right>.arrow{
	top: 40% !important;
}
#employee-hierarchy-report .filter-Popover .popover.right>.arrow {
	top: 43%;
}

#agent-shrinkage-report .filter-Popover .popover{
	top: -114px !important;
}

#agent-shrinkage-report .filter-Popover .popover.right>.arrow {
    top: 125px !important;
}
#action-reason .filter-Popover .popover{
    width: 500px;
}

.browser-compatibility{
	position: absolute;
    z-index: 3;
    margin-top: 620px;
	margin-left: 260px;
	color: #fff;
	padding: 5px 10px;
	border: 1px solid #ff0000;
}
.blink{
	background-color: #000;
	text-align: center;
}
.blink p{
	animation: blink 1s linear infinite;
	margin-bottom: 0;
}
@keyframes blink{
0%{opacity: 0.0;}
100%{opacity: 1;}
}
.hr-hierarchy-title-text{
	white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 245px;
}
.table-row-bold-manager{
	font-weight: bold;
	background-color: #b39ddb;
}
.table-row-bold-supervisor{
	font-weight: bold;
	background-color: #9fa8da;
}
.table-row-bold-shift{
	font-weight: bold;
	background-color: #DBF3F9;
}
.table-row-bold-agent{
	font-weight: bold;
	background-color: #90caf9;
}.table-row-bold-business-unit{
	font-weight: bold;
	background-color: rgb(159, 162, 189);
}

#agent-shrinkage-report .nvd3 text{
	font-size: 14px;
	font-weight: 600;
}

#agent-shrinkage-report .nv-legend-text{
	font-size: 14px !important;
	font-weight: 100 !important;
}

#agent-shrinkage-report .nv-axislabel{
    font-weight: 600 !important;
    font-size: 16px !important;
}
/* uat differrence */
.uat-navbar-default {
    background: #efa700 !important;
}

/*QA Score css*/
.qa-input {
    width: 100%;
	border: 1px solid #ccc;
	outline: none;
	margin-right: 5px;
}
.qa-input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #b5b5b5;
	opacity: 1; /* Firefox */
  }
  
  .qa-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #b5b5b5;
  }
  
  .qa-input::-ms-input-placeholder { /* Microsoft Edge */
	color: #b5b5b5;
  }
.que-list ul{
	list-style: none;
	padding-left: 0;
}
.que-list .table.que-table>tbody>tr>td,.que-list .table.que-table>thead>tr>td{
	padding: 5px 5px
}
.create-que{
	display: flex;
	width: 100%;
	padding: 0 15px;
}
.create-que div{
	margin-right: 5px
}
.create-que div:nth-child(1) {
    width: 100%;
}
.create-que div:nth-child(2) {
    width: 80px;
}
.create-que div:nth-child(3) {
    width: 140px;
}
.create-que div:nth-child(4) {
    width: 120px;
}
.create-que div:nth-child(5) {
    width: 11px;
}
.question {
    background: #fff;
    border: 1px solid #e3e3e3;
	padding: 5px 15px;
	display: flex;
	align-items: center;
	margin-bottom: 5px;
}
.ai-predicted .ai-predicted-bar {
    width: 5px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #004a6a;
}
.compliance-checkbox{text-align: center;}
.category-block {
	margin-bottom: 20px;
	display: flex;
	align-items: center;
}
.category-container {
	border: 1px solid #dcdcdc;
	width: 100%;
}
.category-block:last-child{margin-bottom: 0;}
.category-footer {
    padding: 8px;
    border-top: 1px solid #d4d4d4;
}
.category-footer i{
	font-size: 16px
}
/*New category creation css*/
.new-category-block {
    background: #ffffff;
    margin-bottom: 40px;
    box-shadow: 0 0 1px 0px rgba(0,0,0,0.2);
}
.new-category-head label {
    font-size: 18px;
    font-weight: normal;
    background: #004a6a;
    color: #ffffff;
    padding: 5px 25px;
	margin-bottom: 0;
	border-bottom-right-radius: 20px;
}
ul.category-action {
    list-style: none;
    padding: 0;
    font-size: 18px;
    margin: 0 15px 0 0px;
    color: #929292;
}
ul.category-action li{display: inline-block;padding: 5px}
.new-category-body {
    padding: 15px;
}
input.new-category-input {
    width: 100%;
    border: none;
    border-bottom: 1px solid #d4d4d4;
    font-size: 22px;
    color: #000000;
    outline: none;
    line-height: 50px;
}
.new-category-input:focus {
    border-bottom-color: #000000;
}
.new-category-name {
    margin-bottom: 10px;
}
.que-list {
    padding: 15px;
    background: #ffffff;
	box-shadow: 0 0 0px 1px rgba(0,0,0,0.1);
	position: relative;
	margin-bottom: 10px;
}
.que-list:last-child{
	margin-bottom: 0;
}
.que-list:after {
    content: "";
    height: 100%;
    width: 5px;
    background: #004a6a;
    position: absolute;
    top: 0;
    left: 0;
}
.remove-que {
    position: absolute;
    right: 7px;
    top: 2px;
    font-size: 17px;
}
.new-input {
    width: 100%;
    border: none;
    border-bottom: 1px solid #d4d4d4;
    font-size: 16px;
	line-height: 36px;
	height: 36px;
    outline: none;
}
.new-input:focus {
    border-bottom-color: #000000;
}



.que-table {
    margin-bottom: 0;
}
.que-table>thead>tr{
	font-family: 'OpenSansSemibold';
    font-size: 15px;
    padding: 5px 8px;
    border-bottom: 1px solid #dcdcdc;
    background: #f7f6fe;
	color: #181818;
}
.table.que-table>tbody>tr>td{
	border:none !important;
	position: relative;
	border-top: 1px solid #d4d4d4!important;
	padding: 8px 8px;
    height: auto;
	font-size: 14px;
}
.table.que-table>tbody>tr:last-child>td{
	border-bottom: none;
}
.que-table .custom-radiobtn {
    white-space: nowrap;
}
.table.que-table>tbody>tr.que-msg-tr td {
    padding: 0 8px 8px;
    border-top: 0 !important;
}
.que-msg-tr td > div{
	display: flex
}
.move-icon {
    color: #014a6a;
    cursor: move;
}
.index-container {
    display: inline-block;
    width: 28px;
    height: 28px;
    background: #d9e9fd;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
	color: #006df0;
	font-size: 13px;
}
.Action-icon i{
	color: #2ac106;
	font-size: 16px;
}
.que-table .radio,.que-table .checkbox{margin: 0;justify-content: flex-end;}
.profile-container {
    margin-top: 10px;
}
.profile-img {
    float: left;
    height: 60px;
    width: 60px;
    border-radius: 50%;
    background: #03353D;
    text-align: center;
    font-size: 28px;
    font-family: OpenSansLight;
    color: #fff;
    line-height: 57px;
    margin-right: 10px;
}
.profile-user {
    font-size: 15px;
    color: #3895e3;
    font-family: OpenSansSemibold;
}
#browse-file {
    border-radius: 4px;
    border: 2px #ababab;
    border-style: dashed;
    width: 70%;
    margin: 0 auto;
    padding: 15px;
    font-size: 18px;
}
#browse-file .btn{border-radius: 5px; }
#browse-type {
 	display:none;
}
.file-upload:first-child {
    margin-top: 0;
}
.file-upload {
    margin-top: 10px;
	padding: 10px 0;
	border-bottom: 1px solid #e6e6e6;
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.file-detail{position: relative;width: 100%;}
.file-icon {
    float: left;
	margin-right: 10px;
	width: 50px;
}
.file-title {
    font-family: OpenSansSemibold;
    font-size: 16px;
    color: #181818;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-right: 58px;
}
.file-detail p{margin-bottom: 0;}
.file-progress .progress{
	height: 10px;
	margin-bottom: 0;
	width: 100%;
}
.file-progress {
    display: flex;
    align-items: center;
}
.progress-action {
    font-size: 24px;
    color: #989898;
	width: 115px;
    justify-content: center;
    right: 0;
    text-align: center;
    top: 0px;
}
.progress-action i {
    /* padding: 0 15px; */
}
.speech-container {
    background: #ffffff;
    position: relative;
    quotes: "“" "”" "‘" "’";
    box-shadow: none;
    border: none;
}
.speech-container::before{
	content: open-quote;
    font-size: 145px;
    color: #e7e7e7;
    position: absolute;
    top: 0;
    line-height: 99px;
    left: 10px;
}
.speech-container::after{
	content: close-quote;
	font-size: 145px;
    color: #e7e7e7;
    position: absolute;
    bottom: 0;
    line-height: 0px;
    right: 10px;
}
.speech-text {
	max-height: 600px;
	overflow: auto;
	margin: 0 40px
}
.speech-text .no-speech {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
}
.speech-block{
	display: inline-block;
    clear: both;
    float: left;
    margin: 0px 0 4px 0;
    width: calc(100% - 25px);
}
.speaker{
	float: left;
	width: 70px;
	margin: 6px 8px 0 0;
	font-weight: bold;
}
.speaker-comment{
	display: inline-block;
    padding: 10px 15px;
    border-radius: 15px;
	line-height: 130%;
	background: #ffffff;
	max-width: calc(100% - 80px);
	box-shadow: 0 0 3px 1px rgba(0,0,0,0.1)
}
.speaker-1 .speaker-comment{background: #f7f6fe}
.speaker-2 .speaker-comment{background: #f3f9f3}
.speaker-comment.has-question {background: #fffed5; cursor: pointer;}

.speech-popover {
    background: #2e2e2e;
	color: #ffffff;
	max-width: calc(100% - 240px);
}
.speech-popover.popover.top>.arrow:after{border-top-color: #2e2e2e;}
.speech-popover .popover-title {
    background: #000000;
    color: #ffffff;
    border-color: #000000;
}


.has-ai-text{
	cursor: pointer;
}
.div-table {
    display: table;
    width: 100%;
    background-color: #eee;
    border: 1px solid #666666;
    border-spacing: 5px; /* cellspacing:poor IE support for  this */
}
.div-table-row {
    display: table-row;
    width: auto;
    clear: both;
}
.div-table-col {
    float: left; /* fix for  buggy browsers */
    display: table-column;
    width: calc(100% / 5);
    background-color: #ccc;
}

.report-legend-list{
	display: inline-block;
    float: right;
	margin-left: 30px;
}

.report-legend-size{
	width: 12px;
	height: 12px;
	display: inline-block;
	margin-right: 5px;
	position: absolute;
	margin-top: 4px;
	margin-left: -17px;
}

.report-legend-text {
    display: inline-block;
   /* margin-right: 10px;*/
    margin-top: 0;
}
/*Template Setup css*/
.subscription-box.setup-temp .panel-heading {
    background: #ffffff;
    padding-bottom: 0;
}
/* cos multi-select */

.change-info-height .the-fieldset{
	height: 473px;
}

.COS-New-Reporting-height .searchable-block{
	height: 410px;
}

/* QA-Call Evaluation CSS */
#upload-recording .btn{border-radius: 5px;margin-left: 5px;}
#upload-recording>button,#upload-recording>div{display: inline-block;}
.detail-score-container {
	display: flex;
	justify-content: center;
}
.detail-score-title {
    width: 50%;
}
.category-txt{
	font-size: 14px;
}
.expectation-txt{
	color: #218cc6;
}
.fnt-16{
	font-size: 16px;
}
.acknowledge-area textarea{
	width: 100%;
	resize: none;
}
.audio-play{
    cursor:pointer;
}
/* Project Schedule */
.IHD-block .drop-box {
	width: 50%;
	padding-top: 30px;
	background: #FFF;
}
/*KPI css*/
.kpi-block-container {
    border: 1px solid #d9dadb;
    background: #ffffff;
    border-radius: 4px;
    padding: 10px;
}
.kpi-header {
    font-size: 18px;
}
/* PRJ */

#searchable-block-prj .searchable-block{
	height: 442px;
}

.change-info-height-prj .the-fieldset{
	min-height: 505px;
}

.border-l-0{
	border-left-color: transparent !important;
}

.Action-icon i:hover {
 cursor: pointer;
}

.border-r-0{
	border-right-color: transparent !important;
}

.fa-exclamation-circle{
	color:red;
}

.report-legend-list{
	display: inline-block;
    float: right;
	margin-left: 30px;
}
.kpi-count {
    display: flex;
    justify-content: space-around;
}
.count-list {
    text-align: center;
    font-size: 30px;
    font-family: 'OpenSansSemibold';
}
.count-list p {
    font-size: 14px;
    font-family: 'OpenSans';
}
.small-progress {
    height: 5px;
}
/*Play recording css*/
.audio-row {
    display: flex;
}
.audio-row .progress{width: 100%;margin-bottom: 0}
/*Comment block css*/
.comment-container {
    padding: 10px 10px 15px;
    margin-bottom: 10px;
    box-shadow: 0 0 2px 1px rgba(0,0,0,0.1);
    position: relative;
}
.comment-container:last-child{margin-bottom: 0}
.comment-head{
	font-family: 'OpenSansSemibold';
	font-size: 15px;
}
.comment-date {
    position: absolute;
    right: 10px;
    bottom: 0;
    font-size: 12px;
}
/*Angular table replica*/
.table.angular-tbl-replica{
	color: #003f59
}
.table.angular-tbl-replica > thead > tr{
	border-bottom: 1px solid #94c0d2;
    box-sizing: border-box;
}
.table.angular-tbl-replica > thead > tr > th{
	background: #D9EBF3;
	color: #003f59;
	font-size: 14px;
	border: 1px solid #94c0d2;
	border-top: 1px solid #94c0d2 !important;
	padding: 4px
}
.table.angular-tbl-replica tbody tr td{
	padding: 4px;
	height: 30px
}
.table.angular-tbl-replica > tbody:nth-child(odd) tr td{
	background: #ffffff
}
.table.angular-tbl-replica > tbody tr:nth-child(even) td{
	background: #eaf4f9
}
.inactive-cell {
    transform: rotate(180deg);
}
.fixed-width-tbl{table-layout: fixed}
/*videogular Audio Lib  */
.videogular-container {
	width: 100%;
	/* height: 320px; */
	margin: auto;
	overflow: hidden;
}

.videogular-container.audio {
	height: 38px;
}

.play-audio videogular vg-controls .controls-container, .play-audio [videogular] vg-controls .controls-container{
	background-color: #ffffff;
}
videogular vg-controls .controls-container, [videogular] vg-controls .controls-container,videogular vg-controls, [videogular] vg-controls{
	height: 38px !important
}
videogular vg-scrub-bar [role=slider], [videogular] vg-scrub-bar [role=slider]{
	margin-top: 0 !important;
	margin-bottom: 0 !important
}
videogular .iconButton, [videogular] .iconButton,videogular vg-time-display, [videogular] vg-time-display{
	color: #004a6a !important;
}
videogular vg-time-display, [videogular] vg-time-display{
	width: 60px !important;
	font-size: 16px !important;
}
videogular vg-play-pause-button, [videogular] vg-play-pause-button,videogular vg-mute-button, [videogular] vg-mute-button,videogular vg-volume, [videogular] vg-volume{
	width: 30px !important
}
@media (min-width: 1200px) {
	.videogular-container {
		width: 280px;
		/* height: 658.125px; */
	}

	.videogular-container.audio {
		width: 280px;
		height: 38px;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.videogular-container {
		width: 230px;
		/* height: 528.75px; */
	}

	.videogular-container.audio {
		width: 230px;
		height: 38px;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.videogular-container {
		width: 200px;
		/* height: 409.5px; */
	}

	.videogular-container.audio {
		width: 200px;
		height: 38px;
	}
}
/*end  videogular Audio Lib */

.expectation-popover .popover{
	max-width: 400px !important;
}
.expectation-popover .popover-content{
	width: 320px;
}
.popover-ul-padding{
	padding: 10px 0 0 20px;
}
.exceptional{
	color:#3379e4;
}
.Standards{
	color:#00bd56;
}
.improvements{
	color:#f69314;
}
.danger{
	color:#ff6961;
}
.float-left{border-top: 1px dashed #cccccc;
    margin-top: 10px;}
.template-height{
	height: 330px;
}
.caret-blank {
	display: inline-block;
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
}
.caret-up {
	border-bottom: 8px solid #333;
}
.caret-down {
	border-top: 8px solid #333;
}


#qaReportFilter .filter-Popover .popover{
	top: -60px !important;
}
#qaReportFilter .filter-Popover .popover.right>.arrow{
	top: 70px !important;
}

/* .bottom-loader .loading{
	margin : 1% 3% !important;
}
.select-client .uib-datepicker-popup .btn-default.active{
	background-color: #31b0d5 !important;
    border-color: #269abc !important;
}
.nvd3 text{
	font: normal 12px 'OpenSans', sans-serif;
}



.table.que-table>tbody>tr.has-counter-que td {
    border-bottom: none !important;
}
.counter-que {
    position: relative;
    background: url(../images/drill-arrow.png) 10px top no-repeat;
}
.table.que-table>tbody>tr.counter-que td {
    padding-left: 55px;
}
.counter-que td input[type="text"]{
	width: 100%;
	margin-top: 5px;
} */

#roster-list .filter-Popover .popover{
	width: 700px;
	top: -100px !important;
}

/*AngularJS Dropdown Multiselect*/
.multiselect-parent {
	width: 100%;
  }
  
  .multiselect-parent .dropdown-toggle {
	width: 100%;border-radius: 0;
	border: 1px solid #e5e5e5;
	text-align: left;
}
.multiselect-parent .dropdown-toggle span.caret{float: right;margin: 8px 0;}
.multiselect-parent .dropdown-toggle:hover{
	color: #333;
	background-color: #e6e6e6;
	border-color: #adadad;
}
.multiselect-parent .dropdown-menu {
	width: 100%;
}

#jobTitle-text .ui-select-multiple.ui-select-bootstrap .ui-select-match-item{
	white-space: inherit;
	text-align: inherit;
}
/*track cos dropdown issue css*/
#approve_by .ui-select-bootstrap .ui-select-choices-row>span,
#prj_jt .ui-select-bootstrap .ui-select-choices-row>span,
#prj_hd .ui-select-bootstrap .ui-select-choices-row>span,
#jobTitle-text .ui-select-bootstrap .ui-select-choices-row>span{
	white-space: inherit;
}

#approve_by .ui-select-bootstrap .ui-select-choices-row>span,
#prj_hd .ui-select-bootstrap .ui-select-choices-row>span,
#prj_jt .ui-select-bootstrap .ui-select-choices-row>span,
#jobTitle-text .ui-select-bootstrap .ui-select-choices-row>span{
    padding: 5px 10px;
}
#prj_jt .ui-select-bootstrap .ui-select-choices-row>span, #prj_hd .ui-select-bootstrap .ui-select-choices-row>span{
	white-space: inherit;
}
#prj_hd .ui-select-bootstrap .ui-select-choices-row>span, #prj_jt .ui-select-bootstrap .ui-select-choices-row>span{
	padding: 5px 10px;
}

/*Toogle button css*/
/* The switch - the box around the slider */
.switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 20px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  /* The slider */
  .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 14px;
	width: 14px;
	left: 4px;
	bottom: 3px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider {
	background-color: #2196F3;
  }
  
  input:focus + .slider {
	box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before {
	-webkit-transform: translateX(18px);
	-ms-transform: translateX(18px);
	transform: translateX(18px);
  }
  
  /* Rounded sliders */
  .slider.round {
	border-radius: 34px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  }
.error-line td {
    background: #ffb2b2;
}
.custom_background_red td{
    background: #ffb2b2;
}

#roster-list .filter-Popover .popover.right>.arrow{
	top: 25% !important;
}
/* Uib-datepicker Z-index changes for modal popup */
.uib-datepicker-popup.dropdown-menu{
	z-index: 1051;
}

/*email modal scroll*/
#emailContent .modal-body {
    max-height: calc( 100vh - 376px );
    overflow: auto;
}
tags-input .host{
    height: auto !important;
}
tags-input{
    width: 100% !important;
}
#roster-list .filter-Popover .popover{
	width: 700px;
	top: -100px !important;
}

#roster-list .filter-Popover .popover.right>.arrow{
	top: 25% !important;
}
#jobTitle-text .ui-select-bootstrap .ui-select-choices-row>span,
#initiate_by .ui-select-bootstrap .ui-select-choices-row>span,
#homedep-text .ui-select-bootstrap .ui-select-choices-row>span{
	white-space: inherit;
	padding: 5px 10px;
}


#jobTitle-text .ui-select-multiple.ui-select-bootstrap .ui-select-match-item{
    white-space: inherit;
}
.reason-block{
	display: table;
}
.warning-msg-prj {
    background: #ececec;
    padding: 5px 5px;
    margin-top: 10px;
}
.cursor-disabled {
	cursor: not-allowed;
}
#edit-evalution-template .ui-select-choices-row-inner > div{
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.agent-nesting-evaluation{
	background-color: #f443363d !important;
}

.subnav-button .glyphicon-plus:before {
    content: "\2212";
}
.collapsed .glyphicon-plus:before {
    content:  "\2b";
}
.subnav-button b{
	cursor: pointer;
}
.alertify-notifier .ajs-message.ajs-success,
.alertify-notifier .ajs-message.ajs-error{
	text-shadow: none !important;
	min-width: 300px;
}
/*Rules Module*/
#rulesContainer{
    background: #004a6a;
    border-top: 2px solid #033b52;
	height: 85%;
	width: 0;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	overflow-x: hidden;
	transition: 0.5s;
	margin-top: 71px;
}
#rules-supporter{
    position:fixed;
    background:#004a6a;
    right:0;
    top: 0;
    bottom: 0;
    width:0;
    transition: 0.5s;
}
#rulesContainer.active{
	width: 300px;
}
#rules-supporter.active{width:300px}
.close-rule {
    padding: 0 11px;
    font-size: 24px;
	color: #ffffff;
	background: #013549
}
.rules-area{
	background: #01344a;
}
.rules-area .nav-tabs{border-bottom: none}
.rules-area .nav-tabs>li>a{border: none;}
.rules-area .nav-tabs > li.active > a,.rules-area .nav-tabs > li.active > a:hover,.rules-area .nav-tabs > li.active > a:focus{
	background-color: #004a69;
    color: #fff;
    border: transparent;
    border-bottom-color: transparent;
    border-top: transparent;
}
.rules-area .nav > li > a:hover,.rules-area .nav > li > a:focus{
	background-color: #004a69;
    border: none;
}
.rules-area .tab-content {
	background: #004a69;
	color: #ffffff;
}
.rule-list{
	padding-left: 0;
	list-style: none;
}
.rule-list li{
	padding: 0 10px;
	border-bottom: 1px solid #013549;
}
.rule-list li a{
	border: none;
}
.rule-list li p{
	color: #cccccc
}
.check-block .checkbox{
	margin-bottom: 5px;
}

/*bg image profile*/
#bg-profile-detail{
	background: url(../images/bg-profile-img.jpg) bottom center no-repeat;
	min-height: 205px;
	padding: 20px 0;
    color: #ffffff;
}
#bg-profile-detail-page{
	background: url(../images/bg-profile-img.jpg) bottom center no-repeat;
	/* min-height: 120px;
	padding: 20px 0; */
	min-height: 80px;
	padding: 5px 0;
    color: #ffffff;
}
ul.profile-more-detail {
    list-style: none;
    columns: 3;
}
ul.profile-more-detail li{
	margin-right: 25px
}
.upload-speech .no-records {
	max-width: 100%;
	margin: 0 auto;
}
.upload-speech button {
	margin-top: 30px
}
.btn-blue {
	background: #004a6b;
    color: #fff;
    box-shadow: 0px 4px 17px -5px rgba(0,0,0,0.2);
    border-radius: 0;
    padding: 0;
    display: flex;
    align-items: center;
    margin: 0 auto;
    min-width: 170px;
}
.btn-blue:hover, .btn-blue:focus {
	outline: none;
	color: #fff;
}
.btn-blue .image-box {
	background: #032c3e;
	padding: 6px;
	margin-right: 7px;
}
videogular .iconButton, [videogular] .iconButton{
	margin: 0!important
}

.Play-bars{
	width: 130px;
	height: 40px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}
.line{
	height: 100%;
	width: 4px;
	margin: 0 6px;
	box-shadow: 2px 0 3px rgba(0, 0, 0, .3);
	background-image: linear-gradient(to right, #004a6a , #004a6a 14%);
}

.line:nth-of-type(1){ animation: line-1 2s ease-in infinite; }
.line:nth-of-type(2){ animation: line-2 2s ease-in infinite .3s; }
.line:nth-of-type(3){ animation: line-2 2s ease-in infinite .45s; }
.line:nth-of-type(4){ animation: line-1 2s ease-in infinite; }
.line:nth-of-type(5){ animation: line-1 2s ease-in infinite .05s; }
.line:nth-of-type(6){ animation: line-2 2s ease-in infinite .1s; }
.line:nth-of-type(7){ animation: line-1 3s ease-in infinite ; }

@keyframes line-1 {
	0%, 100%{	height: 60%; }
	24%{ height: 80%; }
	25%, 30%{ height: 85%; }
	55%, 60%{ height: 65%; }
	61%, 65%{ height: 90%; }
	80%, 82%{ height: 50%; }
	83%, 90%{ height: 40%; }
	95%{ height: 40%; }
}
@keyframes line-2 {
	0%, 100%{	height: 50%; }
	12%{ height: 79%; }
	25%, 45%{ height: 100%; }
	52%, 68%{ height: 90%; }
	61%, 65%{ height: 80%; }
	80%, 82%{ height: 40%; }
	83%, 92%{ height: 60%; }
	98%{ height: 65%; }
}

/*Radio*/
.radio-wrapper {
	width: 87px;
	height: 30px;
	display: inline-block;
	vertical-align: middle;
	background: #e7e9ea;
	border-radius: 30px;
	position: relative;
	margin-left: 1%;
	box-shadow: inset 0px 10px 29px -16px rgba(242,242,242,1);
  }
  .radio-wrapper p {
	position: absolute;
	z-index: 10;
	color: #212122;
	font-size: 12px;
    margin: 0;
	margin-top: 11px;
	pointer-events: none;
  }
  .radio-wrapper .correct {
	left: 5px;
    top: -5px;
  }
  .radio-wrapper .wrong {
	right: 6px;
	top: -5px;
  }
  .radio-wrapper .neutral-icon {
	left: 40px;
	top: -5px;
    opacity: .8
  }
  .radio-wrapper label {
	z-index: 9;
  }
  
  input[type="radio"] {
	display: none;
  }
  
  i {
	z-index: 99;
	font-size: 18px;
  }
  
  .neutral-icon i {
	font-size: 10px;
  }
  
  .neutral + label {
	display: inline-block;
	width: 26px;
    height: 26px;
	border-radius: 50%;
	position: absolute;
	left: 36%;
	transition: -webkit-transform 1s;
	transition: transform 1s;
	transition: transform 1s, -webkit-transform 1s;
	top: 2px;
  }
  
  .neutral:checked + label {
	border: 2px solid black;
	display: inline-block;
	width: 26px;
    height: 26px;
	border-radius: 50%;
	background: #eeeeee;
	background: linear-gradient(to bottom, #eeeeee 0%, #cccccc 100%);
  }
  
  .yes + label {
	display: inline-block;
	width: 26px;
    height: 26px;
	border-radius: 50%;
	position: absolute;
	left: 2px;
	top: 2px;
	text-align: center;
  }
  
  .yes:checked + label {
	display: inline-block;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #20d532;
	background: linear-gradient(to bottom, #20d532 0%, #1cc301 100%);
	-moz-animation-duration: 0.4s;
	-moz-animation-name: slidein;
	-webkit-animation-duration: 0.4s;
	-webkit-animation-name: slidein;
	animation-duration: 0.4s;
	animation-name: slidein;
	-webkit-transform: translateZ(0);
  }
  
  .no + label {
	display: inline-block;
	width: 26px;
    height: 26px;
	border-radius: 50%;
	position: absolute;
	right: 2px;
    top: 2px;
	text-align: center;
  }
  
  .no:checked + label {
	display: inline-block;
	width: 26px;
    height: 26px;
	border-radius: 50%;
	background: red;
	-moz-animation-duration: 0.4s;
	-moz-animation-name: slideno;
	-webkit-animation-duration: 0.4s;
	-webkit-animation-name: slideno;
	animation-duration: 0.4s;
	animation-name: slideno;
	-webkit-transform: translateZ(0);
	background: #e66c67;
	background: linear-gradient(to bottom, #e66c67 0%, #dd4f4b 100%);
  }
  
  @-webkit-keyframes slidein {
	from {
	  -webkit-transform: translate(50px, 0);
			  transform: translate(50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0px);
			  transform: translate(0px, 0px);
	}
  }
  
  @keyframes slidein {
	from {
	  -webkit-transform: translate(50px, 0);
			  transform: translate(50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0px);
			  transform: translate(0px, 0px);
	}
  }
  @-webkit-keyframes slideno {
	from {
	  -webkit-transform: translate(-50px, 0);
			  transform: translate(-50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0px);
			  transform: translate(0px, 0px);
	}
  }
  @keyframes slideno {
	from {
	  -webkit-transform: translate(-50px, 0);
			  transform: translate(-50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0px);
			  transform: translate(0px, 0px);
	}
  }
  @-webkit-keyframes returnLeft {
	from {
	  -webkit-transform: translate(-50px, 0);
			  transform: translate(-50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0);
			  transform: translate(0px, 0);
	}
  }
  @keyframes returnLeft {
	from {
	  -webkit-transform: translate(-50px, 0);
			  transform: translate(-50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0);
			  transform: translate(0px, 0);
	}
  }
  @-webkit-keyframes returnRight {
	from {
	  -webkit-transform: translate(50px, 0);
			  transform: translate(50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0);
			  transform: translate(0px, 0);
	}
  }
  @keyframes returnRight {
	from {
	  -webkit-transform: translate(50px, 0);
			  transform: translate(50px, 0);
	}
	to {
	  -webkit-transform: translate(0px, 0);
			  transform: translate(0px, 0);
	}
  }

  /*UI Grid*/
  .ui-grid{color: #333}
  /* .ui-grid-header{border-bottom: 1px solid #dededf;} */
  /* .ui-grid{border: 1px solid #dededf;} */
  .ui-grid-top-panel{background: #c9e5f1}
  /* .ui-grid-header-cell{border-color: #dededf;} */
  .ui-grid-cell{border-bottom: 1px solid #dededf}
  /* .ui-grid-row:hover > [ui-grid-row] > .ui-grid-cell:hover .ui-grid-cell, .ui-grid-row:nth-child(odd):hover .ui-grid-cell, .ui-grid-row:nth-child(even):hover .ui-grid-cell,.ui-grid-row:nth-child(even) .ui-grid-cell{background-color: #ffffff} */
  /* .ui-grid-cell,input[type="text"].ui-grid-filter-input{border-color: #dededf;} */
  .ui-grid-filter-container i{font-size: 12px}

.has-ai-text:hover{
    color: #006DE3;
}

.table-row-ops-supervisor-level{
	background-color:#fdcb89;
}
.table-row-qa-supervisor-level{
	background-color:#fae172;
}
.table-row-qa-manager-level{
	background-color: #d2e487;
}
.table-row-campaign-level{
	background-color:#98e2b0;
}
.table-row-project-level{
	background-color:#b1f8ee;
}
.table-row-location-level{
	background-color:#accefe;
}
/* css for client wise score chart in QA Report screen */
#client-score-chart .nvd3.nv-pie path {
    fill-opacity: 0.8;
}
#client-score-chart svg.nvd3-svg{
    margin-top: -45px !important;
}
#client-score-chart svg{
	margin: 0 auto !important;
}
.agent-score-graph-custom-loader-height{
	margin-top: 153px !important;
}
.sentiment-graph-custom-loader-height{
	margin-top: 185px !important; 
}
.rolling-graph-custom-loader-height{
	margin-top: 150px !important; 	
}
.site-avg-grpah-custom-loader-height{
	margin-top: 160px !important;	
}
.performance-graph-custom-loader-height{
	margin-top: 210px !important;		
}
.client-score-custom-loader-height{
	/*margin-right: 165px;*/
	margin-top: 220px !important;
}
.custom_ul{
        width: 100%;
    height: 10px;
  }
  .custom_li_1 {
    background-color: #d84b2a;
    width: 50%;
  }
  .custom_li_2 {
    background-color: #ee9586;
    width: 50%;
  }
  .custom_li_3 {
    background-color: #e4b7b2;
    width: 50%;
  }
  .custom_li_4 {
    background-color: #beccae;
    width: 50%;
  }
  .custom_li_5 {
    background-color: #9caf84;
    width: 50%;
  }
  .custom_li_6 {
    background-color: #7aa25c;
    width: 50%;
  }


  .map-chart-legend-list {
    display: inline-block;
    margin-left: 10px;
    margin-top: 29px
	}
	.map-chart-legend-list-item {
		position: relative;
		margin-left: 17px;
	}
	.map-chart-legend-size {
		width: 12px;
		height: 12px;
		display: inline-block;
		margin-right: 5px;
		position: absolute;
		margin-top: 4px;
		margin-left: -17px;
		border-radius: 8px;
	}
	.map-chart-legend-text {
		display: inline-block;
		margin-right: 10px;
		margin-top: 0;
	}
	/*****Background colors for graphs****/
	.light-purple{
		background-color: #c56cf0;
	}
	.young-salmon{
		background-color: #ffb8b8;
	}
	.mandarin-sorbet{
		background-color: #ffaf40;
	}
	.spiro-disco-ball{
		background-color: #17c0eb;
	}
	.light-slate-blue{
		background-color: #7d5fff;
	}
	.weird-green{
		background-color: #3ae374;
	}
	.light-red{
		background-color: #ff4d4d;
	}
	.dorn-yellow{
		background-color: #fff200;
	}
	.hammam-blue{
		background-color: #ffb8b8;
	}
	.bluebell{
		background-color: #3B3B98;
	}
	.gray-default{
		background-color: #DDDDDD;
	}
/****New colors****/
	.forestgreen{
		background-color: #38761d
	}
	.olivedrab {
		background-color: #6aa74f;	
	}
	.darkseagreen {
		background-color: #92c27d;	
	}
	.Gainsboro{
		background-color :#d9ead3
	}
	.Tan {
		background-color:  #cccc99
	}
	.Maroon {
		background-color:  #660000
	}
	.Darkred{
		background-color: #990000;
	}
	.Firebrick
	{
		background-color: #ca0202;
	}
	.Indianred
	{
		background-color: #de6666;
	}
	.Darksalmon
	{
		background-color: #e89898;
	}
	.gray {
		background-color: #DDDDDD;
	}
	.positive{
		background-color: #92cbf8;
	}
	.neutral{
		background-color: #d4d4d4;
	}
	.negative{
		background-color: #d60a0a;
	}
	.positive-qa{
		background-color: #f4974c;
	}
	.negative-qa{
		background-color: #92cbf8;
	}
	.toxic{
		background-color: #08e2d7;
	}
	.header-logo img{
		width: 100px;
	}
	
	.chf
	{
		background-color: #de6666;
	}
	.copd
	{
		background-color: #e89898;
	}
	.diabetes{
		background-color: #92cbf8;
	}
	.esrd{
		background-color: #d4d4d4;
	}
	.cancer{
		background-color: #d60a0a;
	}
	.pain{
		background-color: #08e2d7;
	}

.imageResponsive {
	width: 100%;
	height: auto;
}

@media (min-width: 768px) {
	#menu-big .navbar-nav {
		float: inherit !important;;
	}
}
