/* **************************************************************************
 *
 * Font
 *
 * **************************************************************************/

/* Removed Dependency from external resources due to some customers internet policy */
/* @import url(http://fonts.googleapis.com/css?family=Roboto:700,600,500,400,300,400italic,300italic); */

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 300;
	src: url(css-fonts/Roboto-Light.ttf) format('truetype');
}

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	src: url(css-fonts/Roboto-Regular.ttf) format('truetype');
}

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 500;
	src: url(css-fonts/Roboto-Medium.ttf) format('truetype');
}

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 700;
	src: url(css-fonts/Roboto-Bold.ttf) format('truetype');
}

@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 300;
	src: url(css-fonts/Roboto-LightItalic.ttf) format('truetype');
}

@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 400;
	src: url(css-fonts/Roboto-Italic.ttf) format('truetype');
}

/* **************************************************************************
 *
 * General css styles used in all pages.
 *
 * **************************************************************************/

html, body {
	height: 100%;
	width: 100%;
	padding: 0px;
	margin: 0px;
	border: 0px;
}

body {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 0.75em;
}

form {
	display: inline;
	padding: 0px;
	margin: 0px;
}

fieldset {
	padding: 0px;
	margin: 0px;
}

a {
	text-decoration: none;
	color: #F17735;
	outline: 0;
}

a:hover {
	text-decoration: underline;
	color: #D35410;
}

a img {
	border: none;
	outline: 0;
}

.iceCmdLnk, .cmdLnk {
	color: #F17735;
	white-space: nowrap;
	outline: 0;
}

.cmdLnk:hover {
	text-decoration: underline;
	color: #D35410;
}

.iceCmdLnk-dis, .cmdLnk-dis {
	color: #AAAAAA !important;
	white-space: nowrap;
	outline: 0;
}

p {
	padding: 0;
	margin: 0;
	border: 0;
}


/* **************************************************************************
 *
 * Standard Texts
 *
 * **************************************************************************/

.caption {
	overflow: visible;
	white-space: nowrap;
}

.boldError, .iceMsgError {
	color: #D86344;
	font-weight: bold;
	white-space: nowrap;
}

.errorMsg {
	color: red !important;
	font-weight: bold;
	white-space:nowrap;
}

.textsWithoutBreaks, .linksWithoutBreaks, .linksWithoutBreaks-dis {
	white-space: nowrap;
}

.textsWithBreaks {
	white-space: normal;
}

.wordWrap {
	white-space: normal !important;
}

.instructions_bigger {
	display: block;
	font-size: 1.25em;
	margin-bottom: 8px;
	color: #0A386C;
}

.headline, .statisticsReportsExecTitle {
	display: inline-block;
	font-size: 1.5em;
	margin-top: 8px;
	margin-bottom: 4px;
	color: #0A386C;
	font-weight: 400;
}

.headlineSmall {
	display: inline-block;
	font-size: 1.3em;
	margin-top: 8px;
	margin-bottom: 4px;
	color: #0A386C;
	font-weight: 400;
}

.helptxt {
	padding-left: 2px;
	color: #666666;
	font-size: 0.9em;
	display: block;
	margin-bottom: 6px;
	white-space: normal;
}

.warningOutputTxt {
	padding-left: 2px;
	color: #ff3000;
	font-size: 0.9em;
	font-weight: bold;
	display: block;
	margin-bottom: 6px;
	white-space: normal;
}

.helptxtInline {
	padding-left: 2px;
	font-size: 1.0em;
	display: inline-block;
	white-space: nowrap;
	position: relative;
	top: 3px;
}

.iceMsgError {
	color: red;
	font-weight: bold;
}

.errorText {
	font-weight: bold;
	color: #CC0000;
}

.warningText {
	font-weight: bold;
	color: #FF6600;
}

.okText {
	font-weight: bold;
	color: #009900;
}

.bold {
	font-weight: bold;
}

.notBold {
	font-weight: normal !important;
}

.inlineLink {
	display: inline-block;
	margin-top: 4px;
	margin-bottom: 5px;
}


/* **************************************************************************
 *
 * Buttons
 *
 * **************************************************************************/

.btn, .iceCmdBtn {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #F17735;
	color: white;
	height: 2em;
	border-radius: 9px;
	margin-right: 4px;
}

.cmdSvgBtn {
	padding: 0.3em;
	height: 1.2em;
	border-radius: 5px;
	margin-right: 0px;
}

.statisticsReportsExecButton {
	display: inline-block;
	margin-top: 4px;
	text-align: center;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #F17735;
	color: white;
	border-radius: 9px;
	padding-left: 6px;
	padding-right: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
}

.triStateCheckbox:before {
	content: '\00A0';
	display: inline-block;
	height: 25px;
	width: 1px;
}

.triStateCheckbox .iceCmdBtn {
	height: auto;
	border-radius: 0px;
	position: relative;
	top: 7px;
}

.btn:hover, .iceCmdBtn:hover, .statisticsReportsExecButton:hover {
	background-color: #D35410;
	color: white;
	text-decoration: none;
	cursor: hand;
}

.btn-dis, .iceCmdBtn-dis {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #AAAAAA;
	color: #DDDDDD;
	height: 2em;
	border-radius: 9px;
	margin-right: 4px;
}

.forceStatusReachableButton {
	position: relative;
	top: 5px;
	left: 5px;
	background-color: #D6D6D6;
	border-radius: 7px;
}

.iceOutRsr {
	display: inline-block;
	text-align: center;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	color: white;
	background-color: #F17735;
	border-radius: 9px;
	padding-left: 6px;
	padding-right: 6px;
	padding-top: 4px;
	padding-bottom: 4px;
	margin-right: 2px;
}

.iceOutRsr a {
	color: white;
	padding: 2px;
}

.iceOutRsr:hover {
	background-color: #D35410;
	color: white;
	text-decoration: none;
	cursor: hand;
}

.iceOutRsr a:hover {
	color: white;
	text-decoration: none;
}

/* **************************************************************************
 *
 * File Input
 *
 * **************************************************************************/

.fileinputs {
	display: inline-block;
	overflow: hidden;
	position: relative;
	top: 3px;
}

.fileinputs [type=file] {
	cursor: inherit;
	display: block;
	font-size: 999px;
	filter: alpha(opacity = 0);
	min-height: 100%;
	min-width: 100%;
	opacity: 0;
	position: absolute;
	right: 0;
	text-align: right;
	top: 0;
}

.fileInputTextStatusMoveDown {
	padding-top: 4px;
}

.ice-file-entry {
	width: 20.5em;
}

.ice-file-entry > div.complete, .ice-file-entry > div.uploading, .ice-file-entry > div.progress, .ice-file-entry > div.inactive {
	display: inline-block !important;
	width: 22.4em !important;
}

.ice-file-entry > div.complete > div, .ice-file-entry > div.uploading > div, .ice-file-entry > div.progress > div, .ice-file-entry > div.inactive > div {
	display: inline-block !important;
	width: 22.4em !important;
	border: none !important;
	height: 24px;
}

.ice-file-entry > div.complete > div > div, .ice-file-entry > div.uploading > div > div, .ice-file-entry > div.progress > div > div, .ice-file-entry > div.inactive > div > div {
	border-radius: 10px !important;
	background: none !important;
	font-weight: normal;
	font-size: 1.1em;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: 300 !important;
	text-align: center;
}

.ice-file-entry > div.complete > div > div {
	background-color: #69C9AC !important;
	color: black !important;
	opacity: 1.0 !important;
}

.ice-file-entry > div.progress > div > div {
	background-color: #999999 !important;
	color: #666 !important;
}

.ice-file-entry > div.uploading > div > div {
	background-color: #F17735 !important;
	color: #666 !important;
}

.ice-file-entry > div.inactive > div > div {
	background-color: #F17735 !important;
	color: white !important;
}

/* **************************************************************************
 *
 * IceFaces selectInputDate
 *
 * **************************************************************************/

.iceSelInpDate {
	background-color: #FFFFFF;
	border-top: 1px solid #d9d9d9;
	border-left: 1px solid #d9d9d9;
}

table.iceSelInpDate tbody tr td table {
	border-right: 1px solid #d9d9d9;
}

.iceSelInpDateIFrameFix, .iceIEIFrameFix {
	z-index: -1;
	position: absolute;
	display: block;
	filter: mask();
}

.iceIEIFrameFix {
	height: 0;
}

.iceSelInpDatePopup {
	min-width: 172px;
}

.iceSelInpDateInput {
	width: 9.5em;
	border: white;
	border-radius: 4px;
	padding: 4px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	margin-bottom: 2px;
	margin-right: 3px;
}

.iceSelInpDateOpenPopup {
	display: inline;
	text-decoration: none;
	background-color: transparent;
	background-image: url("css-images/calendar_clock.svg");
	background-size: 18px 18px;
	background-repeat: no-repeat;
	text-align: center;
	border: none;
	width: 18px;
	height: 18px;
	margin-left: 5px;
}

.iceSelInpDateClosePopup {
	display: inline;
	text-decoration: none;
	background-color: transparent;
	background-image: url("css-images/cal_off.gif");
	background-size: 18px 18px;
	background-repeat: no-repeat;
	text-align: center;
	border: none;
	width: 18px;
	height: 18px;
	margin-left: 5px;
}

.iceSelInpDateMonthYear, .iceSelInpDateTime {
	background: #F5F5F5;
	font-weight: bold;
	text-align: center;
	color: #666;
	padding-left: 1px;
	padding-right: 1px;
	padding-top: 4px;
	padding-bottom: 4px;
}

.iceSelInpDateTime{
	border-left: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
}

/* Align time selector to center if seconds not displayed */
td.iceSelInpDateTime table {
	margin: auto;
}

.iceSelInpDateMoYrDropdown, .iceSelInpDateTimeDropDown {
	background: #F5F5F5;
	font-weight: bold;
	color: #666;
}

.iceSelInpDateMonthYear img {
	border: none;
	margin-left: 3px;
	padding: 3px;
}

.iceSelInpDateMovePrev {
	text-decoration: none;
	display: inline;
	background-color: transparent;
	background-image: url("css-images/cal_arrow_left.gif");
	background-repeat: no-repeat;
	text-align: center;
	border: none;
	width: 17px;
	height: 16px;
}

.iceSelInpDateMoveNext {
	text-decoration: none;
	display: inline;
	background-color: transparent;
	background-image: url("css-images/cal_arrow_right.gif");
	background-repeat: no-repeat;
	text-align: center;
	border: none;
	width: 17px;
	height: 16px;
}

.iceSelInpDateWeek {
	/* the days of the week row */
	font-weight: normal;
	color: #666;
	text-align: center;
	padding: 3px;
	border-top: 1px solid #d9d9d9;
	border-right: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	/*width: 22px;*/
}

/* set the look for the days of the week backgrounds */

.iceSelInpDateDay {
	text-align: center;
	border-right: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
	padding: 3px;
}

.iceSelInpDateCur {
	background: #faa620;
	text-align: center;
	border-right: 1px solid #d9d9d9;
	border-bottom: 1px solid #d9d9d9;
}

.iceSelInpDateCur .iceCmdLnk {
	background: none;
	border: none;
}

.iceSelInpDateCur .iceOutTxt {
	color: #FFFFFF;
}

.weekend {
	background: #e9e9e9;
}

.weekend .iceOutTxt {
	color: #666;
}

.weekend .iceCmdLnk {
	background: none;
	border: none;
}

/* now set the attributes for the numbers for each day of the week */
.iceSelInpDateDay a {
	/* the day text */
	text-decoration: none;
	background-color: #FFFFFF;
	/*border: 1px solid #FFFFFF;*/
	color: #000000;
	width: 100%;
	height: 100%;
	padding: 0px;
	display: block;
}

.iceSelInpDateCur a {
	text-decoration: none;
	background-color: #2A6CC2;
	border: 1px solid #2A6CC2;
	color: #FFFFFF;
	width: 100%;
	height: 100%;
	padding: 0px;
	display: block;
}

/* now set the color attributes for the hover effect on non-current days */
.iceSelInpDateDay a:hover {
	/* the day text */
	text-decoration: none;
	color: #666;
}

.exampleBoxCol1 {
	padding: 7px;
}

/* **************************************************************************
 *
 * Checkbox
 *
 * **************************************************************************/

.inlineCheckBox {
	position: relative;
	top: 3px;
}

/* **************************************************************************
 *
 * Menu
 *
 * **************************************************************************/

/* It's the menu block - reset stylesheet elements */
#cssmenu {
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	line-height: 1;
	text-align: left;
}

/* MENU TRIGGER BUTTON */
#cssmenu > nav {
	max-width: 34px;
	max-height: 34px;
	padding-left: 20px;
	padding-right: 20px;
}

#cssmenu > nav > a {
	background: rgba(255, 255, 255, 0.2);
	border: none;
	border-radius: 4px;
	width: 34px;
	height: 34px;
	text-indent: -900em;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	outline: none;
	display: block;
}

/* this is part of the menu trigger button: three lines inside */
#cssmenu > nav > a:after {
	content: '';
	position: absolute;
	width: 68%;
	height: 3px;
	background: rgba(255, 255, 255, 0.6);
	top: 8px;
	left: 16%;
	box-shadow: 0 7px 0 rgba( 255, 255, 255, 0.6 ), 0 14px 0 rgba( 255, 255, 255, 0.6 );
}

/* menu trigger button hover effect */
#cssmenu > nav:hover > a {
	background: rgba(255, 255, 255, 0.4);
}

/* menu trigger button hover effect */
#cssmenu > nav:hover > a:after {
	background: rgba(255, 255, 255, 0.8);
	box-shadow: 0 7px 0 rgba( 255, 255, 255, 0.8 ), 0 14px 0 rgba( 255, 255, 255, 0.8 );
}

/* THE MAIN MENU */
#cssmenu > nav > ul {
	z-index: 2;
	list-style: none;
	margin: 0;
	padding: 5px 0 0 0;
	vertical-align: baseline;
	line-height: 1;

	display: block;
	position: relative;
	top: -9999px;
	left: -20px;
	opacity: 0;
	width: 200px;

	/* The fade effect, created using an opacity transition */
	-webkit-transition: opacity 0.2s ease-in;
	-moz-transition: opacity 0.2s ease-in;
	transition: opacity 0.2s ease-in;
}

/* Showing the menu when the user is hovering the menu trigger */
#cssmenu > nav:hover > ul {
	top: 0px;
	opacity: 1;
}

/* The list elements which contain the links */
#cssmenu > nav > ul li {
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
}

/* General link styling */
#cssmenu > nav > ul li a {
	/* Layout */
	display: block;
	position: relative;
	margin: 0;
	border-top: 1px dotted #3a3a3a;
	border-bottom: 1px dotted #1b1b1b;
	padding: 7px 20px;

	/* Typography */
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	color: #d8d8d8;
	text-decoration: none;
	/*text-transform: uppercase;*/
	/*text-shadow: 0 1px 1px #000;*/
	font-size: 0.5em;
	font-weight: 300;

	/* Background & effects */
	background: #282828;
}

/* Rounded corners for the first link of the menu/submenus */
#cssmenu > nav > ul li:first-child > a {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-top: 0;
}

/* Rounded corners for the last link of the menu/submenus */
#cssmenu > nav > ul li:last-child > a {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: 0;
}

