#userManualID
{
	display:none !important;
}

.options-dropdown-content
{
	display: none;
	position: absolute;
	background-color: white;
	box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index: 1;
	line-height: 3;
}

div#pictureOptions bw-span
{
	color: black;
	padding: 15%;
	text-decoration: none;
	display: block;
	font-size: 12px;
}

div#pictureOptions tr:hover
{
	background: #f5f5f5;
	cursor: pointer;
}

.showProfilePicOptions 
{
	display: block;
}

.profileDetail td
{
	font-size: 14px;
}

div.deletedMessageDiv div.itemMessage
{
	color: #aa0000;
	font-style: italic;
	font-weight: bold;
	cursor: default;
}

div.purgedIncommingDiv div.itemSentBy
{
	color: #aa0000;
	font-style: italic;
	font-weight: bold;
	cursor: default;
}

/* 
.deletedMessageDiv td.textTD
{
	color: #aa0000;
	font-style: italic;
	font-weight: bold;
	cursor: default;
} */

input.distButton
{
	min-width: 20% !important;
	padding: 2% 3% !important;
}

#saveSettingID
{
	font-size: 12px !important;
}

#saveSettingID:hover
{
	font-weight:100 !important;
}

#systemLogoID
{
	max-width:40%;
}

#systemDateTD
{
	font-size: 14px !important;
}

div.loginDiv
{
	width: auto !important;
}

.footer
{
	background-color: transparent !important;
	font-size: 16px !important;
	font-weight: bold !important;
	color: #333333 !important;
	text-align: center !important;
	clear: both !important;
	position: fixed !important;
	z-index: 5 !important;
	top: auto !important;
	bottom: 0px !important;
	padding: 0 !important;
	margin: 0 !important;
	padding-bottom: 0% !important;
}

.userPortalFooter
{
	width: 0 !important;
	right: 0 !important;
}

.themedBtn
{
	font-weight:100;
	padding: 2% 2%;
	transition-duration: 0.4s;
	font-size: .8em;
	min-width: 30%;
	margin: 2%;
}

.themedBtn:hover
{
  transition-duration: 0.4s;
}

i.far.fa-calendar-alt
{
	margin-right: 5%;
}

.dropbtn1
{
	background-color: #e8e8e8;
	color: #777777;
	font-size: 14px;
	border: 1px #dadada solid;
	cursor: pointer;
	outline: none;
	white-space:nowrap;
	padding: 6% 10%;
}

.dropbtn1:hover, .dropbtn1:focus
{
	background-color: #e4e4e4;
}

.dropdown1
{
	position: relative;
	display: inline-block;
}

.dropdown-content1
{
	display: none;
	position: absolute;
	background-color: #f1f1f1;
	min-width: 160px;
	overflow: auto;
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
	z-index: 1;
	font-size: 16px;
}

.dropdown-content1 a
{
	color: black !important;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
}

.dropdown-content1 a:hover
{
	background: #e4e4e4;
	text-decoration: none;
}

/* The Modal (background) */
.modal
{
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1; /* Sit on top */
	padding-top: 12px; /* Location of the box */
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,1,0.4); /* Black w/ opacity */
	z-index: 100; /* Ensures the overlay remains top top of the add to calendar buttons */
}

/* Modal Content */
.modal-content
{
	background-color: #fefefe;
	margin: auto;
	padding: 20px;
	border: 1px solid #888;
	width: 65%;
	position:relative;
}

.mds thead td
{
	background: white;
}

input.midEmphasisBtn, .cancelBtn
{
	margin: 2.5% 0%;
	outline: none;
	cursor: pointer;
	padding: .8%;
	font-size: .8em;
	transition: .5s;
	background: transparent;
	border: #e0e0e0 1px solid;
	color: #a7a7a7;
	margin-left: 30px;
}

input.midEmphasisBtn:hover, .cancelBtn:hover
{
	background: white;
	border: 1px solid #9c9c9c;
	transition: .5s;
	color: #505050;
}

/* The Close Button */
.close
{
	right: 3%;
	color: #848484;
	font-size: 36px;
	top: 0;
	position: absolute;
}

.close:hover, .close:focus
{
	color: #dedede;
	text-decoration: none;
	cursor: pointer;
}
/* The tabs on the scheduler/create video room page */

/* Style the tab */
.tab
{
	overflow: hidden;
	margin-bottom: 1%;
}

/* Style the buttons inside the tab */
.tab button
{
	background-color: inherit;
	float: left;
	border: 0;
	outline: 0;
	cursor: pointer;
	padding: 1%;
	font-size: 14px;
	font-weight: 100;
	color: #c3c3c3;
}

/* Change background color of buttons on hover */
.tab button:hover
{
	background-color: #f3f3f3;
}

/* Create an active/current tablink class */
.tab button.activeTab
{
	font-weight: 100;
}

.dashboardIcon
{
	float: right;
	color:#ffffffb8;
	font-size:1em;
	text-decoration:none;
	margin-top:6vh;
	margin-bottom:4vh;
	margin-left:0;
	margin-right:12px;
	min-width:0;
	cursor:pointer;
	width:22px;
	height:22px;
}

.dashboardIcon:hover
{
	color:#ffffff;
}

/* Toggle Switch Style*/

 .dropbtn
{
	background-color: #3498DB;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;
	cursor: pointer;
}

.dropbtn:hover, .dropbtn:focus
{
	background-color: #2980B9;
}

.dropdown
{
	position: relative;
	display: inline-block;
}

.dropdown-content
{
	display: none;
	position: absolute;
	background-color: #f1f1f1;
	min-width: 100px;
	overflow: auto;
	box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
	z-index: 1;
	top: 1px;
	right: 0px;
	margin-top: 20px;
	line-height: 4;
}

.dropdown-content a
{
	color: black;
	text-decoration: none;
	display: block;
	padding: 2px 12px;
	font-size: 90%;
}

