/*Login page*/
.login-page {background: linear-gradient(to bottom, #ffffff 0%,#ffffff 75%,#1f1f1f 75%,#1f1f1f 100%); }
.login-page h1{
	background: linear-gradient(93.83deg, #DC5070 -6.96%, #5E75FF 107.98%); 
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.login-page h1 span {
	background: linear-gradient(91.8deg, #5C4AF5 -4%, #5CDAE4 88.47%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	display: block;
}
.login-img{ text-align: right;}
.login--form{ max-width: 400px; margin: auto;}
.col-rht{ padding-top: 30px; padding-bottom: 30px; background: #1f1f1f; margin-top: 30px;}

@media (min-width: 1200px) {
	.login-page{
		background: linear-gradient(to right, #ffffff 0%,#ffffff 50%,#1f1f1f 50%,#1f1f1f 100%);
		height: 100%;
		min-height: 100vh;
	}
	.login-page h1{ font-size: 64px; font-weight: 700; line-height: 80px;}
	.col-rht{ padding-right: 0; padding-top: unset; padding-bottom: unset; margin-top: unset;}
}

/*Login page end*/


/*Map page start*/
#map-chart g.raphael-group-4-parentgroup{ filter: unset !important;}
#map-chart g:nth-of-type(2) {filter: brightness(0) invert(1);}
.map-rht-search{ position: relative;}
.map-rht-search:before{ content: url(../images/map/search.svg); position: absolute; top: 15px; left: 10px;}
.map-rht-search input{ padding-left: 40px;}
.srchIcon{ position: relative;}
.srchIcon:before{ content: url(../images/map/search.svg); position: absolute; top: 10px; left: 10px;}
.srchIcon input{ padding-left: 40px;}
.map-rht-col{background: #FFFFFF; border: 0.85823px solid #E2E2E2; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.05); border-radius: 4px;}
.map-rht-search input{ border: 0; border-bottom: 1px solid #ccc; height: 50px; border-radius: 0;}
.map-rht-col .data-box{ padding: 20px;}
.map-rht-col .data-box .data-titl{ font-weight: 500; margin-bottom: 10px;}
.map-rht-col .data-box .data-list{ font-size: 14px;} 
.map-rht-col hr {margin: 10px 0; color: #F6F6F6; border: 0; border-top: 8px solid #F6F6F6; opacity: 1;}
.map-rht-col .data-box .badge{ border-radius: 2px; font-size: 16px; margin-left: 3px;}
.map-rht-col .data-box .bg-success{ background-color: rgba(132, 211, 137, 0.1) !important; color: #449849;}
.map-rht-col .data-box .bg-danger{ background-color: rgba(189, 44, 32, 0.1) !important; color: #BD2C20;}
@media (max-width: 767px) {
	.map-filter-section .form-control, .map-filter-section .form-select {font-size: 14px; height: 38px;}
}

#map-chart{width:100%; height: 500px;}
#map-chart .llabel{ font-size:18px;}
#map-chart .ldata{ margin-top: 25px; font-size: 14px;} 
#map-chart .green{ font-size:20px; padding: 5px 10px; background: rgba(132, 211, 137, 0.1); color: #84D389; margin-left: 8px}
#map-chart .red{ font-size:20px; padding: 5px 10px; background: rgba(225, 47, 32, 0.1); color: #BD2C20;}
#map-chart .orange{ font-size:20px; padding: 5px 10px; background: rgba(255, 165, 59, 0.1); color: #FFA53B;}

/*Map page End*/

/*team page start*/
.team-box{background: #fff; border: 1px solid rgba(198, 198, 198, 0.3); box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05); 
	padding: 20px 10px 20px 20px; width: 100%; margin-bottom: 20px;}
.mem-details{ display: flex; border-bottom: 1px solid #E9E9E9; padding-bottom: 5px; margin-bottom: 10px;}
.mem-img{ flex-shrink: 0; margin-right: 10px; padding-top: 5px;}
.mem-name h5{ font-size: 18px; margin-bottom: 5px; font-weight: 500;}
.mem-name p{ font-size: 12px; font-weight: 400; line-height: 16px;}
.mem-contact .mem-email{ position: relative;}
.mem-contact .mem-email:before{ content: url(../images/team/email.svg); margin-right: 10px;}
.mem-contact .mem-phone{ position: relative; margin-top: 10px;}
.mem-contact .mem-phone:before{ content: url(../images/team/phone.svg); margin-right: 10px;}
.mem-contact .mem-email, .mem-contact .mem-email a{color: #1B78C5; font-weight: 500; font-size: 14px;}
.mem-contact .mem-phone, .mem-contact .mem-phone a{color: #FF7A00; font-weight: 500; font-size: 14px;}
.mem-contact h6{ font-size: 14px; margin-top: 16px; margin-bottom: 10px; line-height: 16px;}
.pform-row .form-check-label{ font-size: 14px;}

@media (min-width: 768px) {
	.pform-row{ display: flex;}
}
@media (min-width: 1200px) {
	.pform-row .form-check-label{ font-size: 16px;}
}
/*team page end*/

/*Dashboard start*/

@media (min-width: 1200px) {
	.col-md-3.dcol-3{width: 20%;}
	.col-md-9.dcol-9{width: 80%;}
}

.header{ 
	background: #000;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
	z-index: 1030;
}

.header .navbar{ padding: 0; }
.header .navbar-brand{ background: #fff; padding: 10px 20px 10px 20px;}
.header .navbar-nav{ display: flex; flex-direction: row; justify-content: space-between; align-items: center;}

.header.container-fluid{
	padding-left:0;
}
.dcol-3{
	padding-left: 0; padding-right: 22px;
}

.exp-logo {
	display: flex !important;
}

	@media (max-width: 767px) {
		.header .navbar {
			padding: 10px 0px;
			position: relative;
		}

		.header .navbar-brand {
			padding: 5px;
		}

		.exp-logo img {
			width: 30px;
		}

		.exp-logo {
			font-size: 12px;
			display: flex;
			align-items: center;
			flex-direction: column;
			position: absolute;
			right: 120px;
			top: 5px;
		}

		.header .userDetails {
			display: flex;
			flex-direction: column-reverse;
			align-items: center;
			justify-content: center;
			font-size: 12px;
			line-height: 16px;
			text-align: center;
		}

			.header .userDetails .avatar img {
				width: 24px;
			}

			.header .userDetails .userName span {
				display: block;
			}
	}

	@media (min-width: 768px) {
		.exp-logo {
			display: flex;
			flex-direction: row;
			align-items: flex-end;
		}

		.header .userDetails {
			display: flex;
			flex-direction: row;
			align-items: center;
		}

		.header .userName {
			margin-right: 10px;
		}
	}

	.dash-lft-col{ background: #fff;}
.dash-lft-col, .dash-rht-col{ padding-top: 10px;}

.lft-addrs{ padding: 20px 20px 20px 10px;display:flex!important;}
.lft-addrs p{ padding-left: 35px; position: relative; font-size: 14px;}
.lft-addrs p a{font-size: 14px; color: #008CFF;}
.lft-addrs p:before{ content: url(../images/marker.svg); position: absolute; left: 0; top: 0;}

@media (min-width: 768px) {
	.dash-lft-col{ background: #fff; height: 100%; min-height: 100vh;}
	.dash-lft-col, .dash-rht-col{ padding-top: 30px;}
}

@media (min-width: 1200px) {
	.lft-addrs{ margin-top: 0px; position: absolute; bottom: 0px;}
	.dash-lft-col.sticky-top{ top: 70px;}
	.dash-lft-col {height: auto; min-height: unset; height: calc(100vh - 72px);}
}

@media (min-width: 1440px) {
	.lft-addrs{ bottom: 10px;}
}


/*vertical tabs*/
.vtab-links .nav-tabs .nav-link {margin-bottom: -1px; border: 0px}
.vtab-links .nav-link{ color: rgba(0,0,0,1); font-weight: 500;}
.vtab-links .nav-tabs .nav-item .nav-link.active{color: #000; background: #F0F0F0; border-radius: 5px;}

@media (max-width: 767px) {
    .vtab-links .nav-tabs {border-bottom: 0px; display: flex; flex-direction: row; flex-wrap: nowrap; width: 100%; overflow-x: auto; margin-bottom: 0px; padding-bottom: 0px; justify-content: space-around;}
    .vtab-links .nav-link {white-space: nowrap; font-size: 13px;}
}

@media (min-width: 768px) {
.vtab-links .nav-tabs{ border: 0; display: flex; flex-direction: column;}
.vtab-links .nav-tabs .nav-link {padding:20px 20px 20px 50px; text-align: left; width: 100%; position: relative; background: transparent; border-radius: 0px;}
.vtab-links .nav-tabs .nav-link:before{ content: url(../images/note-icon.svg); position: absolute; left: 15px; top: 18px;}
.vtab-links .nav-tabs .nav-item .nav-link.active{color: #000; border-radius: 0px; background: #F0F0F0; border-right: 4px solid #000;}	
.vtab-links .nav-tabs .nav-item:nth-last-of-type(1) .nav-link { border-bottom: 0;}
}

@media (min-width: 1366px) {
	.vtab-links .nav-tabs .nav-link {padding:20px 20px 20px 80px;}
	.vtab-links .nav-tabs .nav-link:before{ position: absolute; left: 45px; top: 18px;}
}
/*vertical tabs end*/


.stats-row{ display: grid; grid-template-columns: auto auto; grid-gap:5px}
.stats-box .stats-desc{ font-size: 13px; font-weight: 500; width: 100%;}
.stats-box h3{ font-weight: 400; margin-top: 10px; margin-bottom: 0;}
.stats-box{ padding: 20px 10px 20px 10px; border-radius: 6px;}
.stats-box1{ background: #f5cda8; border-left: 5px solid #F77A09;}
.stats-box2{background: #dde9d1; border-left: 5px solid #96cf5e;}
.stats-box3{background: #f3eec8; border-left: 5px solid #f6c844;}
.stats-box4{background: #ecb9bc; border-left: 5px solid #e13941;}
.stats-box.stats-white{background: #fff; border: 1px solid rgba(198, 198, 198, 0.3); box-shadow: 0px 4px 9px rgba(0, 0, 0, 0.05); 
	padding: 20px 30px;}

@media (min-width: 768px) {
	.stats-row{ display: grid; grid-template-columns: auto auto auto auto;}
	.stats-box{ padding: 10px 10px 10px 10px; margin-right: 5px;}
	.stats-box:nth-last-of-type(1){ margin-right: 0;}
}

@media (min-width: 1200px) {
	.stats-box{ padding: 20px 10px 20px 10px; margin-right: 20px;}
	.stats-box:nth-last-of-type(1){ margin-right: 0;}
}

.chart-tabs{ background: #fff; border: 1px solid #ECECEC; box-shadow: 0px 0px 7px 4px rgba(224, 224, 224, 0.15); padding: 20px; 
	margin-top: 30px;}
.chart-tabs .nav-tabs{ border-bottom: 1px solid rgba(0, 0, 0, 0.1); display: flex; justify-content: space-between;}	
.chart-tabs .nav-link{ border: 0; color: rgba(66, 66, 66, 0.8); font-weight: 500;}
.chart-tabs .nav-link.active{ color: rgba(66, 66, 66, 1); border-bottom: 1px solid #000;}
.chart-tabs .tab-content{ padding-top: 30px;}
.chart--box{background: #FFFFFF; border: 0.928993px solid #ECECEC; box-shadow: 0px 0px 6.50295px 3.71597px rgba(224, 224, 224, 0.15); padding: 20px; margin-bottom: 30px;}
.chart-tabs p{ font-weight: 500;}

@media (min-width: 768px) {
	.chart-tabs .nav-link{ font-size: 14px; white-space: wrap;}
	.chart-tabs .nav-tabs{ display: flex; justify-content: space-evenly; flex-wrap: nowrap;}
}

@media (min-width: 1200px) {
	.chart-tabs .nav-link{ font-size: 16px;}
	.chart-tabs .nav-tabs{ display: flex; justify-content: space-between;}
}

.ocm-rating{ font-size: 20px; font-weight: 500; position: relative; color: #000;}
.ocm-rating::after{ content: url(../images/star.svg); margin-left: 2px; position: relative; top: 3px;}
.ocmr{ color: #000;}

/* Charts*/
.am-dropdown select{ max-width: 200px;}
#dex-overview { width: 100%; height: 500px;}
#dex-dropdown-americas, #dex-dropdown-middle-east, #dex-dropdown-europe, #dex-dropdown-apac{
	width: 100%;
	height: 500px;
}

#dex-dropdown-APAC, #dex-dropdown-UK, #dex-dropdown-US, #dex-dropdown-Chicago, #dex-dropdown-Other {
	width: 100%;
	height: 500px;
}

#logon, #high-cpu, #boot-duration, #applications-crashes, #hard-resets, #bsods, #high-io, #applications-freezes, #system-free-space { 
	width: 100%; 
	height: 280px;
}
#acrobat-reader, #ba-service-now, #ba-eclipse, #ba-sap, #ba-intranet, #ba-salesforce{
	width: 100%; 
	height: 400px;
}

#pc-word, #pc-browser, #pc-excel, #pc-onedrive, #pc-onedrive-desktop, #pc-outlook, #pc-powerpoint, #pc-sharepoint, #pc-teams{
	width: 100%; 
	height: 500px;
}

#bootuptime, #session-launch-speed, #average-network-speed{
	width: 100%; 
	height: 400px;
}

#blue-screen-of-death, #application-crash, #wifi-packet-loss-rate{
	width: 100%; 
	height: 300px;
}

#fcr, #response, #resolution, #chat-bot-utilization, #kb-utilization, #sla-achieved{
	width: 100%; 
	height: 400px;
}

#ocm-overview{
	width: 100%; 
	height: 600px;
}
#ocm-cm-based, #ocm-cm-based-age{
	width: 100%; 
	height: 350px;
}

#ocm-completion-ad-group, #ocm-completion-sso-integration, #ocm-completion-enterprise-app, #ocm-completion-employee-exit, #ocm-completion-windows{
	width: 100%; 
	height: 200px;
}

/********uxm page****************/

#uxm-net-promoter{
	width: 100%; 
	height: 500px;
}

#uxm-happiness-index, #uxm-employee-sentiment, #uxm-interactions, #uxm-satisfaction-csat, #uxm-satisfaction-satby-employee{
	width: 100%; 
	height: 300px;
}

#uxm-engagement, #uxm-satisfaction-by-service, #uxm-satisfaction-by-contact-reason, #uxm-satisfaction-it-interaction-first-5, #uxm-satisfaction-it-interaction-second-5{
	width: 100%; 
	height: 700px;
}

.uxm-users {
    display: flex;
    align-items: center;
    justify-content: center;
	
}

.uxm-csat{
	display: flex;
	align-items: center;
}

.score-box{
	height: 360px;
	border: 0.928993px solid #ECECEC;
	box-shadow: 0px 0px 6.50295px 3.71597px rgba(224, 224, 224, 0.15);
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

.score-box p{
	position: absolute;
	top: 10px;
	left: 12px;
}

.score-box-bg-1{
	background: #F6C844;
}

.score-box-bg-2{
	background: #F9584B;
}

.score-box-bg-3{
	background: #96CF5E;
}

.score-box-bg-4{
	background: #81DC4B;
}

.score-box-bg-5{
	background: #ECA642;
}

@media(max-width: 767px){
	.uxm-csat{
		flex-direction: column;
	}

	.score-box{
		height: 250px;
	}
}