/* The hover state of the menu/submenu links */
#cssmenu > nav > ul li > a:hover,
#cssmenu > nav > ul li:hover > a {
	color: #ffffff;
	/* text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); */
	background: #54cdf1;
	background: -webkit-linear-gradient(#F5894F, #F17735);
	background: -moz-linear-gradient(#F5894F, #F17735);
	background: linear-gradient(#F5894F, #F17735);
	border-color: transparent;
}

/* The arrow indicating a submenu */
#cssmenu > nav > ul .has-sub > a::after {
	content: "";
	position: absolute;
	top: 10px;
	right: 10px;
	width: 0px;
	height: 0px;

	/* Creating the arrow using borders */
	border: 4px solid transparent;
	border-left: 4px solid #d8d8d8;
}

/* The same arrow, but with a darker color, to create the shadow effect */
#cssmenu > nav > ul .has-sub > a::before {
	content: "";
	position: absolute;
	top: 11px;
	right: 10px;
	width: 0px;
	height: 0px;

	/* Creating the arrow using borders */
	border: 4px solid transparent;
	border-left: 4px solid #000;
}

/* Changing the color of the arrow on hover */
#cssmenu > nav > ul li > a:hover::after,
#cssmenu > nav > ul li:hover > a::after {
	border-left: 4px solid #ffffff;
}

#cssmenu > nav > ul li > a:hover::before,
#cssmenu > nav > ul li:hover > a::before {
	border-left: 4px solid rgba(0, 0, 0, 0.3);
}

/* THE SUBMENUS */
#cssmenu > nav > ul ul {
	position: absolute;
	left: 100%;
	top: -9999px;
	padding-left: 0px;
	opacity: 0;
	width: 200px;

	/* The fade effect, created using an opacity transition */
	-webkit-transition: opacity 0.2s ease-in;
	-moz-transition: opacity 0.2s ease-in;
	transition: opacity 0.2s ease-in;
}

/* Reposition submenu item to make a small border appear */
#cssmenu > nav > ul ul li a {
	position: relative;
	left: 1px;
}

/* Showing the submenu when the user is hovering the parent link */
#cssmenu > nav > ul li:hover > ul {
	top: 0px;
	opacity: 1;
}

/* Help make sub-menu not disappear when mouse over bottom (main and submenu) */
#cssmenu > nav ul > li:last-child:after {
	content: '';
	display: block;
	height: 200px;
	width: 100%;
}

/* Help make sub-menu not disappear when mouse over top of submenu */
#cssmenu > nav > ul > li > ul > li:first-child:before {
	content: '';
	display: block;
	position: relative;
	top: -500px;
	height: 500px;
	width: 100%;
}

#cssmenu > nav > ul > li > ul > li {
	position: relative;
	top: -500px;
}

/* **************************************************************************
 *
 * Input
 *
 * **************************************************************************/

.iceInpTxt, .iceInpSecrt, .iceInpTxtArea, .iceSelInpTxt, .iceSelInpTxt input {
	border: white;
	border-radius: 4px;
	padding: 4px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	margin-bottom: 2px;
	margin-right: 3px;
}

.iceInpTxt-dis, .iceInpSecrt-dis, .iceInpTxtArea-dis, .iceSelInpTxt-dis input {
	border: #D6D6D6;
	background-color: #D6D6D6;
	border-radius: 4px;
	padding: 4px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	color: #666;
	margin-bottom: 2px;
	margin-right: 3px;
}

.iceSelBoolChkbx {
	vertical-align: bottom;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	margin-right: 3px;
}

.iceSelBoolChkbx-dis {
	vertical-align: bottom;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	margin-right: 3px;
}

.iceSelOneMnu {
	border: white;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	padding: 4px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	margin-bottom: 2px;
	margin-right: 3px;
}

.iceSelOneMnu-dis {
	background-color: #D6D6D6;
	border: 1px solid #D6D6D6;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	padding: 4px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	margin-bottom: 2px;
	margin-right: 3px;
}

.iceSelMnyLb {
	border: none;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
}

input[type=radio]+label {
	position: relative;
	top: -2px;
}

/* **************************************************************************
 *
 * Text areas
 *
 * **************************************************************************/

.iceInpTxtArea {
}

.iceInpTxtArea-Comment {
	width: 50.1em;
	height: 5em;
	resize: none;
}

.iceInpTxtArea-SendSMS {
	width: 20em;
	height: 10em;
	resize: none;
}

.iceInpTxtArea-NotesAgentHome, .iceInpTxtArea-NotesAgentHome-dis {
	width: calc( 100% - 10px );
	height: 7.3em;
	resize: none;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	margin-bottom: 0px;
}

.iceInpTxtArea-NotesAgentHome {
	background-color: #FFFFFF;
}

.iceInpTxtArea-NotesAgentHome-dis {
	background-color: #FCFCFC;
}

.iceInpTxtArea-NotesTACPopup {
	width: calc( 100% - 10px );
	height: 6.7em;
	background-color: #FFFFFF;
	resize: none;
}

.iceInpTxtArea-CallbackMessage {
	width: 32em;
	height: 10em;
	resize: none;
}

.iceInpTxtArea-DiallerComment {
	width: 20em;
	height: 6em;
	resize: none;
}

.iceInpTxtArea-DiallerComment-dis {
	background-color: #E8E8E8;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #E8E8E8;
	cursor: default;
	width: 19.8em;
	height: 6em;
	resize: none;
}

.iceInpTxtArea-dis {
	background-color: #D6D6D6;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #D6D6D6;
	cursor: default;
}

.iceInpTxtArea-dis-Subject {
	background-color: #D6D6D6;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #D6D6D6;
	cursor: default;
	height: 3em;
	resize: none;
}

.iceInpTxtArea-dis-Message {
	background-color: #D6D6D6;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #D6D6D6;
	cursor: default;
	height: 16em;
	resize: none;
	overflow-y: auto;
}

.iceInpTxtArea-Configuration {
	background-color: #FFFFFF;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #D6D6D6;
	cursor: default;
	width: 50.01em;
	height: 30em;
}

.iceInpTxtArea-Stdout {
	background-color: #FFFFFF;
	font-size: 1.00em;
	color: #666;
	border: 1px solid #D6D6D6;
	cursor: default;
	width: 50.01em;
	height: 30em;
}

.monospace {
	font-family: monospace;
	font-size: 1.4em;
}

.monospace-dis {
	font-family: monospace;
	font-size: 1.4em;
}

/* **************************************************************************
 *
 * Ace Combo Box
 *
 * **************************************************************************/

.comboColorPicker {
	width: 16em;
	margin-top: 1px;
	margin-bottom: 1px;
}

.comboColorPicker span input {
	font-size: 1.2em !important;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: 400;
	background: white !important;
	border-radius: 4px !important;
}

.comboColorPicker span {
	border: white !important;
	border-radius: 4px !important;
}

.comboColorPicker span div {
	background-color: white !important;
	border-radius: 4px !important;
}

.aceComboBox {
	background-color: white !important;
	display: inline-block;
	border: white;
	border-radius: 4px;
	padding: 4px;
	margin-bottom: 2px;
	margin-right: 3px;
}

.aceComboBox select {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: normal;
	font-size: 1em;
	color: black;
	background: none;
	width: 100%;
	border: white;
}

/* **************************************************************************
 *
 * Tooltip
 *
 * **************************************************************************/

.toolTipHelpImage {
	float: left;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	background-color: #4777AC;
	position: relative;
	top: 2px;
}

.toolTipHelpImage img {
	position: relative;
	top: 2px;
	left: 2px;
}

.ice-ace-tooltip {
	border: none !important;
	box-shadow: none !important;
	border-radius: 10px !important;
	background: none !important;
	background-color: #FFF5D1 !important;
}

.ice-ace-tooltip div {
	border: none !important;
	padding: 6px !important;
	border-radius: 10px !important;
	background: none !important;
	background-color: #FFF5D1 !important;
}

.toolTipCallFlow {
	background-color: white !important;
}

.toolTipCallFlow div {
	background-color: white !important;
}

/* Improved ToolTip */

.acdGroupRuleCallflowImageContainer {
	width: 16px;
	height: 16px;
	overflow: visible;
}

.acdGroupRuleCallflowImageContainer:hover {
}

.acdGroupRuleCallflowImageContainer .acdGroupRuleCallflowImageThumb {
	width: 16px;
	border-radius: 10px;
	background-color: #4777AC;
}

.acdGroupRuleCallflowImageContainer .acdGroupRuleCallflowImageFull {
	display: none;
}

.acdGroupRuleCallflowImageContainer:hover .acdGroupRuleCallflowImageThumb {
	display: none;
}

.acdGroupRuleCallflowImageContainer:hover .acdGroupRuleCallflowImageFull {
	display: inline-block;
	position: relative;
	border-radius: 6px;
	z-index: 50;
}

/* **************************************************************************
 *
 * Dual List
 *
 * **************************************************************************/

.jtelDualListHeader {
	border-top-left-radius: 13px;
	border-top-right-radius: 13px;
	border: none;
	text-align: center;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1.2em;
	font-weight: 300;
	height: 1.5em;
	background-color: #858585;
	color: white;
	padding: 3px;
}

.jtelDualListSelectMany {
	border: none;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
}

.jtelDualListCommandButton {
	width: 24px;
	height: 24px;
	background-color: #AAAAAA;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	border-radius: 7px;
	border: none;
}

.jtelDualListCommandButton:hover {
	background-color: #F17735;
	cursor: hand;
}

.jtelDualListCommandButtonRight1 {
	background-image: url('css-images/navigate_right icon.svg');
	background-position: 3px 2px;
}

.jtelDualListCommandButtonRight2 {
	background-image: url('css-images/navigate_right2 icon.svg');
	background-position: 3px 2px;
}

.jtelDualListCommandButtonLeft1 {
	background-image: url('css-images/navigate_left icon.svg');
	background-position: 1px 2px;
}

.jtelDualListCommandButtonLeft2 {
	background-image: url('css-images/navigate_left2 icon.svg');
	background-position: 1px 2px;
}

.jtelDualListCommandButtonUp {
	background-image: url('css-images/navigate_open icon.svg');
	background-position: 2px 2px;
}

.jtelDualListCommandButtonDown {
	background-image: url('css-images/navigate_close icon.svg');
	background-position: 2px 2px;
}

/* **************************************************************************
 *
 * TabSheet - Buttons and other stuff
 *
 * **************************************************************************/

.icePnlTbSet {
	width: 100%;
}

.icePnlTb {
	padding-right: 2px;
	padding-top: 2px;
}

.icePnlTbOn, .icePnlTbOff, .icePnlTbOver, .AcdTabButtons {
	border: none;
	height: 2em;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	cursor: hand;
}

.icePnlTbOn, .AcdTabButtonsSelected {
	background-color: #F17735;
	color: white;
}

.icePnlTbOver {
	background-color: #D35410;
	color: white;
}

.icePnlTbOff, .AcdTabButtonsUnselected {
	background-color: #AAAAAA;
	color: white;
}

.icePnlTbLblLnk, .AcdTabButtonsSelectedText, .AcdTabButtonsUnselectedText {
	font-size: 1.2em;
	font-weight: 300;
	text-decoration: none;
	white-space: nowrap;
	color: white;
}

.icePnlTbLblLnk:hover, .AcdTabButtonsUnselectedText:hover {
	text-decoration: none;
	color: white;
}

.MidMid {
	padding-left: 8px;
	padding-right: 8px;
}

.AcdTabButtonsUnselected:hover {
	background-color: #D35410;
	color: white;
}

.AcdTabButtons {
	display: inline-block;
	padding-left: 8px;
	padding-right: 8px;
	margin-right: 2px;
	margin-top: 2px;
}

.AcdTabButtonsSelectedText, .AcdTabButtonsUnselectedText {
	position: relative;
	top: 2px;
}

.AcdTabPanel {
	display: inline-block;
}

.AcdTabPanelFullWidth {
	display: inline-block;
	width: 100%;
}

/* **************************************************************************
 *
 * Tables
 *
 * **************************************************************************/

table {
	padding: 0px;
	margin: 0px;
	border: none;
	border-collapse: collapse;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
}

table.fullWidthTable {
	width: 100%;
}

table.halfWidthTable {
	width: 50%;
}

/* **************************************************************************
 *
 * Data Table.
 *
 * **************************************************************************/

.iceDatTblHdr {
	background-color: #D6D6D6;
	border: 2px solid #F2F2F2;
	border-left: none;
	padding: 4px;
	padding-top: 6px;
}

th.iceDatTblColGrpHdrCol {
	padding: 4px;
	padding-top: 6px;
}

th.iceDatTblColGrpHdrCol div {
	position: relative;
	white-space: nowrap;
}

a.dataTableSelectColumns, a.dataTableShowRows {
	position: absolute;
	top: 2px;
	left: 0px;
	width: 24px;
	height: 24px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-size: 24px 24px;
}

a.dataTableSelectColumns {
	background-image: url('css-images/table_selection_column icon.svg');
}

a.dataTableShowRows {
	background-image: url('css-images/table_selection_row icon.svg');
}

a.dataTableSelectColumnsAgents {
	top: -2px;
}

th.iceDatTblColHdr1 div.icePnlGrp, th.iceDatTblColHdr2 div.icePnlGrp {
	position: relative;
}

th .iceOutTxt, .iceDatTbl td span.iceOutTxt, .iceDatTblFtr div span.iceOutTxt {
	overflow: hidden;
	display: block;
	padding: 2px 0px;
}

th .iceOutTxt, .iceDatTblFtr div span.iceOutTxt {
	font-weight: bold;
}

.iceDatTblColGrpHdrCol .iceOutTxt {
	font-weight: 400;
	font-size: 1.4em;
}

.iceDatTblFtr div .iceOutTxt {
	font-weight: bold;
}

.dataTableWorkBreakAggregation {
	padding: 0.5em;
}

.dataTableCommandContainer {
	display: inline-block;
	float: left;
}

.dataTableCommandButton {
	display: inline-block;
	float: left;
}

.dataTableCommandButtonMiddle {
	display: inline-block;
	float: left;
	vertical-align: middle;
}

.dataTableCounters {
	display: inline-block;
	background-color: #E8E8E8;
	border-radius: 7px;
	padding-left: 8px;
	padding-right: 8px;
	height: 24px;
}

.dataTableCounters > span {
	display: inline-block;
	font-weight: normal;
	position: relative;
	top: -2px;
	padding-left: 4px;
	padding-right: 4px;
	vertical-align: middle;
}

.dataTableCountersOnlyInfo > span {
	top: 0px;
}

.dataTableEmpty {
	padding-left: 7em;
	padding-right: 7em;
}

.dataTableFilter {
	display: inline-block;
	float: left;
}

.dataTableRowsPlusMinusContainer {
	display: inline-block;
	margin-left: 8px;
}

.dataTableRowsPlusMinusButtonLink {
	display: inline-block;
	position: relative;
	top: 4px;
	width: 16px;
	height: 16px;
	margin-left: 2px;
	background-color: #D6D6D6;
	border-radius: 8px;
}

.supervisorDynamicPriorityGroupsButtonLink {
	top: 2px;
}

.dataTableRowsPlusMinusButtonImage {
	width: 16px;
	height: 16px;
}

.supervisorDynamicPriorityGroupsButtonLinkHeader {
	background-color: #E5E5E5;
	border-radius: 8px;
	width: auto;
	white-space: nowrap;
	display: inline-block;
	position: relative;
	top: 4px;
	width: 16px;
	height: 16px;
	border-radius: 8px;
}

.dataTableNavigation {
	display: inline-block;
	float: right;
}

.dataTableCenteredColumn {
	text-align: center;
}

.dataPaginatorFilter {
	padding-left: 4px;
	font-weight: normal;
}

.dataPaginatorFilterText {
	color: #000000 !important;
	display: inline-block;
	position: relative;
	top: 1px;
	float: left;
	font-size: 1em !important;
	font-weight: normal;
	margin-right: 6px;
}

.dataPaginatorFilterInput {
	display: inline-block;
	float: left;
}

.dataPaginatorFilterClear {
	display: inline-block;
	float: left;
	border-radius: 0px !important;
	border-top-right-radius: 5px !important;
	border-bottom-right-radius: 5px !important;
	position: relative;
	left: -6px;
}