.dropdown a:hover {background-color: #ddd;}

.show
{
	display: block;
	width: max-content;
}

#tableHeadText
{
	color: #2d7ca1;
	font-variant: petite-caps;
	font-size: .9em;
	font-weight:400;
}

.onoffswitch
{
	position: relative; width: 50px;
	-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
	float:right;
}

.onoffswitch-checkbox
{
	display: none;
}

.onoffswitch-label
{
	display: block; overflow: hidden; cursor: pointer;
	border-radius: 42px;
}

.onoffswitch-inner
{
	display: block; width: 200%; margin-left: -100%;
	transition: margin 0.3s ease-in ;
	-moz-transition: margin 0.3s ease-in ; -webkit-transition: margin 0.3s ease-in;  -ms-user-transition: margin 0.3s ease-in;
}
.onoffswitch-inner:before, .onoffswitch-inner:after
{
	display: block; float: left; width: 50%; height: 23px; padding: 0; line-height: 23px;
	font-size: 12px; color: white; font-family: Trebuchet, Arial, sans-serif;
	box-sizing: border-box;
}
.onoffswitch-inner:before
{
	/* background-color: #2d7ca1;  distributor file */
	content: "";
	padding-left: 14px;
	color: #FFFFFF;
}
.onoffswitch-inner:after
{
	content: "";
	padding-right: 14px;
	background-color: #EEEEEE; color: #999999;
	text-align: right;
}
.onoffswitch-switch
{
	display: block; width: 14px; margin: 4.5px;
	background: #FFFFFF;
	position: absolute; top: 0; bottom: 0;
	right: 25px;
	border: 1px solid #999999; border-radius: 42px;
	transition: all 0.3s ease-in ;
	-moz-transition: all 0.3s ease-in ; -webkit-transition: all 0.3s ease-in ;  -ms-user-transition: all 0.3s ease-in;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner
{
	margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch
{
	right: 0px;
}

.settingsTable .onoffswitch
{
	float: left;
}
/* End: Toggle Switch Style*/

/* User Screen: Buttons*/
.customThemeBtn
{
	padding: .5% 2% ;
	transition-duration: .4s;
	float: left;
	margin: 0 1% 0% 0;
	vertical-align: middle;
	cursor: pointer;
	outline:none;
}

.customThemeBtn:hover
{
	transition-duration:.4s;
}

.dropdownNoBG
{
	background: white;
	outline: none;
	cursor: pointer;
}

.dropdowntheme
{
	color: #313131 !important;
	border: #d2d0d0 1px solid;
	background: white;
	height: 2em;
	width: max-content;
	outline: none;
	cursor: pointer;
}

#activeWeekdayText
{
	font-size: 1.5em;
	font-weight: bold;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.pageNumberDisplay
{
	float: right;
	text-align:right;
	margin-bottom: .3%;
	width:20%;

}

#pgNumberText
{
	font-size: .85em;
	font-weight: 300;
}

#selectAmountPerPage
{
	margin-bottom: .2%;
}

#inactivePageNumber
{
	color: #767676;
	font-weight: 100;
	font-size: 80%;
	margin-right: 4%;
}

/*table header text*/
.sorttable_nosort
{
	font-weight: 300;
}

.sorttable_sorted
{
	color: #044868;
}

.clickable
{
	cursor: pointer;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-weight: 'lighter';
}

.form-control
{
	cursor: pointer;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 1.2em;
}

.hoverGreyBg:hover
{
	background: #F4F4F4;
}

bw-span
{
	display: none;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

#subHeaderText
{
	font-size: 1.3em;
}

.non-select
{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
}

.noBorder
{
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border-style: inset inset inset inset;
	background-color: transparent;
}

.noMargin
{
	margin: 0 0 0 0;
}

body.userinterfaceBody
{
	margin: 0 0 0 0;
}

img.editContactImg
{
	width: 32px;
	padding-left: 12px;
	padding-right: 12px;
}

iframe.iFrameNoBorder
{
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	background-color: transparent;
	overflow: hidden;
	border:none;
	width:100%;
	text-align: center;
	height: 100%;
}

img.userInterfaceDialIcon
{
	display:none;
	width: 24px;
	height: 24px;
}

img.selectUserChatIcon
{
	width: 32px;
	margin-left: 5px;
}

div.chatDock
{
	bottom: 0;
	direction: rtl;
	position: fixed;
	right: 0;
	z-index: 300;
	height:310px;
	overflow-y: hidden;
	white-space:nowrap;
	bottom:0;
}

div.chatListDock
{
	direction: rtl;
	position: fixed;
	right: 0;
	z-index: 301;
	overflow-y: hidden;
	white-space:nowrap;
	margin: 0 1.5vw -1vh 0;
	bottom: 0;
}

div.chatDiv, div.chatList
{
	direction: ltr;
	background: #FFFFFF;
	display: inline-block;
	white-space:normal;
	margin-left: 10px;
	border-right: 1px solid #dadada;
	box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.2);
}

div.chatListTitleDiv
{
	background: #2d7ca1;
	color: white;
	min-height: 10vh;
}

div.chatInputDiv textarea
{
	resize: none;
}

textarea.inputText
{
	outline: none;
	font-size:.9em;
	font-weight:100;
	padding:2%;
	border:1px solid #e2e2e2;
	font-family:sans-serif;
}

div.chatListBodyDiv
{
	background: white;
	font-family: 'Open Sans','Lato';
	font-size: 10pt;
	max-height: 70vh;
	min-height: 70vh;
	overflow-x: hidden;
	overflow-y: auto;
}

div.chatBodyDiv 
{
	background: #fffcf2;
	font-family: 'Open Sans','Lato';
	font-size: 11pt;
	width: 28em !important;
	overflow-x: hidden;
	overflow-y: auto;
	min-height: 50vh;
	max-height: 50vh;
}

.readChatListDiv font 
{
	color: #525252 !important;
	font-size: 12px !important;
	font-weight: 100 !important;
}

div.chatList
{
	max-width: 340px;
}

.chatNameSpan 
{
	user-select: none;
	font-weight: 100;
}

div.chatListTitleDiv
{
	padding: 10px;
	font-family:'Open Sans','Lato';
}

img.chatControl
{
	float: right;
	width: 8%;
}

div.chatDiv, div.chatList
{
	direction: ltr;
	background: #FFFFFF;
	/* height: 98%; */
	display: inline-block;
	white-space:normal;
	margin-left: 10px;
	box-shadow: 0 0 0 1px rgba(0,0,0,.1), 0 4px 6px rgba(0,0,0,.2);
	min-width: 350px;
}

div.gridOutgoingContainerChatSummary > div.itemImage > img, div.gridIncommingContainerChatSummary > div.itemImage > img
{
	width: 48px;
	height: 48px;
	float: left;
	border-radius: 50%;
}

div.gridOutgoingContainerChatSummary > div.itemName, div.gridIncommingContainerChatSummary > div.itemName
{
	font-weight: bold;
}

div.gridOutgoingContainerChatSummary > div.itemSentBy
{
	text-align: left;
	color: #a749e2;
}

div.gridIncommingContainerChatSummary > div.itemSentBy
{
	text-align: left;
}

div.gridOutgoingContainerChatSummary > div.itemTimestamp
{
	text-align: right;
	color: #a749e2;
}

div.gridIncommingContainerChatSummary > div.itemTimestamp
{
	text-align: right;
}

div.gridOutgoingContainerChatSummary > div.itemMessage
{
	text-align: justify;
	border-radius: 18px;
	background-color: #e6dfea;
	padding: 4%;
}

div.gridIncommingContainerChatSummary > div.itemMessage
{
	text-align: justify;
	border-radius: 18px;
	background-color: #f7edd7;
	padding: 4%;
}

div.gridContainerChatSummary
{
	display: grid;
	grid-template-areas:
		'image image name name name numberOfMessages'
		'sentBy sentBy sentBy timestamp timestamp timestamp'
		'message message message message message message';
	grid-template-columns: auto auto auto auto auto 25px;
	grid-gap: 5px;
	padding: 5px;
	border: #f1f1f1 2px solid;
	margin: 0;
	font-size: 12px;
	background-color: #fffcf2;
}

div.gridContainerChatSummary > div.itemImage { grid-area: image; }
div.gridContainerChatSummary > div.itemName { grid-area: name; }
div.gridContainerChatSummary > div.itemTimestamp { grid-area: timestamp; }
div.gridContainerChatSummary > div.itemSentBy { grid-area: sentBy; }
div.gridContainerChatSummary > div.itemMessage  { grid-area: message; }
div.gridContainerChatSummary > div.itemNumberOfMessages { grid-area: numberOfMessages; }


div.userIncommingDiv > div.itemImage { grid-area: image; }
div.userIncommingDiv > div.itemTimestamp { grid-area: timestamp; }
div.userIncommingDiv > div.itemSentBy { grid-area: sentBy; }
div.userIncommingDiv > div.itemMessage { grid-area: message; }

div.userIncommingDiv > div.itemSentBy
{
	text-align: left;
}

div.userIncommingDiv > div.itemTimestamp
{
	text-align: right;
}

div.userIncommingDiv > div.itemMessage
{
	text-align: justify;
	border-radius: 18px;
	background-color: #f7edd7;
	padding: 4%;
}

div.userIncommingDiv > div.itemImage > img
{
	width: 48px;
	height: 48px;
	float: right;
	border-radius: 50%;
}

div.userIncommingDiv 
{
	display: grid;
	grid-template-areas:
		'sentBy sentBy timestamp timestamp timestamp image'
		'message message message message message image';
	grid-gap: 5px;
	padding: 10px;
	border: #f1f1f1 2px solid;
	margin: 0;
	width: 380px;
	font-size: 12px;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	color: #313131;  
	background: #fffcf2;
}

div.userIncommingInfoDiv
{
	background: #d6e0ff;
}

div.userOutgoingDiv > div.itemImage { grid-area: image; }
div.userOutgoingDiv > div.itemTimestamp { grid-area: timestamp; }
div.userOutgoingDiv > div.itemSentBy { grid-area: sentBy; }
div.userOutgoingDiv > div.itemMessage { grid-area: message; }

div.userOutgoingDiv > div.itemSentBy
{
	text-align: left;
	color: #a749e2;
}

div.userOutgoingDiv > div.itemTimestamp
{
	text-align: right;
	color: #a749e2;
}

div.userOutgoingDiv > div.itemMessage
{
	text-align: justify;
	border-radius: 18px;
	background-color: #e6dfea;
	padding: 4%;
}

div.userOutgoingDiv > div.itemImage > img
{
	width: 48px;
	height: 48px;
	float: left;
	border-radius: 50%;
}

div.userOutgoingDiv 
{
	display: grid;
	grid-template-areas:
		'image sentBy sentBy timestamp timestamp timestamp'
		'image message message message message message';
	grid-gap: 5px;
	padding: 10px;
	border: #f1f1f1 2px solid;
	margin: 0;
	width: 380px;
	font-size: 12px;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	color: #313131;
	background: #fffcf2;
}

/* individualConverseTitleDiv */

div.individualConverseTitleDiv > div.itemNumberOfMessages { grid-area: numberOfMessages; }
div.individualConverseTitleDiv > div.itemChatControl { grid-area: chatControl; }
div.individualConverseTitleDiv > div.itemName { grid-area: name; }


div.individualConverseTitleDiv > div.itemName
{
	text-align: left;
}


div.individualConverseTitleDiv > div.itemChatControl > img
{
	width: 32px;
	float: right;
}

div.individualConverseTitleDiv > div.itemImage > img
{
	width: 48px;
	height: 48px;
	float: left;
	border-radius: 50%;
}

div.individualConverseTitleDiv 
{
	display: grid;
	grid-template-areas:
		'image numberOfMessages chatControl'
		'name name name';
	grid-gap: 5px;
	padding: 10px;
	margin: 0;
	font-size: 12px;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	color: white;
	background: #2d7ca1;

	min-height: 10vh;
}

/* individualConverseDiv */

div.scrollConverseBackDiv
{
	padding: 10px;
	border-top: #f1f1f1 2px solid;
	margin: 0;
	font-size: 12px;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	color: white;
	background: #a15e2df0;
	
}

#logout:hover
{
	cursor: pointer;
	text-decoration: underline;
}

div.iFrameDiv
{
	float: left;
	top:0;
	left:0;
	bottom:0;
	width:98%;
}

div.wrapper
{
	position :relative;
	width: 78%;
	margin: 0px auto;
	float:right;
}

div.extnInfo
{
	color: #333333;
	text-align: left;
	text-decoration: none;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 0.8em;
	overflow: hidden;
}

div.centerTableDiv
{
	width: 50%;
	margin: 0 auto;
	display: table-cell;
}

img.topMenuImg
{
	max-width:50%;
}

.navMenuText
{
	font-size: 12px;
	user-select: none;
	display: block !important;
}

td.navMenuItems
{
	text-align: center;
	white-space: nowrap;
	padding: .5% 0;
}

div.extnInfoMargin
{
	margin-top: 12px;
	margin-left: 12px;
}

/* Round Borders */
table.roundBorderWithTh, table.roundBorderNoTh, table.roundBorderWithThEmpty
{
	border: 1px solid #e4e4e4;
	width:100%;
	border-collapse: collapse;
}

table.roundBorderWithThTop
{
	border: solid #dcdcdc;
	border-width: 1px 1px 0px 1px;
}

table#roundBorderBottom, table.roundBorderBottom
{
	border: solid #c6c6c6;
	border-width: 0px 1px 1px 1px;
	border-collapse: initial;
	font-size: 12px;
	background: #fff;
}

div.groupCallInfoDiv
{
	position : relative;
	float:right;
	top:0;
	right:0;
	background-color: transparent;
	display: none;
	width: 41%;
	height: 720px;
}

div.systemInfoDiv
{
	top:0;
	right:0;
	background-color: transparent;
	width: 290px;
}

input.userInterfaceNumberToDial
{
	width: 195px;
}

div.groupCompletedCallsDiv
{
	float: right;
	width: 55%;
}

div.groupActiveCallsDiv
{
	float: left;
	width: 37%;
}

table.otherPartyTable, table.parkedCallsTable, table.pickupCallsTable, table.groupCompletedCallsTable
{
	width: 100%;
	border-width:0;
	text-align: left;
	/*
	border: solid #666666;
	border-width: 1px 0 1px 0;

	margin: 12px 0 70px 0;
	*/
	border-spacing: 0px 0px;
	font-size: 12px;
	font-family:'Open Sans','Lato';
}

img.callActionIcon
{
	width: 10%;
	vertical-align: middle;
	margin:0% 1.5%;
	float:right;
}

div.callActionControlDiv
{
	padding-top: 4px;
}

div.callActionControlCalledPartyDiv
{
	padding-top: 12px;
}

@keyframes fadeIn
{
	from{ opacity:0;}
}

div.callerNameDiv
{
	float:left;
	max-width: 120px;
}

.callerName
{
	font-size: 9pt;
	font-weight: 100;
	display: block !important;
	line-height: 1.5;
	text-align: left;
}

.fadeAlternate
{
	 animation: fadeIn .8s infinite alternate;
	-moz-animation: fadeIn .8s infinite alternate;
	-webkit-animation: fadeIn .8s infinite alternate;
}

.inCallRect
{
	width: 4px;
	float: left;
}

.callListTbody .otherPartyRow:hover .inCallRect,.parkedCallRow:hover .inCallRect, .pickupCallRow:hover .inCallRect
{
	width: 4px;
}


table.groupCompletedCallsTable
{
	margin: 0 0 0 0;
	border-collapse: collapse;
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

table.usersConsoleTable
{
	text-align: center;
	margin: 0 0 0 0;
	border-spacing: 0px 0px;
	table-layout: fixed;
}

td.onOffTD, td.groupOptOutTD, td.miscTD
{
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 1em;
	font-weight: bold;
	cursor:pointer;
	user-select:none;
	-moz-user-select:none;
	-webkit-user-select:none;
	height:42px;
}

table.groupCompletedCallsTable th, table.contactTable th,
table.onOffTable th, table.groupOptOutTable th, table.miscTable th
{
	vertical-align: middle;
	background: linear-gradient( #FFFFFF, #DDDDDD );
	color: #666666;
}

table.otherPartyTable th, table.parkedCallsTable th, table.pickupCallsTable th
{
	vertical-align: middle;
	padding: 3%;
	font-weight: 100;
}

.multiOlSelect .ui-selected:nth-child(even)
{
	background: #DDDDDD;
}

.multiOlSelect .ui-selected:nth-child(odd)
{
	background: #CCCCCC;
}

table.otherPartyTable tr
{
	background: #e3ffe6;
	padding: 4px;
}

table.parkedCallsTable tr
{
	background: #feeedb;
	padding: 4px;
}

table.pickupCallsTable tr
{
	background: #f4e7f5;
	padding: 4px;
}

.split
{
	height:100%;
	position:fixed;
	z-index:1;
	top:0;
	overflow-x: hidden;
}

div.phoneDialler
{
	width:21%;
	left:0;
	background-color: white;
	border-right: #f1efef solid .1em;
	height: 101vh;
	overflow:  hidden;
}

#normalStateArea
{
	display:contents;
}

#parkingSpacesArea
{
	display:none;
}

#parkingSpacesHeading
{
	background-color: #D8EAF3;
	color: #05608a;
	padding: 4%;
	text-align: center;
	font-size: 16px;
	font-weight: 100;
	user-select:none;
}

#parkingSearchWindow 
{
	width: 85%;
	font-size: 12px;
	padding: 3% 1% 3% 3%;
	outline: 0;
	font-weight: 100;
	border:none;
}

input#parkingSearchWindow:focus 
{
	background-color: transparent;
}

#parkingSpaceList 
{
	list-style-type: none;
	padding: 0;
	margin: 0;
	height: 92%;
	overflow: auto;
	position: relative;
	overflow-x: hidden;
}

#parkingSpaceList li  
{
	border-bottom: .2px solid #efefef;
	padding: 3%;
}

#parkingSpaceList li:hover 
{
	cursor: pointer;
	background-color: #f5f5f5;
}

#parkingSpaceList li div 
{
	padding-right: 0;
	text-decoration: none;
	font-size: 16px;
	color: black;
	display: table;
	width: 100%;
	font-weight: 100;
}

#parkingSpaceList li .circleCell
{
	width: 10%;
	display: table-cell;
	vertical-align: middle;
}

.parkingSpaceStatusDot 
{
	height: 15px;
	width: 15px;
	border-radius: 50%;
	display: inline-block;
}

.availabilityText 
{
	font-size:14px;
}

.parkingSpaceStatusDot.available 
{
	background: #7AD3AB;
}

.availabilityText.available 
{
	color: #7AD3AB;
}

.inUse
{
	background: #fff3f4;
	pointer-events: none;
}

.parkingSpaceStatusDot.unavailable 
{
	background: #F4777C;
}

.availabilityText.unavailable 
{
	color: #F4777C;
}



td.profileAndStatus
{
	position: relative;
	width:20%;
}

img.currentDndIcon
{
	position: absolute;
	width: 31%;
	right: 0;
	bottom: 0;
	pointer-events: none;
}

img.dropDownDndIcon
{
	position: relative;
	width: 7px;
	height: 7px;
	top: -5px;
	left: 0px;
}

img.shadowmanIcon
{
	width: 90%;
}

.profile-container
{
	width: 48px;
	height: 48px;
	overflow: hidden;
	position: relative;
	-webkit-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	cursor: pointer
}

.profile-container img
{
	width: 48px;
	height: 48px;
	backface-visibility: hidden;
	opacity: 1;
}

.profile-container:hover #profileImage
{
	opacity: 0.4;
}

.profile-container:hover .middle
{
	opacity: 1;
}

.middle
{
	transition: .5s ease;
	opacity: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	text-align: center;
}

.profileHoverText
{
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	color: white;
	font-size: 8px;
	white-space: nowrap;
	user-select: none;
	font-weight: 400;
}

td.dateline
{
	background-color: #044868;
}

div.electronAppFooter
{
	display:none;
	background-color: #044868;
	font-size: 1.2em;
	font-weight: bold;
	color: #333333;
	text-align: center;
	clear: both;
	position: fixed;
	z-index: 4;
	top: auto;
	bottom: 0px;
	width: 100%;
	padding: 20px 0 0 20px;
	margin: 0 0 0 -12px;
}

div.dialAndActiveWrapperDiv
{
	position: relative;
	width:100%;
}

div.activeWrapperDiv
{
	background-color: white;
	height: 75vh;
	/* margin-top: -3%; */
}

tr.otherPartyNewRow, tr.newRowParkedCall, tr.newRowPickupCall
{
	display: none;
}

tr.otherPartyRow
{
	width: 100%;
}

#clickToChangeDndDivID, #changeActivePhoneDivID
{
	display: none;
	position: absolute;
	z-index: 21;
	box-shadow: 2px 0px 3px 0 #dedede91;
	min-width: 45%;
	width: 55%;
	right:0;
}

font.extnNameSysInfo, font.extnNumberSysInfo, bw-span.currentDndFont
{
	font-family:'Open Sans','Lato';
	color: #ffffffd1;
	pointer-events: none;
}

.profileArea
{
	color: #d8eaf3;
	font-size: .9em;
	user-select: none;
	display: table;
	width: 100%;
}

bw-span.currentDndFont:hover
{
	pointer-events: none;
}

.activeExtnRef
{
	color:#ffffffd1;
	font-size:.8em;
	margin-left:1%;
	margin-right:1%;
	font-weight:100;
}

#currentDndFont
{
	color: #ffffffd1;
	margin-left:4%;
	font-size:.8em;
	margin-right:2%;
}

img.activeExtnRefIcon
{
	width: 7px;
	height: 7px;
	position: relative;
	vertical-align: middle;
}

#otherPartyDiv tbody.callListTbody
{
	height:26vh;
}

tbody.callListTbody
{
	display: none;
	height: 17vh;
}

bw-span.groupCallBwSpan
{
	color: #666666;
	font-style: italic;
	font-weight: bold;
	font-size: 9pt;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

font.groupCallValueFont
{
 	color: #666666;
	font-size: 10pt;
	font-weight: bold;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

font.groupCallTimeFont
{
	color: #666666;
	font-style: italic;
	font-size: 9pt;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

font.groupCallTimeValueFont
{
	color:#666666;
	font-size: 9pt;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

.groupCallHeadingFont
{
	color: #666666;
	font-weight: bold;
	font-size: 10pt;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

td.groupCallInfoTD, td.groupCallImgTD
{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	text-align: left;
	vertical-align: top;
	white-space: nowrap;
}

td.groupCallInfo2TD
{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	text-align: right;
	vertical-align: top;
	white-space: nowrap;
}

td.groupCallImgTD, img.groupConnectedTime
{
	width: 24px;
}

img.GroupCallHeaderImg
{
	width: 48px;
	float: left;
}

td.groupActiveConnectedCallInfoTH font, td.groupActiveQueueCallInfoTH font
{
	font-size: 9pt;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

td.fullWallTotalMissedCallsTD
{
	color: #000000;
}

tr.newActiveCall
{
	display: none;
}

table.fullWallOuterTable
{
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	background-color: transparent;
	border-spacing: 2px 5px;
}

th.fullWallTH
{
	user-select: none;
	background-color: #E0E0E0;
	color: #117;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 10pt;
	vertical-align: middle;
	border-spacing: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

button.resetGroupInfoBtn
{
	display: none;
}

div.wallHeaderDiv
{
	position: relative;
	top: -70px;
	height: 150px;
	width: 950px;
	left: 200px;
}

td.noCallCenreEntriesTD
{
	border: 3px outset #5080A0;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	text-align: left;
	vertical-align: top;
}

td.noCallCenreEntriesTD:hover
{
	cursor: pointer;
	background: #5080A0;
}

img.editFullWallIcon
{
	width: 64px;
}

img.editFullWallIcon:hover
{
	cursor: pointer;
	background: #F4F4F4;
}

.multiOlSelect .ui-selecting
{
	background: #FECA40;
}

.multiOlSelect
{
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 12pt;
	vertical-align: middle;
}

div.fullWallTotalHeaderDiv
{
	display: flex;
	padding:1%;
	font-weight: 100;
	align-items: center;
}

div.fullWallHeader0Div
{
	position: relative;
	width: 128px;
	display: table-cell;
}

div.fullWallHeader0Div font
{
	position: relative;
}

img.fullWallLogout
{
	position: relative;
	top: -12px;
	left: 5px;
}

.editFullWallIcon{
	position: fixed;
	right: 2%;
	top: 3%;
	margin: 0;
}

/*

div.fullWallHeader1Div
{
	position: relative;
	width : 128px;
	display: table-cell;
}

div.fullWallHeader1Div font
{
	position: relative;
	font-style: italic;
	color: darkgreen;
	top: -26px;
}

div.fullWallHeader2Div
{
	position: relative;
	white-space: normal;
	display: table-cell;
	text-align: center;
}

div.fullWallHeader2Div font
{
	position: relative;
	top: -26px;
}

div.fullWallHeader3Div
{
	width: 128px;
	position: relative;
	display: table-cell;
}

*/

div.fullWallGroupDiv, div.fullWallPrefDiv, div.groupActiveCallsDiv, div.groupCompletedCallsDiv, div.userConsoleHeaderDiv, div.multiSelectDiv
{
	background-color: #fff;
	text-align: center;
	white-space: nowrap;
	font-weight: bold;
	user-select: none;
	color: #117;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 14px;
	vertical-align: middle;
	padding: 0;
	margin: .2%;
	border: 1px solid;
	border-color: #DCDCDF;
	border-radius: 4px;
}

div.scheduledReportDiv
{
	padding: 12px 12px 12px 12px;
}

div.groupActiveCallsDiv, div.groupCompletedCallsDiv
{
	margin: 0px 0px 0px 0px;
}

div.groupCompletedCallsDiv
{
	width: 60%;
}

div.userConsoleHeaderDiv
{
	background-color: #FFFFFF;
	text-align: left;
	white-space: nowrap;
	font-weight: lighter;
	user-select: none;
	color: #666666;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 14px;
	vertical-align: middle;
	border-spacing: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border: 0;
	border-color: #999999;
	width: 98% !important;
	display:table;
}

.allWallOverlay{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(2px);
	z-index: 5;
	display:none;
}

div.fullWallPrefDiv
{
	text-align: left;
	display: none;
	position: fixed;
	z-index: 21;
	right: 35%;
	top: 10%;
	width: 25%;
	height: 80%;
	border:none;
}

.popOutHeader
{
	font-weight: 100;
	padding: 3% 3%;
	display: flex;
	align-items: center;
	}
	
 .closeModal
 {
	cursor: pointer;
	font-size: 1.4em;
	position: absolute;
	right: 3%;
 }
	
.popOutTableDiv
{
	overflow-y: scroll;
	height: 92%;
}
	
div.multiSelectDiv
{
	text-align: left;
	display: none;
	z-index:21;
}

div.fullWallGroupDiv
{
	float:left;
}

div.consolePrefDiv
{
	display: none;
	position:absolute;
	z-index:21;
	right:1%;
	top:2%;
}

select.consolePrefSelect
{
	width: 10em;
}

table.fullWallGroupTable
{
	width: 100%;
	text-align: center;
	border-spacing: 0px 0px;
}
/*
.fullWallGroupTD
{
	background-color: #EEEEEE;
	text-align: center;
	white-space: nowrap;
	font-weight: bold;
	padding: 0px;
	border-width: 0px 0px 0px 0px;
	border-color: #999999;
}
*/
th.fullWallGroupTD
{
	font-size: 12pt;
}

.fullWallGroupHeaderTD
{
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
}

td.fullWallGroupTD
{
	text-align: center;
}

td.fullWallGroupTD font
{
	font-size: 10pt;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
}

textarea.fullwallCaptionText
{
	resize: none;
	text-align: left;
	word-wrap: break-word;
	width: 90%;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	padding: 1%;
}

td.fullwallCaptionTD
{
	margin: 0 auto;
	text-align: center; /* center textbox horizontally */
	vertical-align: middle; /* center textbox vertically */
}

table.fullWallPrefTable
{
	width: 100%;
	border-spacing: 0px 0px;
}

table.multiSelectTable
{
	width: 100%;
	border-spacing: 12px 12px;
}

table.multiSelectTable td
{
	border-radius: 7px;
	background-color: aliceblue;
}

table.fullWallPrefTable td, table.multiSelectTable td
{
	color:#404040;
}

table.fullWallPrefTable tr:hover, table.multiSelectTable td:hover {background: #E0E0E0}

td.thesholdCountTD
{
	width:17%;
}

table.groupCompletedCallsInnerTable
{
	width:100%;
}

font.up6pxFont
{
	position: relative;
	top: -6px;
}

div.fixedConsoleHeaderDiv
{
	top: 0px;
	left: 0px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

div.scrollConsoleDiv
{
	overflow-y: auto;
	padding: 0 0 0 0;
}

.callCentreScheduledReportThFont
{
	position: relative;
	top: -12px;
}

table.scheduledReportTable th
{
	color: #117;
}

table.scheduledReportTable td
{
	color: rgb(100, 80, 80);
}

table.innerBorderTable
{
	border-collapse: collapse;
}

table.innerBorderTable td, table.innerBorderTable th
{
	border: 1px solid black;
}

table.innerBorderTable tr:first-child th,
table.innerBorderTable tr:first-child td
{
	border-top: 0;
}

table.innerBorderTable tr:last-child td
{
	border-bottom: 0;
}

table.innerBorderTable tr td:first-child,
table.innerBorderTable tr th:first-child
{
	border-left: 0;
}

table.innerBorderTable tr td:last-child,
table.innerBorderTable tr th:last-child
{
	border-right: 0;
}

.nextReportFont
{
	color: rgb(57, 126, 69);
	font-style: italic;
}

td.contactsTD
{
	position:relative;
}

bw-span.newContactText, span.newContactText
{
	user-select:none;
	color: #666666;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 1.2empt;
}

bw-span.newContactText:hover, span.newContactText:hover
{
	cursor:pointer;
	text-decoration:underline;
}

.contactRadioButton, .contactRadioText
{
	position:relative;
	user-select:none;
	color: #666666;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 1.2empt;
}

img.newContactIcon
{
	position:relative;
	width: 22px;
	top: 1px;
}

img.cliIcon, img.barringIcon
{
	position:relative;
	width:24px;
	top:2px;
	cursor:pointer;
}

img.add
{
	position:relative;
	cursor:pointer;
	top:0px;
}

font.dialText, font.toggleFont
{
	position:relative;
	top:-8px;
}

div.tablesorterPager
{
	display:none;
}

input.searchBox
{
	user-select:text;
	-moz-user-select:text;
	-webkit-user-select: text;
	z-index:20;
	position: relative;
}

img.searchIcon
{
	position:relative;
	top:5px;
	z-index:20;
	margin-right: 5px;
}

th.searchHeader
{
	user-select: none;
	-khtml-user-select: none;
	-o-user-select: none;
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	padding-top: 5px;
}

font.headingFont
{
	position:relative;
	top:-24px;
	left:12px;
}

font.numberEntryFont, font.speedDialRef
{
	position:relative;
	top:5px;
}

bw-span.speedDialNumberTypeText
{
	position:relative;
	top:-8px;
	left:5px;
	color:#404E77;
	font-style:italic;
}

font.dialText:hover
{
	cursor: pointer;
	text-decoration: underline;
}

td.nameTD
{
	white-space:nowrap;
}

div.pager
{
	display:none;
	float: right;
	margin-bottom: 40px;
	margin-right: 5px;
}

table.contactTable
{
	width: 100%;
	border-spacing: 0;
	color:#666666;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	background: white;
	font-weight:100;
}

img.pagerFirst, img.pagerPrev, img.pagerNext, img.pagerLast
{
	/* height: 24px;
	padding: 12px 12px 12px 12px; */

	height: 16px;
	padding: 4px;
}

input.pagedisplay, select.pagesize
{
	position: relative;
	top: -8px;
	font-size: 12px;
}

bw-span.onOffText, bw-span.groupOptOutText
{
	position: relative;
	top: -10px;
	left: 2px;
}

/*Align miscText the same as the other table (it was moved by img)*/
bw-span.miscText, font.miscColonText, bw-span.miscCurrentText
{
	position:relative;
	top:12px;
}

bw-span.miscTitleWithEnable
{
	/* top:-10px; */
	left:0px;
}

font.miscColonTextWithEnable, bw-span.miscCurrentTextWithEnable
{
	/* top:-10px; */
	left:0px;
}

table.groupOptOutTable
{
	display: none;
	margin: 20px 0 20px 0;
}

table.onOffTable, table.miscTable
{
	margin: 0 0 20px 0;
	font-size:14px;
}

th.groupOptOutHeader, th.settingHeader
{
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 18px;
	font-weight: bold;
}

div.leftDiv, div.rightDiv
{
	position:absolute;
	width:300px;
}

div.rightDiv
{
	left:320px;
}

div.leftDiv
{
	left:0px;
}

img.onOffImg, img.miscOnOffImg
{
	cursor:pointer;
	width:32px;
	margin-top: 5px;
}

div.clickToChangeDiv
{
	display: none;
	position:absolute;
	z-index:21;
}

table.usersConsoleTable
{
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border-style: inset inset inset inset;
	border-color: #AAAAAA #AAAAAA #AAAAAA #AAAAAA;
	background-color: transparent;
	margin: 0 0 0 0;
	box-shadow: 2px 8px 16px 1px rgba(156,156,156,.4);
	height: 100%;
}

img.groupConsoleHeaderIcon
{
	position:relative;
	right:5px;
	float:right;
	width:32px;
}

img.groupConsoleHeaderIcon:hover
{
	cursor:pointer;
	background: #F4F4F4;
}

table.settingsTable1
{
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-weight:lighter;
	font-size: .9em;
	border-spacing:0;
	background-color: transparent;
	width: 45%;
	float:left;
	text-align:left;
	margin-right:5%;
	line-height: 1;
	border-collapse: separate;
	border-spacing: 0 2em;
}

table.settingsTable2
{
	table-layout: fixed;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-weight:lighter;
	font-size: .9em;
	border-spacing:0;
	background-color: transparent;
	width: 45%;
	padding-left:5%;
	text-align:left;
	line-height: 1;
	border-left:#c2cacf 1px solid;
	border-collapse: separate;
	border-spacing: 0 2em;
}

table.settingsTable td
{
	padding: 1% 0px 1% 0px;
	text-align: left;
}

table.settingsTable th
{
	font-weight: bold;
	text-align: left;
}

select.settingsSelect
{
	width: 85%;
	font-size: .9em;
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-weight: 'lighter';
	color: #6e6e6e;
	cursor: pointer;
	float: right;
}

div.loadmessage
{
	display: none;
	position: fixed;
	z-index: 3;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
	font-weight: bold;
	color: #000000;
	text-align: center;
	line-height: 50px;
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 1em;
}

#hiddenWindow2
{
	top: 00px;
	color:#000000;
	display: none;
	overflow-y:auto;
	display: hidden;
}

table.hiddenTable
{
	font-family: 'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size: 1em;
	text-align:center;
	width:100%;
	color: #000000;
	border-width: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border-style: inset inset inset inset;
	border-collapse:collapse;
	table-layout: fixed;
}

.colorThresholdCircle
{
	height: 1em;
	width: 1em;
	display: inline-block;
	border-radius: 56%;
	margin-right: 5%;
	vertical-align: middle;
}

.colorThresholdCircle1
{
	background: #bdd446;
}

.colorThresholdCircle2
{
	background: #fcef51;
}

.colorThresholdCircle3
{
	background: #f8c053;
}

.colorThresholdCircle4
{
	background: #ed7d3b;
}

.colorThresholdCircle5
{
	background: #cf353f;
}

/* All Wall displays circle charts */
.single-chart 
{
  justify-content: space-around;
}

.circular-chart 
{
	display: inline-table;
	max-width: 35%;
	margin: 3%;
	float: right;
}


.circle-bg 
{
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle 
{
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress 
{
  0% {
	stroke-dasharray: 0 100;
  }
}

.ringChartTitle 
{
	fill: #a3a3a3;
	font-family: sans-serif;
	font-size: .34em;
	font-weight: 100;
	text-anchor: middle;
}


.percentage 
{
	fill: #777;
	font-family: sans-serif;
	font-size: 1.2em;
	text-anchor: middle;
}


.hiddenTable td
{
	text-align: center;
	line-height: 2.8;
	font-size: .8em;
	font-weight:100;

}

.dndTable td:hover
{
	background: #f3f3f3;
	font-weight: 400;
}

.dndTable td
{
	text-align: center;
	line-height: 2;
	font-size: 12px;
	text-align: left;
	padding-left: 9%;

}

div.AAassign, div.networkAssign
{
	position: relative;
	width: 26%;
	float: right;
	margin-bottom: 2%;
	display: inline;
	text-align: left;
	padding: 0;
	border: 1px solid #e8e8e8;
	background: #fbfbfb;
	box-shadow: 0 0 20px 0 #d6d6d6;
	padding-bottom: 1%;
}

div.applyExitDiv
{
	position: absolute;
	display: initial;
	left: 50%;
	margin: 2%;
	width:10%;
}

div.externalAssign, div.meetMeAssign, div.toggleToInt
{
	left: 0px;
	position: relative;
	width : 300px;
	padding: 7px;
}

div.meetMeAssign
{
	top: 50px;
}

div.toggleToInt
{
	top: 100px;
}

div.applyExitExternalDiv
{
	top: 150px;
	position: relative;
}

font.assignHeading
{
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size:12pt;
	font-weight:bold;
	color:#666666;
	display:block;
}

span.toggleSpan
{
	font-family:'Open Sans','Lato','Helvetica Neue',Helvetica,Arial,sans-serif;
	font-size:12pt;
	font-weight:bold;
}

td.groupConsoleElementTD
{
	padding: 0px;
	vertical-align:middle;
	font-size:14px;
}

.ui-multiselect { border: solid 0px; font-size: 0.8em; }
.ui-multiselect ul { -moz-user-select: none; }
.ui-multiselect li { margin: 0; padding: 0; cursor: default; line-height: 20px; font-size: 14px; list-style: none; text-align: left; cursor: -webkit-grab; }
.ui-multiselect li a { color: #999; text-decoration: none; padding: 0; display: block; float: left; }
.ui-multiselect li.ui-draggable-dragging { cursor: -webkit-grabbing;padding: 1% 1%;; margin:0;height:auto;}

.ui-multiselect div.selected
{
	position: relative;
	padding: 0;
	margin: 0;
	float: right;
	width: 49%;
	border: 1px solid #e8e8e8;
	background: #fbfbfb;
	box-shadow: 0 0 20px 0 #d6d6d6;
}

.ui-multiselect ul.selected
{
	padding: 0;
	display: hidden;
	background: #fbfbfb;
	margin: 0;
	list-style: none;
	border: 0;
	position: relative;
	width: 100%;
	height: 57vh !important;
	overflow:auto;
}

.ui-multiselect div.available
{
	position: relative;
	padding: 0;
	margin: 0; border: 0;
	width: 49%;
	float: left;
	border: 1px solid #e8e8e8;
	background: #fbfbfb;
	box-shadow: 0 0 20px 0 #d6d6d6;
}

.ui-multiselect ul.available
{
	position: relative;
	padding: 0;
	overflow: auto;
	display: hidden;
	background: #fbfbfb;
	margin: 0;
	list-style: none;
	border: 0;
	width: 100%;
	height: 57vh !important;
}

.ui-multiselect ul.available li {}

.ui-multiselect .ui-state-default { border: 1px solid #e8e8e8; margin-bottom: 1%; margin: 1%; position: relative; padding: 3% 5%;font-weight:500;}
.ui-multiselect .ui-state-hover { border: 1px solid #e8e8e8; background: #ebebeb; }
.ui-multiselect .ui-widget-header {border: none; font-size: 11px; margin-bottom: 1px;text-align:left;}

.ui-multiselect .add-all { float: left;font-weight:100; margin-top: 3%;margin-left: 1%;margin-bottom: 1%;}
.ui-multiselect .remove-all { float: left;font-weight:100; margin-top: 3%;margin-left: 1%;margin-bottom: 1%;}
.ui-multiselect .search { padding: 4px;}
.ui-multiselect .count { float: left;padding: 5px;font-size: 12pt;font-weight: 100;}

.ui-multiselect li span.ui-icon-arrowthick-2-n-s { position: absolute; left: 2px; }
.ui-multiselect li a.action { float: right; }

.ui-multiselect input.search {  width: 50%; padding: 1%; border-radius: 0;border: 1px #e0e0e0 solid; font-size: 10pt;font-weight: 100;}

.multiselect
{
	width: 460px;
	height: 415px;
}

/*
end of commonAssign
*/

img.toggelColIcon
{
	cursor: pointer;
	position: relative;
	top: 2px;
	width: 16px;
	height: 16px;
	margin: 0 2px 0 2px;
}

.badgeGreen, .badgeRed
{
	position: relative;
	display: none;
}

.badgeGreen::after
{
	position: absolute;
	top: 5px;
	right: -5px;
	font-size: .7em;
	background: green;
	color: white;
	width: 22px;
	height: 22px;
	text-align: center;
	line-height: 22px;
	border-radius: 50%;
	font-weight: bold;
}

.badgeRed::after
{
	position: absolute;
	top: 5px;
	right: -5px;
	font-size: .7em;
	background: red;
	color: white;
	width: 22px;
	height: 22px;
	text-align: center;
	line-height: 22px;
	border-radius: 50%;
	font-weight:400;
}

.numberCircle 
{
	font: 12px Arial, sans-serif;
	width: 2em;
	height: 2em;
	box-sizing: initial;
	color: #FFFFFF;
	text-align: center;
	border-radius: 50%;    
	background:red;
	line-height: 2em;
	box-sizing: content-box;
	/* padding: 0.3em; */
	font-weight: bold;
}

@keyframes blinkWhiteBlack
{
	from { color: white; }
	to { color: black; }
}

@-webkit-keyframes blinkWhiteBlack
{
	from { color: white; }
	to { color: black; }
}

.blinkWhiteBlack
{
	-webkit-animation: blinkWhiteBlack 0.5s linear infinite;
	-moz-animation: blinkWhiteBlack 0.5s linear infinite;
	animation: blinkWhiteBlack 0.5s linear infinite;
}

div.uploadFileDiv
{
	position: absolute;
	left: 300px;
	top: 100px;
	padding: 3px;
	display: none;
}

div.uploadFileProgressBar
{
	border-radius: 9px;
	background-color: lightgreen;
}


#expandCollapseWebViewID
{
	width:25px;
	height:25px;
	display:none;
	float:right;
}

/*
responsive design section
*/
@media all and (max-width: 670px)
{
	img.editFullWallIcon, img.headerIcon
	{
		width: 32px;
		top: -5px;
		left: 1px;
	}

	div.fullWallHeader0Div, div.fullWallHeader3Div, div.fullWallHeader1Div
	{
		width: 64px;
	}

	img.fullWallLogout
	{
		width: 24px;
		top: -5px;
		left: 1px;
	}

	div.fullWallHeader2Div font, div.fullWallHeader1Div font
	{
		top: -13px;
	}

	div.fullWallTotalHeaderDiv
	{
		font-size: 9pt;
	}
}

@media all and (max-width: 330px)
{
	div.fullWallTotalHeaderDiv
	{
		font-size: 5pt;
	}
}

.dashboard_wrapper
{
	display: grid;
	grid-template-columns: 1fr 2fr 1fr;
	grid-auto-rows: auto;  /*If I want to make box 3 half height, make 4 1fr columns and edit box row ends*/
	column-gap: 1em;
	row-gap: 1em;
	grid-column-gap: 1em;
	grid-row-gap: 1em;
	width: 100vw;
	height: 100vh;
	text-align: left;
}

.dashboard_box1
{
	grid-column-start: 1;
	grid-column-end: 2;
	grid-row-start: 1;
	grid-row-end: 2;
}

.dashboard_box2
{
	grid-column-start: 1;
	grid-row-start: 2;
	grid-row-end: 3;
}

.dashboard_box3
{
	grid-column-start: 2;
	grid-column-end: 4;
	grid-row-start: 1;
	grid-row-end: 3;
}

.dashboard_box4
{
	grid-column-start: 1;
	grid-row-start: 3;
	grid-row-end: 3;
}

.dashboard_box5
{
	grid-column-start: 2;
	grid-row-start: 3;
	grid-row-end: 3;
}

.dashboard_box6
{
	grid-column-start: 3;
	grid-row-start: 3;
	grid-row-end: 3;
}


.dashboard_wrapper
{
	border: 0px solid #ccc;
	border-radius: 0px;
	background-color: #d6d6d6;
	padding: 1em;
}

.dashboard_wrapper > div
{
	border: 0px solid #fff;
	background-color: #fff;
	padding: .5em;
}

div.keypadDialDiv
{
	margin: 0px;
	height: 38px;
	width: 100%;
	display: none;
	grid-template-columns: 6fr 1fr;
}

img.wavController
{
	width:24px;
	outline: 0;
	margin: 0 1% 0 1%; 
	vertical-align: middle;
}

/*
	New Css For All Wall (trying to avoid any duplicate rules that already exist)
*/
.allWallBanner 
{
	background: linear-gradient(to right, #4898c1 0%, #05608a 35%);
	height: 7%;
	display: flex;
}

.bannerText 
{
	display: inline;
	vertical-align: middle;
	color: white;
	font-weight: 100;
	margin: auto 1%;
}

.allWallCardsContainer 
{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
	gap: .8rem;
	width: 98%;
	padding: 1%;
	height: 0;
}

.activeCallCard 
{
	background-color: white;
	box-shadow: 0px 0px 8px 0 rgb(0 0 0 / 20%);
	margin: 0.5% !important;
	color: #aaa;
	table-layout: fixed;
	transition: transform 0.3s;
	cursor: pointer;
	border-collapse: collapse;
	width: 100%;
}

.activeCallCard:hover 
{
	-ms-transform: scale(1.02); /* IE 9 */
	-webkit-transform: scale(1.02); /* Safari 3-8 */
	transform: scale(1.02);
	box-shadow: 0px 0px 16px 0 rgb(0 0 0 / 20%);
}

.cellHeaders 
{
	display: table-cell;
	text-align: center;
	padding: 0 5%;
	font-size: 0.75em;
	padding-top: 2%;
	white-space:pre-wrap;
}

.largeNumbers
{
	text-align: center;
	font-size: 2.2em;
	color: #999;
	font-weight:300;
}

.allWallExtnName 
{
	font-size: 1.3em;
	font-weight: 400;
	padding-left: 2%;
	padding-top:2%;
	text-align:left;
	position:inherit;
	font-weight:400;
}

.agentsAvailable 
{
	padding-bottom: 1%;
	font-size: 0.8em;
	padding-left: 2%;
	text-align:left;
	position:inherit;
	font-weight:400;
	background: none;
}

.longestCallsCells 
{
	text-align: center;
	font-size: 0.75em;
	padding-top: 3%;
	font-weight: 600;
}

.allWallBtn 
{
	background-color: #3698c9;
	border: none;
	color: white;
	padding: 15px 32px;
	text-align: center;
	text-decoration: none;
	font-size: 16px;
	margin: 4px 2px;
	cursor: pointer;
	position: absolute;
	right: 2%;
	bottom: 2%;
}

select-wrapper 
{
	margin: auto;
	max-width: 600px;
	width: calc(100% - 40px);
}

.select-pure__select 
{
	align-items: center;
	background: #f9f9f8;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
	box-sizing: border-box;
	color: #363b3e;
	cursor: pointer;
	display: flex;
	font-size: 16px;
	font-weight: 500;
	justify-content: left;
	min-height: 44px;
	padding: 5px 10px;
	position: relative;
	transition: 0.2s;
	width: 100%;
	max-width:520px;
}

.select-pure__options 
{
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, 0.15);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
	box-sizing: border-box;
	color: #363b3e;
	display: none;
	left: 0;
	max-height: 221px;
	overflow-y: scroll;
	position: absolute;
	top: 50px;
	width: 100%;
	z-index: 5;
}

.select-pure__select--opened .select-pure__options 
{
	display: block;
}

.select-pure__option 
{
	background: #fff;
	border-bottom: 1px solid #e4e4e4;
	box-sizing: border-box;
	height: 44px;
	line-height: 25px;
	padding: 10px;
}

.select-pure__option--selected 
{
	color: #e4e4e4;
	cursor: initial;
	pointer-events: none;
}

.select-pure__option--hidden 
{
	display: none;
}

.select-pure__selected-label 
{
	/* background: #5e6264; */

	background: #2d7ca1;

	border-radius: 4px;
	color: #fff;
	cursor: initial;
	display: inline-block;
	margin: 5px 10px 5px 0;
	padding: 3px 7px;
}

.select-pure__selected-label:last-of-type
{
	margin-right: 0;
}

.select-pure__selected-label i
{
	cursor: pointer;
	display: inline-block;
	margin-left: 7px;
}

.select-pure__selected-label i:hover
{
	color: #e4e4e4;
}

.select-pure__autocomplete
{
	background: #f9f9f8;
	border-bottom: 1px solid #e4e4e4;
	border-left: none;
	border-right: none;
	border-top: none;
	box-sizing: border-box;
	font-size: 16px;
	outline: none;
	padding: 10px;
	width: 100%;
}

.select-pure__placeholder
{
	padding-left: 1em;
}

/* Responsive font sizes for different screen sizes */
html .activeCallCard 
{
	font-size: 62.5%;
}

@media (max-width: 300px) 
{
html .activeCallCard
	{
		font-size: 70%;
	}
}

@media (min-width: 500px) 
{
	html .activeCallCard
	{
		font-size: 80%;
	}
}

@media (min-width: 700px) 
{
	html .activeCallCard
	{
	
		font-size: 100%;
	}
}