.dataPaginatorPaginator {
	display: inline-block;
	float: right;
}

.pagerButtonContainer {
	background-color: #AAAAAA;
	display: inline-block;
	height: 24px;
	width: 24px;
	border-radius: 7px;
}

.pagerButtonContainer:hover {
	background-color: #FFCF85;
}

.pagerButtonImage {
	height: 12px;
	width: 12px;
	position: relative;
	top: 4px;
}

.iceDatPgrScrCol {
	background-color: #E8E8E8;
	display: inline-block;
	height: 22px;
	width: 23px;
	border-radius: 7px;
	margin-left: 1px;
	margin-right: 1px;
}

.iceDatPgrScrCol a {
	position: relative;
	top: 2px;
	color: black;
	font-weight: normal;
	padding: 8px;
}

.iceDatPgrScrCol a:hover {
	text-decoration: none;
}

.iceDatPgrCol {
	background-color: #AAAAAA;
	display: inline-block;
	height: 22px;
	width: 23px;
	border-radius: 7px;
	margin-left: 1px;
	margin-right: 1px;
	text-align: center;
}

.iceDatPgrCol:hover {
	background-color: #FFCF85;
}

.iceDatPgrCol a {
	position: relative;
	top: 2px;
	color: black;
	font-weight: normal;
	padding: 8px;
}

.iceDatPgrCol a:hover {
	text-decoration: none;
}

.inlineCommandLink {
	display: inline-block;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #F17735;
	color: white;
	height: 2em;
	border-radius: 9px;
	margin-right: 0.5em;
	white-space: nowrap;
	position: relative;
	top: -4px;
}

.inlineCommandLink span {
	position: relative;
	top: 4px;
	padding-left: 8px;
	padding-right: 8px;
	font-weight: 300 !important;
}

.inlineCommandLink:hover {
	text-decoration: none;
	background-color: #D35410;
	color: white;
}

.dataTableCommandLink {
	display: inline-block;
	float: left;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #F17735;
	color: white;
	height: 2em;
	border-radius: 9px;
	margin-right: 4px;
	white-space: nowrap;
}

.dataTableCommandLink span {
	position: relative;
	top: 4px;
	padding-left: 8px;
	padding-right: 8px;
	font-weight: 300 !important;
}

.dataTableCommandLink:hover {
	text-decoration: none;
	background-color: #D35410;
	color: white;
}

.dataTableCommandBtnLink {
	display: inline-block;
	float: left;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 300;
	border: none;
	background-color: #F17735;
	color: white;
	height: 2em;
	border-radius: 9px;
	margin-right: 4px;
	white-space: nowrap;
}

.dataTableCommandBtnLink span {
	position: relative;
	top: 2px;
	padding-left: 8px;
	padding-right: 8px;
	font-weight: 300 !important;
}

.dataTableCommandBtnLink:hover {
	text-decoration: none;
	background-color: #D35410;
	color: white;
}

.iceDatTblColHdr, .iceDatTblColHdr1, .iceDatTblColHdr2, .iceDatTblColGrpHdrCol, .iceDatTblFtr {
	background: none;
	background-color: #D6D6D6;
	border: 2px solid #F2F2F2;
	border-left: none;
	color: #484848;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: 400;
	font-size: 1.1em;
	text-align: center;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 4px;
	padding-right: 4px;
	vertical-align: bottom;
	position: relative;
}

.iceDatTblCol, .iceDatTblCol1, .iceDatTblCol2 {
	border-bottom: 2px solid #F2F2F2;
	border-right: 2px solid #F2F2F2;
	padding: 2px;
}

.iceDatTbl {
	border: none;
	border-collapse: collapse;
	margin: 0;
}

.iceDatTblRow1 {
	background-color: #E8E8E8;
	color: #000000;
	border-left: 2px solid #F2F2F2;
}

.iceDatTblRow2 {
	background-color: #F0F0F0;
	color: #000000;
	border-left: 2px solid #F2F2F2;
}

.iceCmdSrtHdr:hover {
	text-decoration: underline;
	color: black;
}

.iceCmdSrtHdr .iceOutTxt {
	text-align: center;
	color: black;
	font-weight: 500;
}

.iceCmdSrtHdr .iceOutTxt table {
	width: auto;
	margin-left: auto;
	margin-right: auto;
}

.iceCmdSrtHdrAsc:after {
	display: inline-block;
	width: 8px;
	height: 1em;
	background-size: 8px 5px;
	background-image: url("css-images/column_sort_asc.gif");
	background-repeat: no-repeat;
	background-position: left center;
	content: "";
}

.iceCmdSrtHdrDesc:after {
	display: inline-block;
	width: 8px;
	height: 1em;
	background-size: 8px 5px;
	background-image: url("css-images/column_sort_desc.gif");
	background-repeat: no-repeat;
	background-position: left center;
	content: "";
}

.iceDatTbl td span.skillDisplayArrow0 {
	display: inline-block;
	width: 0.8em;
	padding: 0em 1.5em 0em 0em;
}

.iceDatTbl td span.skillDisplayArrow1 {
	display: inline-block;
	width: 1em;
	padding: 0em 1.3em 0em 0em;
	color: green;
}

.iceDatTbl td span.skillDisplayArrow2 {
	display: inline-block;
	width: 1em;
	padding: 0em 1.3em 0em 0em;
	color: red;
}

.iceDatTbl td span.skillDisplayValue0 {
	display: inline-block;
	padding: 0em 0.4em;
}

.iceDatTbl td span.skillDisplayValue1 {
	display: inline-block;
	padding: 0em 0.4em;
	color: green;
}

.iceDatTbl td span.skillDisplayValue2 {
	display: inline-block;
	padding: 0em 0.4em;
	color: red;
}

.dataTableColumnStatusBox {
	width: 2em;
	height: 2em;
	border-radius: 0.6em;
	display: inline-block;
	position: relative;
	top: 1px;
}

.dataTableColumnStatusBoxText {
	display: inline-block !important;
	padding-left: 6px !important;
}

.dataTableMultiChannelAgent {
	float: left;
	text-align: center;
	height: 24px;
}

.dataTableMultiChannelAgentText {
	position: relative;
	top: 2px;
	color: #F2F2F2;
}

.dataTableMultiChannelAgentAllFree {
	background-color: #169A13;
	border-radius: 7px;
}

.dataTableMultiChannelAgentAllBusy {
	background-color: #BB0F18;
	border-radius: 7px;
}

.dataTableMultiChannelAgentFree {
	background-color: #169A13;
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.dataTableMultiChannelAgentBusy {
	background-color: #BB0F18;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-top-left-radius: 7px;
	border-bottom-left-radius: 7px;
}

.dataTable20PercentLeftAlign {
	width: 20%;
	text-align: left;
}

.dataTableAutoLeftAlign {
	width: auto;
	text-align: left;
}

.dataTableColumnClassOutbound {
	background-image: url("css-images/call_out2.svg");
	background-size: 1.4em 1.4em;
	background-position: left top;
	width: 1.4em;
	height: 1.4em;
}

.dataTableColumnClassInbound {
	background-image: url("css-images/call_in.svg");
	background-size: 1.4em 1.4em;
	background-position: left top;
	width: 1.4em;
	height: 1.4em;
}

.dataTableColumnClassCall {
	background-image: url("css-images/phone_receiver3.svg");
	background-size: 1.4em 1.4em;
	background-position: left top;
	width: 1.4em;
	height: 1.4em;
	text-align: center;
}

.dataTableColumnClassWorkflow {
	background-image: url("css-images/worker.svg");
	background-size: 1.4em 1.4em;
	background-position: center center;
	width: 1.4em;
	height: 1.4em;
	text-align: center;
}

.fieldError {
	color: red;
}

.dataTableColoredColumn {
	width: auto;
	height: 1.68em;
	border-radius: 3px;
}

.statusGreen {
	background-color: #169A13;
	color: white;
}

.statusGrey {
	background-color: #888888;
	color: white;
}

.statusRed {
	background-color: #BB0F18;
	color: white;
}

.statusYellow {
	background-color: yellow;
	color: black;
}

.statusOrange {
	background-color: #F17735;
	color: white;
}

.statusBlue {
	background-color: #3375e0;
	color: white;
}

/* Extend the above to highlight a complete TD - not just the contents */
td:has(> div span.statusGreen) {
	background-color: #169A13;
	color: white;
}

td:has(> div span.statusGrey) {
	background-color: #888888;
	color: white;
}

td:has(> div span.statusRed) {
	background-color: #BB0F18;
	color: white;
}

td:has(> div span.statusYellow) {
	background-color: yellow;
	color: black;
}

td:has(> div span.statusOrange) {
	background-color: #F17735;
	color: white;
}

td:has(> div span.statusBlue) {
	background-color: #3375e0;
	color: white;
}

.greenDot:before, .redDot:before, .greyDotRendered:before {
	content: '';
	display: inline-block;
	position: relative;
	top: 1px;
	margin-right: 4px;
	width: 12px;
	height: 12px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	pointer-events: all;
}

.greenDot:before {
	background-color: #169A13;
}

.redDot:before {
	background-color: #BB0F18;
}

.greyDot:before, .greyDotRendered:before {
	background-color: #888888;
}

.greenDot, .redDot, .greyDot, .greyDotRendered {
	white-space: nowrap;
	pointer-events: none;
	color: black;
}

.greenDot:hover, .redDot:hover, .greyDot:hover, .greyDotRendered:hover {
	white-space: nowrap;
	pointer-events: none;
	color: black;
	text-decoration: none;
}

.dataTableSelectorPanelElement {
	display: inline-block;
	position: absolute !important;
	top: 0px;
	left: 0px;
	white-space: nowrap;
}

.dataTableSelectorPanelElement span {
	display: inline-block;
	font-size: 1em !important;
}

.horizontalCenter {
	position: absolute;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, 0%)
}

/* **************************************************************************
 *
 * Double Connection Error
 *
 * **************************************************************************/

.doubleConnectionErrorOuterDiv {
	display: table;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.60);
	z-index: 20;
}

.doubleConnectionErrorInnerDiv1 {
	display: table-cell;
	vertical-align: middle;
	z-index: 21;
}

.doubleConnectionErrorInnerDiv2 {
	margin:0 auto 0 auto;
	width: 330px;
	height: 330px;
	display: table;
	z-index: 21;
}

.doubleConnectionHeader {
	height: 34px;
	display: block;
	background-color: #F17735;
	color: #FFFFFF;
	font-weight: 300;
	font-size: 2em;
	text-align: center;
	padding-top: 4px;
	padding-bottom: 4px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	position: relative;
}

.doubleConnectionMiddle {
	display: block;
	background-color: #F2F2F2;
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 20px;
	padding-bottom: 20px;
}

.doubleConnectionFooter {
	display: block;
	background-color: #858585;
	color: #FFFFFF;
	font-size: 1em;
	font-weight: 300;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

/* **************************************************************************
 *
 * Modal Panels
 *
 * **************************************************************************/

.modalPopupBackground {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 0.5;
	z-index: 1000;
}

.modalPopupContainer {
	position: fixed;
	background-color: #F2F2F2;
	opacity: 1.0;
	z-index: 1500;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	height: auto;
	border-radius: 13px;
}

.modalPopupBackgroundLevel2 {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 0.5;
	z-index: 2000;
}

.modalPopupContainerLevel2 {
	position: fixed;
	background-color: #F2F2F2;
	opacity: 1.0;
	z-index: 2500;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	height: auto;
	border-radius: 13px;
}

.modalPopupInnerContainer {
	position: relative;
	height: 100%;
	width: 100%;
}

.modalPopupHeader {
	display: block;
	height: auto;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color: #F17735;
	border-top-left-radius: 13px;
	border-top-right-radius: 13px;
	text-align: center;
}

.modalPopupBody {
	display: block;
	padding-top: 16px;
	padding-bottom: 16px;
	padding-left: 8px;
	padding-right: 8px;
}

.modalPopupHeaderText {
	font-weight: 300 !important;
	font-size: 2em;
	color: white;
}

.modalPopupHeaderCloseButton {
	position: absolute;
	top: 4px;
	right: 2px;
	width: 2em;
	height: 2em;
	border-radius: 0px;
	background-image: url("css-images/close_icon.svg");
	background-size: 2.2em 2.2em;
	background-repeat: no-repeat;
}

.modalPopupHeaderCloseButton:hover {
	text-decoration: none;
	background-color: #F17735;
}

.modalPopupBodyImage {
	width: 64px;
	height: 64px;
}

.modalPopupColumn {
	vertical-align: top;
}

.modalPopupBodyTextContainer {
	padding-left: 8px;
}

.modalPopupText1 {
	display: block;
	white-space: normal;
	font-size: 1.25em;
	margin-bottom: 8px;
	color: #0A386C;
}

.modalPopupText2 {
	display: block;
	white-space: normal;
	margin-bottom: 4px;
}

.modalPopupText3 {
	display: block;
	white-space: normal;
	margin-bottom: 4px;
}

.modalPopupText4 {
	display: block;
	white-space: normal;
	position: relative;
	margin-bottom: 4px;
}

.modalPopupButtonContainer {
	display: block;
	padding-top: 8px;
}

.modalPopupText5 {
	text-align: left;
}

.popupButtons {
	min-width: 5em;
	margin-top: 0.5em;
	margin-right: 0.5em;
}

.popupButtons-dis {
	min-width: 5em;
	margin-top: 0.5em;
	margin-right: 0.5em;
}

/* **************************************************************************
 *
 * Specific Popup Sizes
 *
 * **************************************************************************/

.modalConfirmationContainer {
	width: 500px;
}

.modalDeleteContainer {
	width: 400px;
}

.modalPanelTableColumnOrder {
	width: 980px;
}

.modalGroupsVisibilityPopup {
	width: 600px;
}

.modalGroupsVisibilityPopup {
	width: 600px;
}

.modalDiallerContactsEditPopup {
	width: 450px;
}

.modalAgentGroupMappingEditPopupContainer {
	width: 600px;
}

.modalAgentGroupMappingNewPopup {
	width: 600px;
}

.modalGroupsExtendedSearchNewPopup {
	width: 500px;
}

.modalGroupsExtendedSearchEditPopup {
	width: 500px;
}

.modalSendSMSPopupContainer {
	width: 270px;
}

.modalAcdFreeSeatingWhiteListEditPopup {
	width: 360px;
}

.modalAcdFreeSeatingWhiteListNewPopup {
	width: 360px;
}

.modalPanelAcdInboxGroupMappingEditPopup {
	width: 390px;
}

.modalPanelAcdInboxGroupMappingNewPopup {
	width: 390px;
}

.modalLimitPageSizeContainer {
	width: 350px;
}

.modalPopupUserImportReportContainer {
	width: 400px;
}

.modalPopupDiallerContactsExportContainer {
	width: 480px;
}

.modalPanelActionContainer {
	width: 450px;
}

.modalPanelChangePasswordContainer {
	width: 480px;
}

.modalPanelChangePasswordFTPImport {
	width: 480px;
}

.modalPanelDiallerContactsExtrasContainer {
	width: 370px;
}

.modalPanelSecurityGroupsNewContainer {
	width: 420px;
}

.modalPanelServiceNumberStatusNewContainer {
	width: 400px;
}

.modalPanelDiallerCampaignsQuestionsAnswersEditContainer {
	width: 450px;
}

.modalPanelDiallerDocumentsEditContainer {
	width: 450px;
	height: 260px;
}

.modalPanelCNumbersContainer {
	width: 480px;
	height: 320px;
}

.modalPanelCNumberStatusNewContainer {
	width: 380px;
}

.modalPopupSetTransactionCodeHistoryContainer {
	width: 800px;
}

.modalPopupNewSkillAdjustmentContainer {
	width: 330px;
}

.modalPopupOutboundCall {
	width: 430px;
}

.modalPanelWarningInsertContainer {
	width: 380px;
}

.modalPanelWarningUpdateContainer {
	width: 380px;
}

.modalLimitPageSizePopupContainer {
	width: 340px;
}

.modalPanelActionForceStatusReachableYesNoContainer {
	width: 400px;
}

.modalSetTransactionCodePopupContainer {
	width: 800px;
}

.modalPopupUploadPresentationContainer {
	width: 500px;
}

.modalChangeSkillsPopupContainer {
	width: 600px;
}

.modalPanelDiallerCampaignsTimeWindowsNewContainer {
	width: 300px;
}

.modalPanelDiallerCampaignsTimeWindowsEditContainer {
	width: 300px;
}

/* **************************************************************************
 *
 * Web Messages
 *
 * **************************************************************************/

.acdWebMessagesPanel1 {
	width: 100%;
	height: 10em !important;
	overflow-y: scroll;
	border: none !important;
}

.acdWebMessagesPanel2 {
	width: 98%;
	height: 15em !important;
	overflow-y: scroll;
	border: none !important;
}

.acdWebMessagesPanel3 {
	width: 98%;
	height: 20em !important;
	overflow-y: scroll;
	border: none !important;
}

.acdWebMessagesTitle {
	width: 100%;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 2em;
	font-weight: 300;
	background-color: #F17735;
	color: white;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	text-align: center;
}

.acdWebMessagesTableText {
	position: relative;
	top: 4px;
}

.acdWebMessagesButtons {
	margin-top: 6px;
}

.acdWebMessagesCloseButton {
	position: absolute;
	top: 12px;
	right: 8px;
	width: 24px;
	height: 24px;
}

.acdWebMessagesTable {
	width: 100%;
}

.acdWebMessagesTable tbody tr td {
	vertical-align: top;
	padding-top: 4px;
}

.acdWebMessagesTable thead tr th {
	border-bottom: 1px solid #BBBBBB !important;
	padding-bottom: 2px;
}

.acdWebMessagesTable tbody tr td {
	border-bottom: 1px solid #BBBBBB !important;
	padding-bottom: 2px;
}

.acdWebMessagesImageCol {
	width: 5%;
	text-align: center;
	vertical-align: top;
}

.acdWebMessagesSenderCol {
	text-align: left;
	width: 15%;
}

.acdWebMessagesDateTimeCol {
	width: 15%;
	text-align: left;
}

.acdWebMessagesSubjectCol {
	width: 20%;
	text-align: left;
}

.acdWebMessagesMessageCol {
	width: 35%;
	text-align: left;
}

.acdWebMessagesActionCol {
	width: 10%;
	text-align: left;
}

/* **************************************************************************
 *
 * Various bits and pieces.
 *
 * **************************************************************************/

.facesMessagesImage {
	padding: 4px;
	text-align: left;
}

.facesMessagesImageCol2 {
	text-align: left;
}

.facesMessagesError {
	color: #D86344;
	text-align: left;
}

.errorImage {
	padding: 4px;
	text-align: center;
}

.hideObject {
	visibility: hidden;
	width: 0
}

.alignLeft {
	text-align: left;
}

.alignCenter {
	text-align: center;
}

.alignRight {
	text-align: right;
}

.dialogButtonsAlignRight {
	margin-top: 6px;
	text-align: right;
}

/* **************************************************************************
 *
 * SalesForce Elements
 *
 * **************************************************************************/

div#JTELSalesForceDiallerMessages {

}

/* **************************************************************************
 *
 * Password Strength Checker
 *
 * **************************************************************************/

.passwordStrengthImage {
	margin-right: 4px;
}

span#Password1Weak {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_weak_16x16_plain.png);
}

span#Password1Medium {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_medium_16x16_plain.png);
}

span#Password1Strong {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_strong_16x16_plain.png);
}

span#AgentPIN1Weak {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_weak_16x16_plain.png);
}

span#AgentPIN1Wrong {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_weak_16x16_plain.png);
}

span#AgentPIN1Strong {
	padding-left: 24px;
	padding-bottom: 2px;
	background-repeat: no-repeat;
	background-position: 4px 0px;
	background-image: url(css-images/password_strong_16x16_plain.png);
}

/* **************************************************************************
 *
 * The login window
 *
 * **************************************************************************/

.loginBody {
	height: auto;
}

#loginContainer {
	margin: 50px auto;
	width: 390px;
}

#loginFormMiddle {
	display: block;
	background-color: #F2F2F2;
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 20px;
	padding-bottom: 20px;
}

.loginHeader {
	height: 34px;
	display: block;
	background-color: #F17735;
	color: #FFFFFF;
	font-weight: 300;
	font-size: 2em;
	text-align: center;
	padding-top: 4px;
	padding-bottom: 4px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	position: relative;
}

.loginFooter {
	display: block;
	background-color: #858585;
	color: #FFFFFF;
	font-size: 1em;
	font-weight: 300;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

/* **************************************************************************
 *
 * Main Box Model
 *
 * **************************************************************************/

#boxModelWrapper {
	width: 100%;
	height: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border: 4px solid white;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	overflow: hidden;
}

#boxModelHeader {
	display: block;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	background-color: #F17735;
	text-align: center;
	position: relative;
}

#boxModelFooter {
	background-color: #858585;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}

#boxModelMain {
	background-color: #F2F2F2;
	-webkit-flex: 1;
	flex: 1;
	overflow: hidden;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
}

#boxModelLeftCol {
	width: 320px;
	position: relative;
}

.floatContainerHeaderClass {
	border-top: none;
}

#boxModelCenterCol {
	-webkit-flex: 1;
	flex: 1;
	overflow-y: auto;
}

.boxModelCenterColMap {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	position: relative;
}

#boxModelGoogleMapsMarkerCluster {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

#boxModelRightCol {
	width: 320px;
	position: relative;
}

#LiveAgentForm {
	width: 20%;
}

#boxModelRightColAI {
	position: relative;
	width: 100%;
}

.pbxIntegrationIFrame {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

@media all and (max-width: 850px) {
	#boxModelMain {
		background-color: #F2F2F2;
		-webkit-flex: 1;
		flex: 1;
		overflow: auto;
		display: block;
	}
	#boxModelLeftCol {
		display: block;
		position: relative;
		width: 100%;
	}

	#boxModelCenterCol {
		display: block;
		width: 100%;
	}

	#boxModelRightCol {
		display: block;
		position: relative;
		width: 100%;
	}

	#boxModelRightColAI {
		display: block;
		position: relative;
		width: 100%;
	}

	.pbxIntegrationIFrame {
		position: relative;
		width: 100%;
		min-height: 500px;
	}
}

/* **************************************************************************
 *
 * Header Rows
 *
 * **************************************************************************/

.boxModelHeaderRow {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.boxModelHeaderRowLeft {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

.boxModelHeaderRowRight {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

.boxModelHeaderElement {
	vertical-align: top;
	margin-left: 4px;
	margin-right: 4px;

	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
}

.boxModelHeaderElementFirst {
	margin-left: 0px;
}

.boxModelHeaderElementLast {
	margin-right: 0px;
}

/* **************************************************************************
 *
 * Specific Header Styling, Button and Link Styling
 *
 * **************************************************************************/

/* Login Header */
#headerFlagsLogin {
	position: absolute;
	top: 4px;
	right: 10px;
}

/* Common and main header flags */
#headerLogo, #headerLogoLogin {
	position: relative;
	top: -3px;
}

.headerSystemName {
	color: yellow;
	font-weight: 600;
	font-size: 1.1em;
	position: relative;
	top: -10px;
}

#headerFlagsLogin, #headerFlagsMain {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: center;
	justify-content: center;
}

/* Main Header */
.mainHeader {
	height: 34px;
	padding-top: 4px;
	padding-bottom: 4px;
	color: #FFFFFF;
	font-weight: 300;
	font-size: 2em;
}

.acdHeader {
	padding-top: 4px;
	background-color: #F2F2F2;
}

#headerMenu {
}

.headerLogoImage {
	height: 40px;
	border: 0;
	padding: 0;
	margin: 0;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	/* IE10+ specific fix for header logo image */
	.headerLogoImage {
		margin-left: -140px;
	}
}

.headerLogindetailsContainer, .headerImpersonatingContainer {
	border-radius: 7px;
	background-color: #E8E8E8;
	height: 1em;
	padding-left: 4px;
	padding-right: 4px;
	margin-top: 5px;
	white-space: nowrap;
}

.headerImpersonatingContainer {
	background-color: #FFCF85;
}

.headerLogindetailsLinksAndTextShiftedUp {
	display: inline;
	color: #000000;
	position: relative;
	font-size: 0.5em;
	top: -0.75em;
	padding-left: 4px;
	padding-right: 4px;
}

.headerElementSmallButtonImage {
	width: 16px;
	height: 16px;
	padding-left: 4px;
	padding-right: 4px;
}

/* **************************************************************************
 *
 * Acd Header
 *
 * **************************************************************************/

/* Notifications Area */

.acdHeaderNotificationsContainer > div {
	margin-left: 2px;
	margin-right: 2px;
}

.acdHeaderNotificationsContainer:first-child {
	margin-left: 0px;
}

.acdHeaderNotificationsContainer:last-child {
	margin-right: 0px;
}

.acdHeaderNotificationsIcon {
	height: 50px;
	width: 50px;
	border-radius: 10px;
}

.acdHeaderNotificationsIconNone, .acdHeaderNotificationsIconSeen {
	background-color: #D6D6D6;
}

.acdHeaderNotificationsIconRed, .acdHeaderNotificationsIconYellow, .acdHeaderNotificationsIconGreen {
	background-color: #D6D6D6;
}

.acdHeaderNotificationsIconNew {
	background-color: #FFFEB3;
}

.acdHeaderNotificationsIconNew:after {
	content: "";
	box-sizing: border-box;
	position: absolute;
	background-color: transparent;
	height: 50px;
	width: 50px;
	margin-left: -45px;
	border: 3px solid #BB0F18;
	border-radius: 100px;
	-webkit-animation: pulsate 1s ease-out;
	animation: pulsate 1s ease-out;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	opacity: 1.0;
}

.acdHeaderNotificationsIconNew:hover {
	-webkit-animation: background_blink 0.75s linear 0s infinite;
	animation: background_blink 0.75s linear 0s infinite;
}

.acdHeaderNotificationsIconNew:hover:after {
	left: -10000px;
	top: -10000px;
}

@-webkit-keyframes pulsate {
	0% {-webkit-transform: scale(1.0, 1.0);}
	100% {-webkit-transform: scale(1.8, 1.8); border: 10px solid #BB0F18; opacity: 0.0;}
}

@keyframes pulsate {
	0% {transform: scale(1.0, 1.0);}
	100% {transform: scale(1.8, 1.8); border: 10px solid #BB0F18; opacity: 0.0;}
}

.acdHeaderNotificationsIconImage {
	width: 40px;
	height: 40px;
	position: relative;
	top: 4px;
	left: 0px;
}

.acdHeaderToolbarQuickStatusContainer {
	height: 50px;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

.acdHeaderToolbarAgentStatusAndImageContainerTop, .acdHeaderToolbarAgentStatusAndImageContainerBottom {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

.acdHeaderToolbarAgentStatusAndImageContainerTop {
	height: 24px;
	position: relative;
	top: -1px;
}

.acdHeaderToolbarAgentStatusAndImageContainerBottom {
	height: 24px;
	position: relative;
	top: 1px;
}

.acdHeaderToolbarAcdStatusImageContainer {
	height: 24px;
}

.acdHeaderToolbarAcdStatusImage {
	height: 24px;
	width: 24px;
	margin-left: 4px;
	margin-right: 4px;
}

.acdHeaderToolbarAcdStatus {
	height: 24px;
	margin-right: 6px;
	border-radius: 7px;
	text-align: center;
	padding-left: 8px;
	padding-right: 8px;
	min-width: 150px;
}

.acdHeaderToolbarAcdStatus > span, .acdHeaderToolbarAcdStatus > a > span {
	position: relative;
	top: 3px;
	font-weight: 300;
}

.acdQuickStatusButton {
	width: 24px;
	height: 24px;
	margin-right: 2px;
	border-radius: 7px;
	text-align: center;
	display: inline-block;
}

.acdQuickStatusButtonInList {
	width: 2em;
	height: 2em;
	margin-right: 2px;
	border-radius: 0.6em;
	text-align: center;
	display: inline-block;
}

.acdQuickStatusButtonText {
	position: relative;
	top: 3px;
	font-weight: 300;
}

.acdQuickStatusButton > span {
	position: relative;
	top: 3px;
	font-weight: 300;
}

.acdQuickStatusButton:hover {
	text-decoration: none;
}

.brailleQuickStatusButton {
	height: 24px;
	margin-right: 2px;
	border-radius: 7px;
	text-align: center;
	display: inline-block;
}

.brailleQuickStatusButton > span {
	position: relative;
	top: 3px;
	font-weight: 300;
	padding-left: 3px;
	padding-right: 3px;
}

.brailleQuickStatusButton:hover {
	text-decoration: none;
}

.acdHeaderToolbarPostCall {
	background-color: #D6D6D6;
	min-width: 160px;
	height: 50px;
	border-radius: 10px;
}

.acdHeaderToolbarPostCallTop {
	width: 100%;
	height: 50%;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 10px 10px 0 0;
	text-align: center;
	font-weight: 300;
}

.acdHeaderToolbarPostCallTopText {
	position: relative;
	top: 3px;
}

.acdHeaderToolbarPostCallBottom {
	font-weight: 300;
	height: 50%;
	text-align: center;
}

.acdHeaderToolbarPostCallBottomText {
	position: relative;
	top: 1px;
	padding-left: 5px;
	padding-right: 5px;
}

.acdHeaderToolbarPostCallBottomTextNoImage {
	position: relative;
	top: 3px;
	padding-left: 5px;
	padding-right: 5px;
}

.acdHeaderToolbarPostCallImageLink {
	position: relative;
	top: 1px;
	background: rgba(0, 0, 0, 0.2);
	border: rgba(0, 0, 0, 0.2);
	width: 16px;
	height: 16px;
	border-radius: 8px;
}

.acdHeaderToolbarPostCallBottomImageLeft {
	width: 16px;
	height: 16px;
	position: relative;
	top: 3px;
}

.acdHeaderToolbarPostCallBottomImageRight {
	width: 16px;
	height: 16px;
	position: relative;
	top: 3px;
}

.acdHeaderUsersProfiles {
	font-weight: 300;
}

.acdHeaderUsersProfilesText {
	position: relative;
	top: 3px;
	font-weight: 300;
}

.brailleHeaderToolbarPostCall {
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 10px 10px 10px 10px;
	text-align: center;
	font-weight: 300;
	vertical-align: middle;
}

.brailleHeaderToolbarPostCall > span {
	padding-left: 6px;
	padding-right: 6px;
	position: relative;
	top: 30%;
}

/* **************************************************************************
 *
 * Main Title Header
 *
 * **************************************************************************/

.mainTitleOuterContainer {
	display: block;
	background-color: #F2F2F2;
}

.mainTitleContainerSpacer {
	display: block;
	height: 4px;
	background-color: #F2F2F2;
}

.mainTitleContainer {
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	background-color: #E8E8E8;
	vertical-align: top;
}

.mainTitleImageContainer {
	margin-left: 6px;
	margin-top: 6px;
	vertical-align: middle;
	text-align: center;
}

.brailleTitleImageContainer {
	vertical-align: middle;
	text-align: center;
	width: 0.8em;
	height: 0.8em;
}

.brailleTitleImageImage {
	width: 36px;
	height: 36px;
	margin-left: 6px;
	vertical-align: center;
	background-color: white;
}

.mainTitleImageImage {
	width: 44px;
	height: 44px;
	vertical-align: center;
}

.mainTitleTitleContainer {
	font-size: 2.25em;
	font-weight: 300;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0;
	padding-bottom: 0;
	white-space: nowrap;
}

.mainTitleTitleContainer > span {
	position: relative;
	top: 8px;
}

.brailleTitleTitleContainer {
	font-size: 1em;
	font-weight: 300;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0;
	padding-bottom: 0;
	white-space: nowrap;
}

.brailleTitleTitleContainer > span {
	position: relative;
}

/* **************************************************************************
 *
 * Footer
 *
 * **************************************************************************/

.footerPanelLeft, .footerPanelMiddle, .footerPanelRight {
	font-size: 1em;
	font-weight: 300;
	text-align: center;
	white-space: nowrap;
	color: white;
	padding-left: 10px;
	padding-right: 10px;
}

.footerPanelLeft {

}

.footerPanelMiddle {

}

.footerPanelRight {

}

.footerLinks {
	color: #FFFFFF;
}

.footerLinks:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

/* **************************************************************************
 *
 * Supervisor Toolbar
 *
 * **************************************************************************/

.supervisorToolbarContainer {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 3px;
}

.supervisorToolbarElement {
	margin: 3px;
}

.supervisorToolbarAreaInnerContainer {
	display: block;
	height: 36px;
	border-radius: 7px;
	padding-top: 7px;
	padding-left: 6px;
	padding-right: 6px;
	background-color: #F2F2F2;
	vertical-align: middle;
	font-weight: bold;
	white-space: nowrap;
}

.btnAcdSupervisorBeanSetNow {
	background-color: #AAAAAA;
	margin-left: 2px;
	margin-right: 0px;
}

/* **************************************************************************
 *
 * Supervisor Grid
 *
 * **************************************************************************/

.supervisorGridContainer {
	display: grid;
	height: 100%;
	width: 100%;
}

.supervisorGridItem {
	width: 100%;
	overflow: auto;
}

.dataTableColumnStatusBoxPostCallWithEnd {
	width: 2em;
	height: 2em;
	border-radius: 0.6em;
	display: inline-block;
	position: relative;
	top: -3px;
}

.acdSupervisorDataTablePostCallImageContainer {
	position: relative;
	left: 4px;
}

.dataTableColumnStatusBoxTextPostCallWithEnd {
	display: inline-block !important;
	padding-left: 6px !important;
	position: relative;
	top: 3px;
}

.acdSupervisorDataTablePostCallImageLink {
	position: relative;
	top: 1px;
	background: rgba(0, 0, 0, 0.2);
	border: rgba(0, 0, 0, 0.2);
	width: 16px;
	height: 16px;
	border-radius: 8px;
}

.acdSupervisorDataTablePostCallImageImage {
	width: 16px;
	height: 16px;
	position: relative;
	top: 3px;
}

/* **************************************************************************
 *
 * Toolbar in Title Area
 *
 * **************************************************************************/

.toolbarButton {
	margin: 0;
	margin-top: 2px;
}

.toolBarButton-dis {
	margin: 0;
	margin-top: 2px;
}

.toolbarButtonMarginRight4px {
	margin: 0;
	margin-right: 4px;
	margin-top: 2px;
}

.toolbarButtonMarginRight4px-dis {
	margin: 0;
	margin-right: 4px;
	margin-top: 2px;
}

.toolbarArea {
	margin: 0;
	border: none;
	padding: 0;
}

.toolbarAreaBlock {
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-left: 4px;
}

.toolbarAreaFlex {
	min-height: 4.2em;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-align-items: center;
	align-items: center;
	-webkit-align-content: center;
	align-content: center;
}

.toolbarSingleButtonMoveUp {
	position: relative;
	top: -14px;
}

.toolbarAreaWorkbreakIndicatorPanel {
	margin-left: 6px;
	margin-top: 6px;
	background-color: #D6D6D6;
	border-radius: 10px;
	height: 43px;
	width: 43px;
}

.toolbarAreaWorkbreakIndicator {

}

.toolbarSingleButtonBottomLineTextMoveUp4px {
	position: relative;
	top: -4px;
}

.toolbarSingleButtonBottomLineTextMoveUp3px {
	position: relative;
	top: -3px;
}

.confToolbarSubConferenceSelect {
	width: 4em;
	height: 24px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	position: relative;
	top: 1px;
}

.workbreakIndicatorTooltipStyle {
	font-family: Courier, monospace;
	font-size: 0.8em;
	white-space: pre;
}

.workbreakIndicatorInTableGraphic {
	width: 2em;
}

/* **************************************************************************
 *
 * Agent Home Dashboard
 *
 * **************************************************************************/

.dashboardAgentContainer {
	display: inline-block;
	margin-right: 4px;
	margin-top: 4px;
}

.dashboardAgentElement {
	display: inline-block;
	vertical-align: top;
	height: 46px;
	width: 110px;
	color: white;
	margin-right: 3px;
	border-radius: 10px;
	font-weight: 300;
}

.dashboardNeutral {
	background-color: #959595;
}

.dashboardOK {
	background-color: #169A13;
}

.dashboardWarn {
	background-color: #E6AA00;
}

.dashboardError {
	background-color: #BD0022;
}

.dashboardAgentTopText {
	display: block;
	height: 42%;
	background: rgba(0, 0, 0, 0.2);
	text-align: center;
	padding-top: 1px;
	padding-left: 2px;
	padding-right: 2px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.dashboardAgentBottomText {
	display: block;
	height: 58%;
	text-align: center;
	font-size: 1.3em;
	font-weight: normal;
	padding-top: 2px;
}

/* **************************************************************************
 *
 * Home
 *
 * **************************************************************************/

.homePageImageLinkDivContainer {
	display: inline-block;
	float: left;
	width: 240px;
	height: 105px;
	margin-top: 4px;
	margin-right: 4px;
	padding: 4px;
	background-color: #E8E8E8;
}

.homePageImageLinkDivContainer:hover {
	background-color: #FFCF85;
}

.homePageImageLinkImage {
	float: left;
}

.homePageImageLinkTitle {
	text-align: left;
	font-size: 1.5em;
	font-weight: 300;
	color: black;
	position: relative;
	top: 0.6em;
	left: 10px;
	white-space: normal;
}

.homePageImageLinkTitle2Line {
	top: 0px;
}

.homePageImageLinkText {
	clear: both;
	text-align: left;
	color: #505050;
	white-space: normal;
}

/* **************************************************************************
 *
 * Old Style Menu
 *
 * **************************************************************************/

.icePnlClpsblHdr, .icePnlClpsblColpsdHdr {
	margin-top: 2px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	background-color: #AAAAAA;
	width: 200px;
	height: 2em;
	border: none ! important;
}

.icePnlClpsblCnt {
	width: 200px;
}

.icePnlClpsblHdr div div, .icePnlClpsblColpsdHdr div div {
}

.icePnlClpsblHdr div div a, .icePnlClpsblColpsdHdr div div a {
	color: white;
	font-weight: 300;
	padding-left: 4px;
	position: relative;
	top: 0.3em;
}

.icePnlClpsblHdr div div a:hover, .icePnlClpsblColpsdHdr div div a:hover {
	color: #EEEEEE;
}

.icePnlClpsblCnt {
	background-color: #D6D6D6;
	margin-bottom: 5px;
}

.icePnlClpsblCnt div {
	margin-bottom: 3px;
}

.icePnlClpsblCnt div a {
	display: block;
	padding-left: 12px;
	color: #555555;
}

.icePnlClpsblCnt div a:hover {
	color: #D35410;
}

/* **************************************************************************
 *
 * Agent Home
 *
 * **************************************************************************/

.agentHomeCallDetailsGrid {
	display: grid;
	grid-template-columns: minmax(auto, 1fr) minmax(auto, 2fr) minmax(auto, 2fr);
	grid-template-rows: 100%;
	height: calc( 100% - 34px );
	width: 100%;
	column-gap: 2px;
}

.agentHomeCallDetailsGridOuterContainer {
	height: 100%;
	width: 100%;
}

.agentHomeCallDetailsGridContainer {
	height: calc( 100% + 4px );
	width: 100%;
	overflow: hidden;
}

.agentHomeCallDetailsGridHeader {
	background-color: #D6D6D6;
	text-align: center;
	font-weight: bold;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	height: 16px;
}

.agentHomeCallDetailsGridContent {
	background-color: #F0F0F0;
	border: 1px solid #D6D6D6;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	height: calc( 100% - 22px );
	padding: 2px;
}

.agentHomeCurrentCallHeadline {
	margin-top: 3px;
	font-size: 1.3em;
	font-weight: 300 !important;
	background-color: #999999;
	color: white;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.agentHomeCurrentCallContainer {
	display: table;
	background-color: #E8E8E8;
}

.agentHomeCurrentCallContainerBraille {
	display: table-row;
}

.agentHomeCurrentCallContainerNoBraille {
	display: block;
}

.agentHomeCallAreaLeftBraille {
	display: table-cell;
	width: 80%;
}

.agentHomeCallAreaRightBraille {
	display: table-cell;
	width: 20%;
	padding-left: 2px;
}

.agentHomeCallAreaNoBraille {
	width: 100%;
}

.agentHomeCallStatusBar {
	background-color: #999999;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	height: 22px;
	color: white;
}

.agentHomeCallStatusText {
	font-size: 1.3em;
	font-weight: 300;
	text-overflow: ellpisis;
	white-space: nowrap;
	overflow: hidden;
}

.agentHomeCallHandlingButtons {
	margin-right: 0px;
}

.agentHomeCallHandlingButtons-dis {
	margin-right: 0px;
}

span + input.agentHomeCallHandlingButtons {
	margin-left: 2px;
}

span + input.agentHomeCallHandlingButtons-dis {
	margin-left: 2px;
}

.statusButtonsRight {
	float: right;
}

.statusButtonsLeft {
	float: left;
}

.agentHomeCallHandlingOuterContainer {
	display: block;
	vertical-align: top;
}

.agentHomeCallHandlingInnerContainer {
	float: left;
}

.agentHomeCallHandlingInnerContainerLeft {
	width: 50%;
}

.agentHomeCallHandlingInnerContainerLeftNoRight {
	width: 100%;
}

.agentHomeCallHandlingInnerContainerRight {
	width: 50%;
}

.agentHomeCallHandlingContainerLeft, .agentHomeCallHandlingContainerRight {
	background-color: #E8E8E8;
	border-radius: 7px;
}

.agentHomeCallHandlingContainerLeft {
	margin-top: 4px;
	margin-right: 2px;
}

.agentHomeElementWithBottomRightSpace {
	padding-bottom: 2px;
	padding-right: 2px;
}

.agentHomeElementWithRightSpace {
	padding-right: 2px;
}

.agentHomeCallStatusButtonsAndInputs {
	padding-top: 2px;
	padding-bottom: 2px;
	height: 28px;
}

.agentHomeCurrentCallDetails {
	display: table;
	border-collapse: collapse;
	width: 100%;
	overflow: hidden;
}

.agentHomeCurrentCallDetailsRow {
	display: table-row;
	width: 100%;
}

.agentHomeCurrentCallDetailsBox {
	display: table-cell;
	border-right: 1px solid white;
	background-color: #E8E8E8;
	text-align: center;
	font-weight: 300;
}

.agentHomeActualCallHeader {
	display: block;
	font-weight: bold;
	background-color: #D6D6D6;
	color: black;
	padding: 2px;
	white-space: nowrap;
}

.agentHomeActualCallData span {
	font-weight: normal !important;
	color: black;
	position: relative;
	top: 3px;
}

.agentHomeActualCallData span.agentHomeCurrentCallSkill {
	display: inline-block;
	background-color: #D35410;
	color: white;
	border-radius: 6px;
	margin-left: 1px;
	margin-right: 1px;
	padding-left: 4px;
	padding-right: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 150px;
	position: relative;
	top: 4px;
}

.agentHomeActualCallData span.agentHomeCurrentCallSkill span {
	color: white;
	vertical-align: top;
	position: relative;
	top: 0px;
}

span.agentHomeCurrentCallSkillChanger {
	display: inline-block;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 7px;
	padding-left: 4px;
	padding-right: 4px;
	position: relative;
	top: 0px;
}

span.agentHomeCurrentCallSkillChanger a {
	color: black;
	font-weight: bold;
	position: relative;
	top: -2px;
}

.agentHomeActualCallDataLink {
	font-weight: normal !important;
	position: relative;
	top: 3px;
}

.agentHomeActualCallData {
	display: block;
	min-height: 2em;
}

.agentHomeActualCallData span.agentHomeCheckMark {
	display: inline-block;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	padding-left: 4px;
	padding-right: 4px;
	position: relative;
	top: -3px;
}

.agentHomeActualCallData span.agentHomeCheckMark a {
	color: black;
	font-weight: bold;
	position: relative;
	top: -1px;
}

.columnFullMinusTickMark {
	width: calc( 100% - 18px );
}

.columnFullMinus8pxBorders, .columnFullMinus8pxBorders-dis {
	display: inline-block;
	width: calc( 100% - 8px );
}

.columnFullMinusTickMark-dis {
	width: calc( 100% - 18px );
}

.columnFullTickMark {
	width: 18px;
}

.editFieldSubmitTickMark {
	display: inline-block;
	background-color: #F17735;
	border-radius: 8px;
	padding-left: 4px;
	padding-right: 4px;
	position: relative;
	right: 4px;
}

.editFieldSubmitTickMark a {
	color: white;
	font-weight: bold;
	position: relative;
	top: -1px;
}

.agentHomeActualCallDataEditError span {
	font-weight: bold;
	position: relative;
	top: -5px;
	color: red;
}

.agentHomeActualCallData span.agentHomeActualCallDataEdit {
	display: inline-block;
	color: white;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 7em;
}

.agentHomeActualCallDataEditBox {
	border-radius: 2px;
	padding: 0px;
}

.callStatusNone {
	display: inline-block;
	background-image: url('css-images/phone_receiver2_black.svg');
	background-position:50% 50%;
	background-size: 90%;
	background-repeat: no-repeat;
	width: 2em;
	height: 2em;
}

.callStatusInbound {
	display: inline-block;
	background-image: url('css-images/call_in.svg');
	background-position:50% 50%;
	background-size: 90%;
	background-repeat: no-repeat;
	width: 2em;
	height: 2em;
}

.callStatusOutbound {
	display: inline-block;
	background-image: url('css-images/call_out2.svg');
	background-position:50% 50%;
	background-size: 90%;
	background-repeat: no-repeat;
	width: 2em;
	height: 2em;
}

.callRecordingNoCallPresent {
	background-color: #999999;
}

.callRecordingOptionDisabled {
	background-color: #999999;
}

.callRecordingOptionPermanentWithoutOptOut {
	background-color: #BB0F18;
}

.callRecordingOptionPermanentWithOptOutOn {
	background-color: #BB0F18;
}

.callRecordingOptionPermanentWithOptOutOff {
	background-color: #999999;
}

.callRecordingOptionManualOn {
	background-color: #BB0F18;
}

.callRecordingOptionManualOff {
	background-color: #999999;
}

.callRecordingOptionDtmfOptInOn {
	background-color: #BB0F18;
}

.callRecordingOptionDtmfOptInOff {
	background-color: #999999;
}

.callRecordingAnnouncement {
	background-color: #FADB05;
}

/* **************************************************************************
 *
 * AcdEvent
 *
 * **************************************************************************/

.acdEventWindowSplitterColumns {
	vertical-align: top;
	width: 50%;
}

.acdEventHeadlineText {
	font-size: 1.5em;
	font-weight: 300 !important;
	background-color: #999999;
	color: white;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.acdEventHeadlineBar {
	background-color: #999999;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	height: 22px;
	color: white;
}

/* **************************************************************************
 *
 * Wallboard
 *
 * **************************************************************************/

.wallboardTileContainer {
	position: relative;
}

/* Column Selector */
.wallboardColumnSelector {
	position: absolute;
	top: 8px;
	left: 9px;
	width: 24px;
	height: 24px;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	background-size: 24px 24px;
	background-image: url('css-images/table_selection_column icon.svg');
	z-index: 1;
}

.wallboardOK {
	background-color: #169A13 !important;
}

.wallboardWarn {
	background-color: #E6AA00 !important;
}

.wallboardError {
	background-color: #BD0022 !important;
}

.wallboard2StaticInfo {
	background-color: #82A7BC !important;
}

.wallboardBackgroundLightBlue {
	background-color: rgb( 180, 198, 231 ) !important;
}

.wallboardBackgroundGrey {
	background-color: rgb( 191, 191, 191 ) !important;
}

.wallboardBackgroundPaleYellow {
	background-color: rgb( 255, 215, 87 ) !important;
}

/* Column Selector */
.wallboardSelectColumns {
	position: absolute;
	top: 5px;
	right: 5px;
}

/* Box sizes */
.wallboard2Box1, .wallboard2Box1Percent, .wallboard2Box1Time, .wallboard2Box2, .wallboard2Box4, .wallboard2Box51, .wallboard2WidgetBox1, .wallboard2WidgetBox2, .wallboard2WidgetBox4 {
	display: inline-block;
	float: left;
	background-color: #959595;
	margin: 0.3em;
	text-align: center;
	border-radius: 1.25em;
	position: relative;
}

/*
 * Wallboard Box Sizing:
 *
 * Base width: 16.5 em
 * Base space between boxes: 0.3em;
 */

.wallboard2Box1, .wallboard2Box1Percent, .wallboard2Box1Time, .wallboard2WidgetBox1 {
	width: 16.5em;
	height: 16.5em;
}

.wallboard2Box2 {
	width: 33.5em;
	height: 16.5em;
}

.wallboard2WidgetBox2 {
	width: 33.5em;
	height: 16.5em;
}

.wallboard2WidgetBox4, .wallboard2Box4 {
	width: 67.7em;
	height: 16.5em;
}

.wallboard2Box51 {
	width: 84.7em;
	height: 16.5em;
}

.wallboard2CockpitBox1 {
	float: left;
	margin: 0.3em;
	margin-bottom: 2em;
	width: 16.5em;
	height: 20.0em;
	text-align: center;
}


.wallboard2CockpitBox1DivTop {
}

.wallboard2CockpitBox1TextTop {
	max-height: 24%;
	overflow: hidden;
	top: 0;
}

.wallboard2CockpitBox1DivBottom {
}

/* Wallboard divs */

.wallboard2BoxDivTop, .wallboard2Box1DivTop, .wallboard2Box1DivTopPercent, .wallboard2Box1DivTopTime, .wallboard2Box2DivTop, .wallboard2WidgetBox1DivTop, .wallboard2WidgetBox2DivTop {
	height: 32%;
	background: rgba(0, 0, 0, 0.2);
	border-top-left-radius: 1.25em;
	border-top-right-radius: 1.25em;
	overflow: hidden;
}

.wallboard2Box0DivTotal {
	height: 100%;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 1.25em;
	overflow: hidden;
}

.wallboard2BoxDivBottom, .wallboard2Box1DivBottom, .wallboard2Box1DivBottomPercent, .wallboard2Box1DivBottomTime, .wallboard2Box2DivBottom, .wallboard2WidgetBox1DivBottom, .wallboard2WidgetBox2DivBottom {
	height: 68%;
	border-bottom-left-radius: 1.25em;
	border-bottom-right-radius: 1.25em;
	overflow: hidden;
}

.wallboard2TableContainer {
	height: 100%;
	width: 100%;
	position: relative;
}

.wallboard2Table {
	height: 100%;
	width: 100%;
	display: table;
}

.wallboard2TableCell {
	display: table-cell;
}

.awallboard2TableCellRowspan {
	top: 0;
	bottom: 0;
	position: absolute;
}

.wallboard2TableRow {
	height: 50%;
	display: table-row;
}

.wallboard2Col-3 {
	width: 12em;
}

.wallboard2Col-2 {
	width: 6em;
}

.wallboard2Col-1 {
	width: 6em;
}
/* Graph background */
.wallboard2WidgetBox1DivBottom div div canvas.jqplot-series-shadowCanvas {
	background-color: #959595;
}

.wallboard2WidgetBox2DivBottom div div canvas.jqplot-series-shadowCanvas {
	background-color: #959595;
}

/* Canvas */

.wallboard2CanvasSmallTile {
	width: 15em;
	height: 11em;
	position: relative;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
}

.wallboard2CanvasMediumTile {
	width: 31.5em;
	height: 11em;
	position: relative;
}

.wallboard2CanvasLargeTile {
	width: 65em;
	height: 11em;
	position: relative;
}

/* Texts */

.wallboard2Box0Text {
	color: white;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 95%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	font-weight: 400;
	font-size: 2.5em;
	word-wrap:break-word;
}

.wallboard2BoxTextTop, .wallboard2Box1TextTop, .wallboard2Box1TextTopTime, .wallboard2Box2TextTop, .wallboard2WidgetBox1TextTop, .wallboard2WidgetBox2TextTop {
	font-size: 1.8em;
	font-weight: 300;
	padding: 0.66em;
	color: white;
	position: absolute;
	width: 90%;
	top: 16%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

.wallboard2Box1TextTop1p7em {
	font-size: 1.7em;
	font-weight: 300;
	padding: 0.66em;
	color: white;
	position: absolute;
	width: 90%;
	top: 16%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

.wallboard2Box1TextTop1p5em {
	font-size: 1.5em;
	font-weight: 300;
	padding: 0.66em;
	color: white;
	position: absolute;
	width: 90%;
	top: 16%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

.wallboard2Box1TextTopSmall {
	font-size: 1.1em;
	font-weight: 300;
	padding: 0.66em;
	color: white;
	position: absolute;
	width: 90%;
	top: 16%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	text-align: center;
}

.wallboard2BoxTextBottom, .wallboard2Box1TextBottom, .wallboard2Box1TextBottomSmall, .wallboard2Box1TextBottomTime, .wallboard2Box2TextBottom {
	color: white;
	position: absolute;
	top: 65%;
	left: 50%;
	width: 95%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	font-weight: 400;
}

.wallboard2Box5Text {
	color: white;
	font-weight: 400;
	font-size: 2em;
	position: relative;
	top: -0.3em;
}

.wallboard2Box5Positioner {
}

.wallboard2Box5BeamGreen {
	display: inline-block;
	background-color: green;
	height: 3em;
	position: relative;
	top: -1.6em;
}

.wallboard2Box5BeamRed {
	display: inline-block;
	background-color: red;
	height: 3em;
	position: relative;
	top: -1.6em;
}

.wallboard2Box5BeamDarkGrey {
	display: inline-block;
	height: 3em;
	position: relative;
	top: -1.6em;
}

.wallboard2Box5LargeText {
	color: white;
	position: relative;
	top: 0.5em;
	left: 0.3em;
	font-weight: 400;
	font-size: 4.5em;
}

.wallboard2Box1TextBottomHeaderLeft {
	color: white;
	font-weight: 400;
	font-size: 2em;
	top: 45%;
	border-collapse: collapse;
	text-align: left;
	margin-left: 0.2em;
	width: 11em;
}

.wallboard2Box5 {
	display: inline-block;
	float: left;
	background-color: #959595;
	margin: 0.3em;
	border-radius: 1.25em;
	position: relative;
	width: 33.5em;
	height: 16.5em;
}

.wallboard2Box1TextBottomTableBorderGreen {
	border-left: 1em solid #25A825;
}

.wallboard2Box1TextBottomTableBorderRed {
	border-left: 1em solid #AB1616;
}

.wallboard2Box1GraphicBottom {
	height: 10em;
	width: 10em;
}

.wallboard2Box1TextBottomSmall {
	font-size: 3em;
}

.wallboard2Box2TextBottom {
	font-size: 3em;
}

.wallboard2Box1TextBottomTime {
	font-size: 4em;
}

.wallboard2BoxTextBottom, .wallboard2Box1TextBottom {
	font-size: 6em;
}

/*
 * Wallboard Sliders
 */

.wallboardCockpitSlider {
	-webkit-appearance: none;
	width: 100%;
	height: 15px;
	border-radius: 5px;
	background: #d3d3d3;
	outline: none;
	opacity:0.7;
	-webkit-transition: opacity .15s ease-in-out;
	transition: opacity .15s ease-in-out;
}

.wallboardCockpitSlider:hover {
	opacity:1;
}

.wallboardCockpitSlider::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background: #F17735;
	cursor: pointer;
}

.wallboardCockpitSlider::-moz-range-thumb {
	width: 25px;
	height: 25px;
	border: 0;
	border-radius: 50%;
	background: #F17735;
	cursor: pointer;
}

/* **************************************************************************
 *
 * GUI
 *
 * **************************************************************************/

#mainContainerGUI {
	position: fixed;
	top: 0px;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: white;
	z-index: 0;
}

.guiSidebarClassifier {
	background-color: #858585;
	border: none;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	height: 24px;
	text-align: center;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1.2em;
	font-weight: 300;
	text-decoration: none;
}

.guiSidebarClassifierText {
	height: 100%;
	margin: 4px;
	color: white;
	position: relative;
	top: 2px;
}

.guiSidebarImage {
	overflow: hidden;
	border: 1px solid #F5F5F5;
	background-color: #F5F5F5;
	padding: 2px;
	margin: 2px;
}

.guiSidebarImage:hover {
	border: 1px solid #FFCF85;
	background-color: #FFCF85;
	cursor: hand;
}

#guiEditorHeader {
	position: absolute;
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 0;
	height: 38px;
	z-index: 2;
}

.guiEditorHeaderText {
	display: block;
	position: relative;
	background-color: #F17735;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 38px;
	z-index: 2;
	color: white;
	font-size: 2em;
	font-weight: 300;
	text-align: center;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

#guiEditorToolbarContainer {
	background-color: #F2F2F2;
	overflow: hidden;
	position: absolute;
	top: 40px;
	left: 0;
	right: 2px;
	bottom: 0;
	height: 30px;
	white-space: nowrap;
	z-index: 2;
}

#guiEditorSidebarContainer {
	position: absolute;
	top: 70px;
	left: 2px;
	bottom: 34px;
	padding-right: 2px;
	max-width: 172px;
	overflow: auto;
	width: 172px;
	z-index: 2;
	background-color: #F2F2F2;
	border: none;
}

#guiEditorOutlineContainer {
	position: absolute;
	top: 70px;
	right: 2px;
	width: 200px;
	height: 150px;
	z-index: 2;
	overflow: hidden;
	background-color: rgba(255, 255, 255, 0.85);
}

#guiEditorGraphContainer {
	position: absolute;
	top: 70px;
	left: 174px;
	right: 2px;
	bottom: 34px;
	overflow: hidden;
	z-index: 1;
	background: url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAIUlEQVQYV2P8uphBkoEIwAhSyB3L8JyQ2lGFeEOI6OABAO+BHLyIhzfFAAAAAElFTkSuQmCC ) repeat;
}

#guiEditorPropertiesContainer {
	position: absolute;
	top: 50px;
	left: 10px;
	width: 400px;
	visibility: hidden;
}

#guiEditorFooter {
	position: absolute;
	bottom: 2px;
	left: 2px;
	right: 2px;
	background-color: #858585;
	height: 32px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

#guiEditorFooterLeft, #guiEditorFooterMiddle, #guiEditorFooterRight {
	position: relative;
	top: 6px;
	float: left;
	color: white;
	text-align: center;
}

#guiEditorFooterLeft {
	width: 30%;
}

#guiEditorFooterMiddle {
	width: 40%;
}

#guiEditorFooterRight {
	width: 30%;
}

.guiEditorToolbarButton {
	margin-top: 3px;
	margin-left: 3px;
	margin-bottom: 3px;
	background-color: #D6D6D6;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: normal;
	text-decoration: none;
	font-size: 1em;
	height: 24px;
	border-radius: 7px;
	border: none;
}

.guiEditorToolbarButton:hover {
	background-color: #F17735;
	color: white;
}

.guiObjectTitle {
	margin: 0px;
	padding: 0px;
	border: 0px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 1em;
	font-weight: 500;
	color: black;
	width: 120px;
	height: 20px;
	position: relative;
	top: -2px;
	background: rgba(0, 0, 0, 0.2);
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	padding-top: 4px;
}

.guiEditorPropertiesEditorObjectTitle {
	font-size: 1.5em;
	color: black;
	font-weight: bold;
	padding-top: 2px;
	padding-bottom: 2px;
}

.guiEditorPropertiesEditorTitle {
	display: inline-block;
	margin-top: 8px;
	margin-bottom: 4px;
	font-weight: 400;
	font-size: 1.3em;
	color: #0A386C;
	padding-top: 2px;
	padding-bottom: 2px;
}

.guiEditorPropertiesCol1 {
	width: 145px;
}

.guiEditorPropertiesCol2 {
	width: 255px;
}

/* **************************************************************************
 *
 * GUI Working Pane (Drawing Grid)
 *
 * **************************************************************************/

div.mxRubberband {
	position: absolute;
	overflow: hidden;
	border-style: solid;
	border-width: 1px;
	border-color: #0000FF;
	background: #0077FF;
}

textarea.mxCellEditor {
	background: url('../images/transparent.gif');
	border-style: solid;
	border-color: black;
	border-width: 0;
	overflow: auto;
}

div.mxWindow {
	background-color: #F2F2F2;
	border-width: 0;
	position: absolute;
	overflow: hidden;
	border-radius: 15px;
	z-index: 1;
}

table.mxWindow {
	border-collapse: collapse;
	table-layout: fixed;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
}

td.mxWindowTitle {
	background-color: #F17735;
	font-weight: 300;
	color: white;
	font-size: 16pt;
	text-overflow: ellipsis;
	white-space: nowrap;
	text-align: center;
	overflow: hidden;
	height: 13px;
	padding: 2px;
	padding-top: 4px;
	padding-bottom: 6px;
}

td.mxWindowPane {
	vertical-align: top;
	padding: 0px;
}

div.mxWindowPane {
	overflow: hidden;
}

td.mxWindowPane td {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
}

td.mxWindowPane input, td.mxWindowPane select, td.mxWindowPane radio {
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
	padding: 1px;
}

td.mxWindowPane textarea {
	font-family: monospace;
	font-size: 8pt;
	padding: 1px;
}

td.mxWindowPane input {
	padding-left: 6px;
	padding-right: 6px;
}

td.mxWindowPane button {
	background: url('../images/button.gif') repeat-x;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
	padding: 2px;
	float: left;
}

img.mxToolbarItem {
	margin-right: 6px;
	margin-bottom: 6px;
	border-width: 1px;
}

select.mxToolbarCombo {
	vertical-align: top;
	border-style: inset;
	border-width: 2px;
}

div.mxToolbarComboContainer {
	padding: 2px;
}

img.mxToolbarMode {
	margin: 2px;
	margin-right: 4px;
	margin-bottom: 4px;
	border-width: 0px;
}

img.mxToolbarModeSelected {
	margin: 0px;
	margin-right: 2px;
	margin-bottom: 2px;
	border-width: 2px;
	border-style: inset;
}

div.mxTooltip {
	-webkit-box-shadow: 3px 3px 12px #C0C0C0;
	-moz-box-shadow: 3px 3px 12px #C0C0C0;
	box-shadow: 3px 3px 12px #C0C0C0;
	background: #FFFFCC;
	border-style: solid;
	border-width: 1px;
	border-color: black;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
	position: absolute;
	cursor: default;
	padding: 4px;
	color: black;
}

div.mxPopupMenu {
	-webkit-box-shadow: 3px 3px 12px #C0C0C0;
	-moz-box-shadow: 3px 3px 12px #C0C0C0;
	box-shadow: 3px 3px 12px #C0C0C0;
	background: url('../images/window.gif');
	position: absolute;
	border-style: solid;
	border-width: 1px;
	border-color: black;
	cursor: default;
}

table.mxPopupMenu {
	border-collapse: collapse;
	margin-top: 1px;
	margin-bottom: 1px;
}

tr.mxPopupMenuItem {
	color: black;
	cursor: default;
}

td.mxPopupMenuItem.disabled {
	opacity: 0.2;
}

td.mxPopupMenuItem.disabled {
	_filter: alpha(opacity = 20) !important;
}

tr.mxPopupMenuItemHover {
	background-color: #000066;
	color: #FFFFFF;
}

td.mxPopupMenuItem {
	padding: 2px 30px 2px 10px;
	white-space: nowrap;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-size: 8pt;
}

td.mxPopupMenuIcon {
	background-color: #D0D0D0;
	padding: 2px 4px 2px 4px;
}

h1.guiObjectTitle + img {
	width: 32px;
}

/* **************************************************************************
 *
 * Conference
 *
 * **************************************************************************/

.confContainer {
	clear: both;
	margin-top: 2px;
	margin-bottom: 2px;
}

.confMainSubHeaderLine {
	display: block;
	width: 100%;
	font-size: 2em;
	font-weight: 300;
	background-color: #D6D6D6;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	text-align: center;
}

.confSubConfSpaceTop4 {
	padding-top: 4px;
}

.confPartyContainer {
	display: block;
	width: 100%;
}

.confPartyBox {
	float: left;
	margin-right: 4px;
	margin-top: 4px;
	width: 250px;
	overflow: hidden;
	background-color: #E8E8E8;
	border: none;
	border-radius: 15px;
}

.confPartyHeader {
	display: block;
	width: 100%;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	background: rgba(0, 0, 0, 0.2);
	font-size: 1.5em;
	font-weight: 300;
	text-align: center;
}

.confPartyDetails {
	margin: 8px;
	margin-right: 77px;
}

.confPartyDetailsFieldCaption {
	float: left;
	color: black;
	font-weight: bold;
	padding: 0px !important;
}

.confPartyFunctionImage {
	float: left;
	margin-left: 4px;
	margin-top: 10px;
	width: 24px;
	height: 24px;
}

.confPartyDetailsFieldText {
	color: black;
	float: left;
	width: 100px;
	white-space: nowrap;
	overflow: hidden;
	padding: 0px !important;
}

.confPartyImage {
	float: right;
	width: 69px;
	height: 97px;
}

.confPartyImageHandUp {
	-webkit-animation: background_blink 0.75s linear 0s infinite;
	animation: background_blink 0.75s linear 0s infinite;
}

.presentationSlideActive {
	border: 2px solid red;
	float: left;
	margin: 5px;
}

.presentationSlide {
	border: 2px solid #D6D6D6;
	float: left;
	margin: 5px;
}

.presentationSlideImage {
	display: block;
	width: 300px;
}

.presentationSlideText {
	font-weight: bold;
	text-align: center;
}

.presentationSlideFullImage {
	border: 2px solid #D6D6D6;
	margin: 5px;
	height: 100%;
}

.votingTextBoxLeft {
	clear: both;
	float: left;
	margin-right: 12px;
	margin-top: 4px;
	width: 332px;
	margin-bottom: 10px;
	background-color: #E8E8E8;
	border-radius: 15px;
}

.votingTextBoxRight {
	float: left;
	margin-right: 12px;
	margin-top: 4px;
	width: 402px;
	margin-bottom: 10px;
	background-color: #E8E8E8;
	border-radius: 15px;
}

.votingGraphBoxLeft {
	clear: both;
	float: left;
	margin-right: 12px;
	margin-top: 4px;
	width: 332px;
	margin-bottom: 10px;
	background-color: white;
	border-radius: 15px;
}

.votingGraphBoxRight {
	float: left;
	margin-right: 12px;
	margin-top: 4px;
	width: 402px;
	margin-bottom: 10px;
	background-color: white;
	border-radius: 15px;
}

.votingTextBoxTitle {
	display: block;
	background-color: #D6D6D6;
	font-size: 2em;
	font-weight: 300;
	text-align: center;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.votingTextBoxContent {
	display: block;
	font-size: 5em;
	color: #888888;
	text-align: center;
	padding-bottom: 10px;
}

.votingGraph {
	display: inline;
	margin: 10px;
	background-color: white;
}

.dtmfHelpTextBoxLeft {
	clear: both;
	float: left;
	margin-right: 12px;
	margin-bottom: 12px;
	margin-top: 2px;
	width: 95%;
	background-color: #E8E8E8;
	border-radius: 15px;
}

.dtmfHelpTextBoxTitle {
	display: block;
	background-color: #D6D6D6;
	font-size: 2em;
	font-weight: 300;
	text-align: center;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.dtmfHelpTextBoxDtmf {
	display: block;
	font-size: 3em;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 8px;
	color: #888888;
	text-align: center;
}

.dtmfHelpTextBoxHelp {
	display: block;
	font-size: 1em;
	color: black;
	text-align: left;
	position: relative;
	top: -2px;
}

.confPartiesBoxTitle {
	display: block;
	border: 1px solid #D6D6D6;
	background-color: #D6D6D6;
	font-size: 16px;
	text-align: center;
}

.invitationToolPIN {
	width: 82px;
	letter-spacing: 5px;
	padding-left: 8px;
	color: #BB141B
}

.invitationToolInDiallingNumberText {
	font-size: 1.3em;
	color: #0A386C;
	font-weight: bold;
}

.invitationToolInDiallingNumber {
	font-size: 1.3em;
	color: #BB141B;
	font-weight: bold;
}

.invitationToolIndicationOfPrice {
	color: #666666;
	font-size: 1.1em;
}

.confSubconferenceText {
	color: #0A386C;
	font-weight: bold;
}

.confConfStatus {
	color: #0A386C;
	font-weight: bold;
}

.confRecordingPIN {
	color: #0A386C;
	font-weight: bold;
}

.confSpeakRequestsIndicatorText {
	color: #0A386C;
	font-weight: bold;
	text-align: center;
	text-decoration: blink;
}

.confSpeakRequestsIndicatorTextNone {
	text-align: center;
}

.confWaitRoomIndicatorText {
	color: #0A386C;
	font-weight: bold;
	text-align: center;
	text-decoration: blink;
}

.confWaitRoomIndicatorTextNone {
	text-align: center;
}

/* **************************************************************************
 *
 * Connection status
 *
 * **************************************************************************/

.boxModelHeaderElementConnectionStatus {
	width: 30px;
	height: 30px;
	margin-right: 10px;
}

.iceOutConStatInactv, .iceOutConStatActv, .iceOutConStatCaution, .iceOutConStatDisconnect {
	position: absolute;
	top: 0px;
	margin-top: 15px;
	right: 8px;
	height: 28px;
	width: 28px;

	font-size: 3.5px;
	auto;
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	text-indent: -9999em;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
}

.iceOutConStat {
	position: relative;
	top: 0px;
	right: -3px;
	width: 30px;
	height: 30px;
	margin: 0px;
	padding: 0px;
}

.iceOutConStatInactv {
	-webkit-animation: load0 1.3s infinite linear;
	animation: load0 1.3s infinite linear;
}

.iceOutConStatActv {
	-webkit-animation: load1 1.3s infinite linear;
	animation: load1 1.3s infinite linear;
}

.iceOutConStatCaution {
	-webkit-animation: load2 1.3s infinite linear;
	animation: load2 1.3s infinite linear;
}

.iceOutConStatDisconnect {
	-webkit-animation: load3 1.3s infinite linear;
	animation: load3 1.3s infinite linear;
}

/* **************************************************************************
 *
 * Animation for connection status indicator.
 *
 * **************************************************************************/

@-webkit-keyframes load 0 {
0%,
100% {
	box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
	1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
	2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
	1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
	0em	 2.5em	0em	  0em rgba(255, 255, 255, 0.2),
	-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
	-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
	-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
}
}

@keyframes load0 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
}

@-webkit-keyframes load1 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 1.0),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.7),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.5),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 1.0);
	}
}

@keyframes load1 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 1.0),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.7),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.5),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 255, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 255, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 255, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 255, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 255, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 255, 255, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 255, 1.0);
	}
}

@-webkit-keyframes load2 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 1.0),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.7),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.5),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 1.0);
	}
}

@keyframes load2 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 1.0),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.7),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.5),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 255, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 255, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 255, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 255, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 255, 0, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 255, 0, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 255, 0, 1.0);
	}
}

@-webkit-keyframes load3 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 1.0),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.7),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.5),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 1.0);
	}
}

@keyframes load3 {
	0%,
	100% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 1.0),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	 2.5em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.5),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.7);
	}
	12.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.7),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 1.0),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.5);
	}
	25% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.5),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.7),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 1.0),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	37.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.5),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.7),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 1.0),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	50% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.5),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.7),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 1.0),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	62.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.5),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.7),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 1.0),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	75% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.5),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.7),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 1.0),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2);
	}
	87.5% {
		box-shadow:	   0em	-2.6em	0em	  0em rgba(255, 0, 0, 0.2),
		1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 0.2),
		2.5em	   0em	0em	  0em rgba(255, 0, 0, 0.2),
		1.75em	1.75em	0em	  0em rgba(255, 0, 0, 0.2),
		0em	2.50em	0em	  0em rgba(255, 0, 0, 0.2),
		-1.8em	 1.8em	0em	  0em rgba(255, 0, 0, 0.5),
		-2.6em	   0em	0em	  0em rgba(255, 0, 0, 0.7),
		-1.8em	-1.8em	0em	  0em rgba(255, 0, 0, 1.0);
	}
}

/* **************************************************************************
 *
 * Animation for blinking backgrounds on buttons / notifications.
 *
 * **************************************************************************/

@-webkit-keyframes background_blink {
	0%		{ background: #D6D6D6; }
	50%		{ background: #FFFD85; }
	100%	{ background: #D6D6D6; }
}

@keyframes background_blink {
	0%		{ background: #D6D6D6; }
	50%		{ background: #FFFD85; }
	100%	{ background: #D6D6D6; }
}

/* **************************************************************************
 *
 * Sizes
 *
 * **************************************************************************/

.autoWidth {
	width: auto;
}

.fullWidth {
	width: 99%;
}

.fullWidth100 {
	width: 100%;
}

.fullWidth99p999 {
	width: 99.999%;
}

.width95 {
	width: 95%;
}

.width95-dis {
	width: 95%;
}

.width90 {
	width: 90%;
}

.width90-dis {
	width: 90%;
}

.width85 {
	width: 85%;
}

.width85-dis {
	width: 85%;
}

.halfWidth {
	width: 50%;
}

/* em values for widths of input fields */

.em1 {
	width: 1em;
}

.em1p5 {
	width: 1.5em;
}

.em2 {
	width: 2em;
}

.em3 {
	width: 3em;
}

.em4 {
	width: 4em;
}

.em5 {
	width: 5em;
}

.em505 {
	width: 5.7em;
}

.em6 {
	width: 6em;
}

.em605 {
	width: 6.5em;
}

.em7 {
	width: 7em;
}

.em8 {
	width: 8em;
}

.em9 {
	width: 9em;
}

.em10 {
	width: 10em;
}

.em11 {
	width: 11em;
}

.em12 {
	width: 12em;
}

.em13 {
	width: 13em;
}

.em14 {
	width: 14em;
}

.em15 {
	width: 15em;
}

.em16 {
	width: 16em;
}

.em18Input {
	width: 18em;
}

.em193 {
	width: 19.35em;
}

.em20 {
	width: 20em;
}

.em20d7 {
	width: 20.7em;
}

.em2205 {
	width: 22.5em;
}

.em25 {
	width: 25em;
}

.em278 {
	width: 27.8em;
}

.em278-dis {
	width: 27.8em;
}

.em28 {
	width: 28em;
}

.em293 {
	width: 29.3em;
}

.em30 {
	width: 30em;
}

.em32 {
	width: 32em;
}

.em32d7 {
	width: 32.7em;
}

.em35 {
	width: 35em;
}

.em36 {
	width: 36em;
}

.em388 {
	width: 38.8em;
}

.em389 {
	width: 38.9em;
}

.em39 {
	width: 39em;
}

.em40 {
	width: 40em;
}

.em40d6 {
	width: 40.6em;
}

.em45 {
	width: 45em;
}

.em50 {
	width: 50em;
}

.em50p5 {
	width: 50.5em;
}

.em60 {
	width: 60em;
}

.em70 {
	width: 70em;
}

.em80 {
	width: 80em;
}

.em1-dis {
	width: 1em;
}

.em2-dis {
	width: 2em;
}

.em3-dis {
	width: 3em;
}

.em4-dis {
	width: 4em;
}

.em5-dis {
	width: 5em;
}

.em6-dis {
	width: 6em;
}

.em7-dis {
	width: 7em;
}

.em8-dis {
	width: 8em;
}

.em9-dis {
	width: 9em;
}

.em10-dis {
	width: 10em;
}

.em11-dis {
	width: 11em;
}

.em12-dis {
	width: 12em;
}

.em14-dis {
	width: 14em;
}

.em15-dis {
	width: 15em;
}

.em20-dis {
	width: 20em;
}

.em20d7-dis {
	width: 20.7em;
}

.em25-dis {
	width: 25em;
}

.em30-dis {
	width: 30em;
}

.em35-dis {
	width: 35em;
}

.em40-dis {
	width: 40em;
}

.em45-dis {
	width: 45em;
}

.em50-dis {
	width: 50em;
}

.em80-dis {
	width: 80em;
}

.hem1 {
	height: 1em;
}

.hem2 {
	height: 2em;
}

.hem3 {
	height: 3em;
}

.hem4 {
	height: 4em;
}

.hem5 {
	height: 5em;
}

.hem10 {
	height: 10em;
}

.hem20 {
	height: 20em;
}

.hem30 {
	height: 30em;
}

.hem40 {
	height: 40em;
}

.hem5-dis {
	height: 5em;
}

.hem10-dis {
	height: 10em;
}

.hem20-dis {
	height: 20em;
}

.em20Txt {
	width: 20em;
}

.tenPC {
	width: 10%;
}

.twentyFivePC {
	width: 25%;
}

.minTwentyFivePC {
	width: 25%;
	min-width: 25%;
}

.thirtyPC {
	width: 30%;
}

.thirtyThreePC {
	width: 33%;
}

.thirtyFourPC {
	width: 34%;
}

.fortyPC {
	width: 40%;
}

.fortyFivePC {
	width: 45%;
}

.fiftyPC {
	width: 50%;
}

.fiftyFivePC {
	width: 55%;
}

.sixtyPC {
	width: 60%;
}

.seventyPC {
	width: 70%;
}

.seventyFivePC {
	width: 75%;
}

.minSeventyFivePC {
	width: 75%;
	min-width: 75%;
}

.oneHundredPC {
	width: 100%;
}

.minHeight16 {
	min-height: 16px;
}

.em20dialler {
	width: 20em;
}

.em20dialler-dis {
	width: 20em;
	background-color: #E8E8E8;
	border: 1px solid #E8E8E8;
}

.verticalTop {
	vertical-align: top;
}

/* **************************************************************************
 *
 * Spacing
 *
 * **************************************************************************/

.spaceTop0 {
	margin-top: 0px;
}

.spaceTop4 {
	margin-top: 4px;
}

.spaceTop6 {
	margin-top: 6px;
}

.spaceTop8 {
	margin-top: 8px;
}

.spaceTop16 {
	margin-top: 16px;
}

.spaceTop32 {
	margin-top: 32px;
}

.spaceLeft4px {
	margin-left: 4px;
}

.spaceLeft24 {
	margin-left: 24px;
}

.spaceLeft7em {
	margin-left: 7em;
}

.buttonSpacer {
	margin-left: 0.25em;
}

.exceptionInfoBody {
	display: block;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
	width: 100%;
}

/* **************************************************************************
 *
 * Positioning
 *
 * **************************************************************************/

.up1px {
	position: relative;
	top: -1px;
}

.up2px {
	position: relative;
	top: -2px;
}

.up4px {
	position: relative;
	top: -4px;
}

.up8px {
	position: relative;
	top: -8px;
}

.up8px {
	position: relative;
	top: -12px;
}

.down4px {
	position: relative;
	top: 4px;
}

.down8px {
	position: relative;
	top: 8px;
}

.innerSpanDown5px > span {
	position: relative;
	top: 5px;
}

.verticalMiddle {
	vertical-align: middle;
}

.width100pc {
	width: 100%;
}

.width100pc-dis {
	width: 100%;
}

.width99pc {
	width: 99%;
}

.width99pc-dis {
	width: 99%;
}

.width1pc {
	width: 1%;
}

.width1pc-dis {
	width: 1%;
}

/* **************************************************************************
 *
 * Download Area
 *
 * **************************************************************************/

.downloadArea {
	width: calc( 100% - 40px );
	border: 5px dashed #888888;
	margin: 10px;
	height: 100px;
	text-align: center;
}

.downloadAreaText {
	display: inline-block;
	margin-top: 30px;
	font-size: 2em;
	color: #888888;
}

.chatContainer {
	height:100%;
	display: flex;
	flex-direction: row;
}

.chatLeftColumn {
	flex: 1 100%;
	flex-direction:column;
	margin-right: 5px;
	height:100%;
	display: flex;
}

.chatRightColumn {
	flex: 1 100%;
	margin-left: 0px;
}

.chatDisplay {
	width:100%;
	border-radius:0px;
	flex:1;
	overflow-y:auto;
	background-color: white;
	flex-grow:1;
}

.chatComment {
	color:#262626;
	word-wrap: break-word;
	max-width: 400px;
}

/* --------------- autoComplete classes ------ */

.iceSelInpTxtTxt {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #D9D9D9;
	margin-top: 2px;
	padding: 1px;
	font-size: 1em;
	font-family: "Segoe UI",Tahoma,Arial,Sans-Serif,sans-serif;
	width: 100%;
}

.iceSelInpTxtList {
	position: absolute;
	display: block;
	border-top: 1px solid #ABABAB;
	border-right: 1px solid #666666;
	border-left: 1px solid #ABABAB;
	border-bottom: 1px solid #333333;
	font-family: "Segoe UI",Tahoma,Arial,Sans-Serif,sans-serif;
}

.iceSelInpTxtRow {
	display: block;
	background-color: #FFFFFF;
	color: #333333;
	padding: 2px;
	padding-left: 10px;
	border-bottom: 1px solid #DEDEDE;
	position: relative;
	font-family: "Segoe UI",Tahoma,Arial,Sans-Serif,sans-serif;
}

.iceSelInpTxtSelRow {
	display: block;
	background-color: #0067A5;
	color: #FFFFFF;
	padding: 2px;
	padding-left: 10px;
	border-bottom: 1px solid #FFFFFF;
	position: relative;
	font-family: "Segoe UI",Tahoma,Arial,Sans-Serif,sans-serif;
}

.iceSelInpTxtSelRow span {
	color: #FFFFFF;
}

/* The select styling for the new language selector */
/* See https://www.filamentgroup.com/lab/select-css.html for details */

.language-select-css {
	display: block;
	font-size: 12px;
	font-family: "Roboto", "Segoe UI", Tahoma, Arial, Sans-Serif, sans-serif;
	font-weight: 100;
	color: white;
	line-height: 0.8;
	padding-left: 0.5em;
	padding-right: 1.5em;
	width: 100%;
	max-width: 100%;
	height: 2em;
	position: relative;
	top: 6px;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #F17735;
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #F17735;
	background-image: url("css-images/navigate_close_white.svg");
	background-repeat: no-repeat, repeat;
	background-position: right .4em top 50%, 0 0;
	background-size: 1em auto, 100%;
}

.language-select-css::-ms-expand {
	display: none;
}
.language-select-css:hover {
	border-color: white;
}
.language-select-css:focus {
	_border-color: #F17735;
	color: white;
	outline: none;
}
.language-select-css option {
	font-weight:normal;
}

/* TEAMS */

.acdHeaderToolbarTeamsStatus {
	display: block;
	vertical-align: text-bottom;
	border-radius: 4px;
	margin-right: 2px;
}

.acdHeaderToolbarTeamsStatusOn {
	background-color: #575FC2;
	color: white;
}

.acdHeaderToolbarTeamsStatusOff {
	background-color: #AAAAAA;
	color: white;
}

.acdHeaderToolbarTeamsStatus a {
	color: white;
	text-decoration: none;
}

.acdHeaderToolbarTeamsStatus:hover {
	box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.3);
}

.acdHeaderToolbarTeamsStatusText {
	position: relative;
	top: 3px;
	font-weight: bold;
	padding-left: 8px;
	padding-right: 8px;
	font-size: 1.1em;
}

/* Licensing */
.licenseHeaderGroup {
	margin-top: 4px;
	margin-bottom: 8px;
	min-width: 270px;
}

.licenseHeader {
	text-align: center;
	width: 100%;
	height: 1.5em;
	font-size: 1.5em;
	font-weight: 300;
	padding-top: 3px;
	border: none;
}

.licenseTypeHeader {
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

.licenseStatusHeader {
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	margin-bottom: 2px;
}

.licenseWarning {
	padding: 3px;
	border-radius: 6px;
}

/* Tools */

.mainToolsHeaderGroup {
	margin-top: 4px;
	margin-bottom: 8px;
	display: block;
}

.mainToolsHeader {
	text-align: center;
	width: 100%;
	height: 1.5em;
	font-size: 1.5em;
	font-weight: 300;
	padding-top: 3px;
	border: none;
	background-color: #E8E8E8;
	display: block;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}

.mainToolsHeaderText {
	display: block;
	border: 6px solid #E8E8E8;
	padding: 6px;
	text-align: center;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
}

/**
 * Some basic colours for asciidoc formatting
 */
.red {
	color: red;
}

.green {
	color: green;
}

.blue {
	color: blue;
}

.yellow {
	color: yellow;
}

.cyan {
	color: cyan;
}

.magenta {
	color: magenta;
}

.black {
	color: black;
}

.white {
	color: white;
}

table.stretch {
	width: 100%;
}

/*
 * For styling supervisor columns which contain thresholds and CSS.
 */

.columnThresholdsWidgetContainer {
	position: relative !important;
	bottom: 0px;
	right: 0px;
}

.columnThresholdsWidgetContent {
	position: absolute !important;
	bottom: -2px;
	width: 100%;
	height: 4px;
	background-color: rgba(0, 0, 0, 0.25);
}

.tileThresholdsWidgetContainer {
	background: rgba(0, 0, 0, .25);
	border-top-left-radius: 1.25em;
	border-bottom-right-radius: 0.5em;
	width: 16px;
	height: 16px;
	position: absolute !important;
	z-index: 1;
}

/* Current Calls Tiles */
.agentHomeCurrentCallsContainer {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: 4px;
	margin-top: 2px;
	margin-left: 2px;
	margin-right: 2px;
	background-color: #D6D6D6;
	padding: 10px;
	border-radius: 10px;
}

/* Current Calls Tiles Container */
.agentHomeCurrentCallsOuterContainer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 4px;
}

/*
 * For styling opt-in-out display on recordings.
 */
.agentHomeCallRecordingOptInOut {
	font-weight: 600;
	height: 18px;
	margin-left: 15px;
	border-radius: 4px;
	padding: 2px 10px;
}

.agentHomeCallRecordingOptInOut- {
	background-color: #F69176;
	color: black;
}

.agentHomeCallRecordingOptInOut-OPTIN-ACTIVE-IVR {
	background-color: #C8FFE1;
	color: black;
}

.agentHomeCallRecordingOptInOut-OPTIN-ACTIVE-ACD {
	background-color: #C8FFE1;
	color: black;
}
.agentHomeCallRecordingOptInOut-OPTIN-PASSIVE-ACD {
	background-color: #FED361;
	color: black;
}

.agentHomeCallRecordingOptInOut-OPTOUT-ACTIVE-ACD {
	background-color: #EF1818;
	color: white;
}

.agentHomeCallRecordingOptInOut-OPTOUT-PASSIVE-ACD {
	background-color: #FED361;
	color: black;
}

/*
 * AI Assistant Stuff
 */
.boxModelRightColAI {
	height: 100%;
	margin-left: 2px;
}

.aiStatusBar {
	text-align: center;
	padding-top: 2px;
	padding-bottom: 4px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	height: 22px;
	color: white;
	width: 100%;
	display: block;
	background-color: #7d64ff;
}

.aiHeadline {
	font-size: 1.3em;
	font-weight: 300 !important;
}

.aiTranscriptionArea {
	height: 50%;
	margin-bottom: 4px;
	background-color: #E8E8E8;
}

.aiTranscriptionAreaOuterContainer {
	overflow: auto;
	scrollbar-color: #999999 #E8E8E8;
	scrollbar-width: thin;
	display: flex;
	height: calc( 100% - 32px );
	padding: 4px;
	flex-direction: column-reverse;
}

.aiTranscriptionAreaContent {
	padding: 2px;
}

.aiTranscriptionAreaSpeechBubble {
	position: relative;
	text-align: center;
	padding: 8px;
	margin-top: 2px;
	margin-bottom: 10px;
}

.aiTranscriptionAreaSpeechBubble_caller {
	background: #D0D0D0;
	border-top-right-radius: 4px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	margin-right: 50px;
	margin-left: 2px;
}

.aiTranscriptionAreaSpeechBubble_supervisor {
	background: #606060;
	color: white;
	border-top-right-radius: 4px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	margin-right: 50px;
	margin-left: 2px;
}

.aiTranscriptionAreaSpeechBubble_agent {
	background: #C6BEEF;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-bottom-left-radius: 4px;
	margin-left: 50px;
	margin-right: 2px;
}

.aiTranscriptionAreaSpeechBubble:after {
	content: '';
	position: absolute;
	display: block;
	width: 0;
	z-index: 1;
	border-style: solid;
}

.aiTranscriptionAreaSpeechBubble_caller:after {
	border-width: 0 6px 6px 0;
	border-color: transparent #D0D0D0 transparent transparent;
	top: 0;
	left: -5px;
}

.aiTranscriptionAreaSpeechBubble_supervisor:after {
	border-width: 0 6px 6px 0;
	border-color: transparent #606060 transparent transparent;
	top: 0;
	left: -5px;
}

.aiTranscriptionAreaSpeechBubble_agent:after {
	border-width: 6px 0 0 6px;
	border-color: transparent transparent transparent #C6BEEF;
	top: calc( 100% - 6px );
	right: -5px;
}

.aiTranscriptionAreaSpeechBubble_caller.aiTranscriptionAreaSpeechBubble_Negative:before {
	content: '';
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	background-image: url("css-images/error.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	right: -30px;
	top: 0px;
}

.aiTranscriptionAreaSpeechBubble_caller.aiTranscriptionAreaSpeechBubble_Positive:before {
	content: '';
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	background-image: url("css-images/ok.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	right: -30px;
	top: 0px;
}

.aiTranscriptionAreaSpeechBubble_supervisor:before {
	content: '';
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	background-image: url("css-images/teacher_blackboard.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	right: -30px;
	top: 0px;
}

.aiTranscriptionAreaSpeechBubble_agent.aiTranscriptionAreaSpeechBubble_Negative:before {
	content: '';
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	background-image: url("css-images/error.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	left: -30px;
	top: 0px;
}

.aiTranscriptionAreaSpeechBubble_agent.aiTranscriptionAreaSpeechBubble_Positive:before {
	content: '';
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	background-image: url("css-images/ok.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	left: -30px;
	top: 0px;
}

.aiAssistantArea {
	height: 50%;
	background-color: #E8E8E8;
}

.aiAssistantAreaContent {
	padding: 2px;
	overflow-y: auto;
	height: 100%;
}

.supervisorSendAgentHelpStatusBar {
	text-align: center;
	padding-top: 2px;
	padding-bottom: 4px;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
	height: 22px;
	color: white;
	width: 100%;
	display: block;
	background-color: #606060;
}

.supervisorSendAgentHelpHeadline {
	font-size: 1.3em;
	font-weight: 300 !important;
}

.supervisorSendAgentHelpContent {
	padding: 2px;
}

.iceInpTxtArea-SupervisorSendAgentHelpHelp {
	width: calc( 100% - 6px );
	height: 12em;
	margin-right: 2px;
	resize: none;
}

.aiAssistantAreaContent_caller {
	width: 100%;
	background-color: #D0D0D0;
	border-radius: 4px;
	margin-bottom: 2px;
	min-height: 40px;
	padding: 2px 4px;
}

.aiAssistantAreaContent_agent {
	width: 100%;
	background-color: #C6BEEF;
	border-radius: 4px;
	margin-bottom: 2px;
	min-height: 40px;
	padding: 2px 4px;
}

.aiAssistantAreaContent_suggestion {
	width: 100%;
	background-color: #F0F0F0;
	border-radius: 4px;
	margin-bottom: 2px;
	min-height: 40px;
	padding: 2px 4px;
}

.aiAssistantAreaContent_summary {
	width: 100%;
	background-color: #f8d7d7;
	border-radius: 4px;
	margin-bottom: 2px;
	min-height: 40px;
	padding: 2px 4px;
}

.aiAssistantAreaContent_summary_content {
	display: block;
	background-color: white;
	border-radius: 6px;
	padding: 4px;
	margin-top: 4px;
	margin-bottom: 4px;
	width: calc(100% - 14px);
}

.aiAssistantAreaContent_Positive {
	width: 24px;
	height: 24px;
	display: inline-block;
	background-image: url("css-images/ok.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
}

.aiAssistantAreaContent_Negative {
	width: 24px;
	height: 24px;
	display: inline-block;
	background-image: url("css-images/error.svg");
	background-color: transparent;
	background-size: 24px 24px;
	background-repeat: no-repeat;
}

.aiAssistantAreaContent_caller_header, .aiAssistantAreaContent_agent_header, .aiAssistantAreaContent_suggestion_header {
	display: block;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 0.8em;
}

/* Error message by exception */
@keyframes exceptionErrorMessageBlink {
	0% {
		border-color: white;
		background-color: #961A05;
		color: white;
	}
	50% {
		border-color: #961A05;
		background-color: white;
		color: #961A05;
	}
	100% {
		border-color: white;
		background-color: #961A05;
		color: white;
	}
}

.exceptionErrorMessage {
	position: absolute;
	top: 12px;
	right: 12px;
	background-color: #961A05;
	color: white;
	border: 2px solid white;
	border-radius: 5px;
	padding: 4px 8px 4px 8px;
	font-size: 1em;
	animation: exceptionErrorMessageBlink 5s infinite;
	text-decoration: none;
	z-index: 50000;
}

.exceptionErrorMessage:link {
	text-decoration: none;
}
.exceptionErrorMessage:visited {
	text-decoration: none;
}
.exceptionErrorMessage:hover {
	text-decoration: none;
}
.exceptionErrorMessage:active {
	text-decoration: none;
}

.blockPreLine {
	white-space: pre-line;
	display: block;
}