/* CoralVersion:4.9.001.1310 */
/* CoralVersion:4.9.000.5390 */
/* CoralVersion:4.9.000.0944 */

@font-face {
	font-family: 'SalesforceSans-Regular, arial'; /* regular */
	src:url('/fonts/SalesforceSans-Regular, arial.woff') format('woff'),
	url("/fonts/SalesforceSans-Regular, arial.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'SalesforceSans-Bold'; /* bold */
	src:url('/fonts/SalesforceSans-Bold.woff') format('woff'),
	url("/fonts/SalesforceSans-Bold.ttf") format("truetype");
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'SalesforceSans-Light'; /* light */
	src:url('/fonts/SalesforceSans-Light.woff') format('woff'),
	url("/fonts/SalesforceSans-Light.ttf") format("truetype");
	font-weight: 200;
	font-style: normal;
}


/* csdkGauge */
.csdkGauge .data
{
	z-index: 4;
	color: white;
	font-size: 1.5em;
	line-height: 25px;
	transition: all 1s ease-out;
	width:36px;
}
.csdkGauge .data .percent
{
	font-family: 'wellsfargo-bd';
	position:absolute;
	right:0;
}
.csdkGauge .data
{
	color: #6c6c6c;
	font-size:14px;
	display: flex;
	gap: 4px;
}
.csdkGauge .gauges
{
	width: 95px;
	height: 10px;
	position:relative;
}

.csdkGauge.dial .inset
{
	z-index: 3;
	position: absolute;
	background-color: #222;
	width: 250px;
	height: 125px;
	top: 75px;
	margin-left: 75px;
	margin-right: auto;
	border-radius: 250px 250px 0 0;
}

.csdkGauge.progress .inset
{
	display: none;
}

.csdkGauge .obscurer
{
	max-height:16px;
	z-index: 2;
	position: absolute;
	background-color: rgb(255 204 60);
	top: 0%;
	margin-left: auto;
	margin-right: auto;
	transition: all 0.7s ease-in-out;
}
.csdkGauge.scrollEnd:before
{
	transition: all 0.3s ease-in-out 0.5s;
	width:13px;
	height:13px;
	content:'';
	position:absolute;
	left:0px;
	top:3px;
	background:url(../images/tick.svg) center no-repeat;
	background-size:13px;
}
.csdkGauge.scrollEnd .obscurer
{
	background-color:#63B846;
	transition: all 0.7s ease-in-out;
}
.csdkGauge.dial .obscurer
{
	width: 150px;
	height: 200px;
	border-radius: 200px 200px 0 0;
	transform-origin: center bottom;
}
.csdkGauge.progress .obscurer
{
	width: 0%;
	height: 100%;
	border-radius: 3px;
	max-width:95px;
	margin:1px;
}

.detailTopWrapper .csdkGauge {display:none;}

.detailTopWrapper.content .csdkGauge
{
	display:flex;
	overflow: hidden;
	text-align: center;
	color: black;
	position: relative;
	width:174px;
	height:20px;
	align-items:center;
	padding-left:17px;
}

.csdkGauge .backing
{
	width: 95px;
	background: #eeecec80;
	border: 1px solid #eeeeee;
}
.csdkGauge.progress .backing
{
	height: 100%;
	border-radius: 5px;
}

.csdkGauge.dial .backing
{
	height: 200px;
	border-radius: 250px 250px 0 0;
}
/*****************************************************************************************************/
/*csdkNotifiableItem*/

.csdkNotifiableItem span:first-child
{
	all: initial;
	text-align: center;
	/* top: 5%; */
	/* right: 5%; */
	background: red;
	border-radius: 50%;
	line-height: 0.8rem;
	padding: 5px;
	color: white;
	font-size: 0.7rem;
	/* min-height: 2rem; */
	width: 0.8rem;
	height: 0.8rem;
	display: block;
}

.csdkNotifiableItem
{
	all: initial;
	display: flex;
	width: 1.8rem;
	height: 1.8rem;
	background-repeat: no-repeat;
	background-position: center;
	align-items: center;
	text-align: right;
	padding: 0px;
	position: relative;
	/* background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Layer_2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23747474;%7D%3C/style%3E%3C/defs%3E%3Cg id='Layer_1-2'%3E%3Cg%3E%3Cg%3E%3Cpath class='cls-1' d='m8.97,0H1.03C.47,0,0,.47,0,1.03v7.93c0,.57.47,1.03,1.03,1.03h7.93c.57,0,1.03-.47,1.03-1.03V1.03c0-.57-.47-1.03-1.03-1.03Zm-.34,8.97H1.38c-.19,0-.34-.16-.34-.34V1.38c0-.19.16-.34.34-.34h7.24c.19,0,.34.16.34.34v7.24c0,.19-.16.34-.34.34Z'/%3E%3Cpath class='cls-1' d='m8.32,4.63h-1.12l.98-1.62c.1-.17-.02-.45-.22-.45h-1.43c-.21,0-.4.14-.48.33l-.9,2.38c-.07.17.05.4.24.4h1.14l-.55,1.88c-.05.17.17.28.29.14l2.26-2.66c.14-.17.02-.4-.21-.4Z'/%3E%3C/g%3E%3Crect class='cls-1' x='2' y='3.72' width='2' height='1' rx='.19' ry='.19'/%3E%3Crect class='cls-1' x='2' y='5.72' width='2' height='1' rx='.19' ry='.19'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); 
	background-repeat: no-repeat;
	background-size: 15px;
	background-position: center;*/
}


/*createRBGroup*/
.csdkRBGroup
{
	display: flex;
	background-color:rgb(143, 189, 205);
	 -webkit-box-pack: justify;
	justify-content: space-between;
	width: 80%;
	text-align:center;
	padding:2px;
	border-radius:5px;
	margin-left: auto;
	margin-right: auto;
}
.csdkRBGroup input,
.csdkRBGroup input:checked
{
	position:absolute !important;
	visibility:hidden;
}
.csdkRBGroup label
{
	flex:1;
}
.csdkRBGroup label div
{
	padding:10px;
	transition: all 0.2s;
	color: grey;
}
.csdkRBGroup input:checked + div
{
	background-color:white;
	border-radius:3px;
	transition: all 0.2s;
	color: black;
}



/*emojiSelector*/   

.csdkPopOutBoxContent.tl.emojiSelectorContent ::-webkit-scrollbar {
	width: 0.35em;
}
 
.csdkPopOutBoxContent.tl.emojiSelectorContent ::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgb(137 137 137 / 30%);
}
 
.csdkPopOutBoxContent.tl.emojiSelectorContent ::-webkit-scrollbar-thumb {
	background-color: #b9b9b9;
	outline: 1px solid #b9b9b9;
	border-radius:0.25rem
}

div.csdkPopOutBoxContent.tl.emojiSelectorContent:before 
{
	 border-bottom: 7px solid rgb(66 66 66 / 63%);
}


.csdkPopOutBoxContent.emojiSelectorContent
{
	background-color: rgb(66 66 66 / 63%) !important;
	border-radius: 5px;
	backdrop-filter: blur(20px);
}

.csdkPopOutBoxContent.tl.emojiSelectorContent 
{
	padding: 10px;
	height: 192px;
}

.csdkPopOutBoxContent.emojiSelectorContent .csdkTabSet .csdkTabSetHeader
{
	border-bottom: 1px solid rgb(166 166 166 / 30%);
	margin-top: -3px;
	max-height: 30px;
}

.emojiSelector,
.emojiSelectorContent,
.emojiSelectorContent .csdkTab
{
	cursor:pointer;
	display: contents;
}


.emojiSelectorContent .csdkTabL:hover,
.emojiSelectorContent .csdkTabLabel:hover
{
	opacity:0.7;
}

.emojiSelectorContent .csdkTabSet .csdkTabSetContent
{
	margin-top: 5px;
}

.emojiSelectorContent .csdkTabSet .csdkTabSetContent .emojisSection > div
{
	border-radius: 5px;
	text-align: center;
}

.emojiSelectorContent .csdkTabSet .csdkTabSetContent .emojisSection > div:hover
{
	opacity:0.7;
}

.emojiSelectorContent .csdkTabSet .csdkTabSetContent .emojisSection > div.clicked
{
	background-color: rgba(4, 4, 4, 0.35);
}

.emojiSelectorContent .csdkTabSet .csdkTab .csdkTabLabel
{
	visibility: hidden;
	width: 17px;
	padding: 4px;
	border: none;
	height: 20px;
}
.emojiSelectorContent .csdkTabLabel.emotion:before { visibility:visible; content:"❤️"; }
.emojiSelectorContent .csdkTabLabel.recent:before  { visibility:visible; content:"🕒"; }
.emojiSelectorContent .csdkTabLabel.smileys:before { visibility:visible; content:"😀"; }
.emojiSelectorContent .csdkTabLabel.body:before    { visibility:visible; content:"👍"; }
.emojiSelectorContent .csdkTabLabel.clothing:before{ visibility:visible; content:"🧢"; }
.emojiSelectorContent .csdkTabLabel.animals:before { visibility:visible; content:"🐵"; }
.emojiSelectorContent .csdkTabLabel.plants:before  { visibility:visible; content:"🌻"; }
.emojiSelectorContent .csdkTabLabel.fruit:before   { visibility:visible; content:"🍉"; }
.emojiSelectorContent .csdkTabLabel.food:before    { visibility:visible; content:"🍔"; }

.emojiSelectorContent .emojisSection
{
	display: grid;
	grid-template-columns: repeat(auto-fill,25px);
	font-size: 15px;
	grid-gap: 2px;
	-webkit-user-select: none;
	max-height: 160px;
	overflow: auto;
	width: 100%;
}


/*HTML Editor*/   


.csdkHTMLEditorDebugHeader 
{
	font-family: SalesforceSans-Regular, arial;
}

.csdkHTMLEditorRemoteDebug {
	font-size: 11px;
	margin: 10px;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .select.fontSelect {
    padding: 20px !important;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor > select.fontSelect,
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor > select.fontSize{
	color: var(--colorTextDefault);
	white-space: nowrap;
	overflow-x: hidden;
	text-overflow: ellipsis;
	margin-top: 4px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	font-size: 13px;
	width: inherit;
	padding: 9px 6px;
	height: inherit;
	background: url(../images/arrowDown.svg) no-repeat calc(100% - 8px) center, #fff;
	background-size: 6px;
	cursor: pointer;
	border: 1px solid #dfdfdf;
	border-radius: 0.25rem;
	min-width: 60px;
	height: 40px;
	color: #000;
	font-size: 13px;
	padding-left: 15px;	
	font-family: SalesforceSans-Regular, arial;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor > select.fontSelect
{
	width:150px;
	padding-left: 15px;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor .csdkPopOutBox
{
	    margin-right: 6px;
    padding: 6px 6px;
    border: 1px solid #dfdfdf;
    margin-left: 1px;	
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor .csdkPopOutBox.emojiPopout
{
	margin: 5px 20px 5px 15px !important;
	position: relative;
	top: 1.5px;
	border: 1px solid #dfdfdf;
	padding: 5px 6px;		
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor .justifyRadioSet
{
	position:relative;
	top:1px;
	border: 1px solid #dfdfdf;
}




.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].boldToggle + span, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].italicToggle + span, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].underlineToggle + span, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].strikeToggle + span
{
	border: 1px solid #dfdfdf;
	padding: 5px 6px;
	margin-right: 6px;
}




.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].boldToggle, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].italicToggle, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].underlineToggle, 
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteTools .csdkHTMLEditor input[type="checkbox"].strikeToggle
{
     margin-right: 6px;
     padding: 6px 8px !important;
}

.csdkPopOutBoxContent .emojiSelectorContent
{
	display: flex;
	width: 585px;
	flex-wrap: wrap;
	font-size: 14px;
}

.csdkRemoteEditorWrapper
{
	height: calc(100% - 84px);
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug .csdkHTMLEditorDebugHeader .stackItem.selected
{
	background-color:rgba(0, 255, 255, 0.17);
}
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug .csdkHTMLEditorDebugHeader .stackItem
{
	border-bottom:1px solid black;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug .csdkHTMLEditorDebugHeader .stackItemHTML
{
	border:0.5px solid red;
	border-radius:5px;
	min-height:10px;
	margin:3px;
	text-wrap:wrap;
}
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug .csdkHTMLEditorDebugHeader .stackItemText
{
	border:0.5px solid green;
	border-radius:5px;
	min-height:10px;
	margin:3px;
	text-wrap:wrap;
}

.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug ul
{
	padding: revert;
	margin: unset;
}
.csdkRemoteEditorWrapper .csdkHTMLEditorDiv,
.csdkRemoteEditorWrapper .csdkHTMLEditorRemoteDebug
{
	color:black;
	width:100%;
	height:100%;
	display: inline-block;
	vertical-align: top;
}

.csdkRemoteEditorWrapper.debug .csdkHTMLEditorDiv,
.csdkRemoteEditorWrapper.debug .csdkHTMLEditorRemoteDebug
{
	width:48%;
}

#csdkHTMLEditorRemoteTools
{
	
}

.csdkRemoteEditorWrapper .csdkHTMLEditorDiv
{
	position: relative;
	top: 42px;
	font-family: unset;
}
.csdkHTMLEditorDiv
{
	border: 1px solid lightgray;
	padding: 10px;
	margin: 10px;
	font-family: arial ;
	text-decoration: unset ;
	font-style: unset ;
	font-size: 10px;
	width: calc( 100% - 40px );
	min-height: calc( 100% - 40px);
	display: inline-block;
}
/*DO NOT CHANGE HERE*/
.csdkHTMLEditorDiv p:not(DIV[signature="true"] p)
{
/*	margin-top:0;
	margin-bottom:0; */
}
.csdkHTMLEditorDiv li
{
	display:list-item !important;
}
/*DO NOT CHANGE HERE END*/

#editor div,
#editor span
{
	color: unset;
	font-family: unset;
}
#editor ul
{
	padding:revert;
	margin:unset;
}
#editor h1,
#editor h2
{
	text-shadow: none;
	font-size:unset;
}

/* Email Jun13 get rid of important for DKB Email issue  font-family: unset !important;
text-decoration: unset !important; font-style: unset !important;*/

.csdkHTMLEditor SPAN.boldToggle.selected,
.csdkHTMLEditor SPAN.italicToggle.selected,
.csdkHTMLEditor SPAN.underlineToggle.selected,
.csdkHTMLEditor SPAN.strikeToggle.selected
{
	border: 1px solid red;
}

.csdkHTMLEditor
{
	display: flex;
	align-items: center;
	transform: scale(0.8);
	position: absolute;
	left: -51px;
	opacity:1;
	z-index:500;
}
.inactive .csdkHTMLEditor
{
	opacity: 0.5;
}

.csdkHTMLEditor > select,
.csdkHTMLEditor > div,
.csdkHTMLEditor > input
{
	margin-right:5px;
	padding:10px 15px;
}

.csdkHTMLEditor > select.fontSize
{
	width:60px;
}
.csdkHTMLEditor .csdkPopOutBox input
{
	width: 25px;
	border: none;
	height: 24px;
	cursor:pointer;
}
.csdkHTMLEditor span.italicToggle
{
	background: url(../images/htmlEditorItalic.svg) no-repeat center;
	background-size:  8px;
	padding:5px 8px;
	margin-left:-42px;
}
.csdkHTMLEditor span.underlineToggle
{
	background: url(../images/htmlEditorUnderline.svg) no-repeat center ;
	background-size:  13px;
	padding:5px 8px;
	margin-left:-42px;
}
.csdkHTMLEditor span.strikeToggle
{
	background: url(../images/htmlEditorCross.svg) no-repeat center;
	background-size:  14px;
	padding:5px 8px;
	margin-left:-42px;
}
.csdkHTMLEditor span.boldToggle
{
	background: url(../images/htmlEditorBold.svg) no-repeat center;
	background-size:  11px;
	padding:5px 8px;
	margin-left:-42px;
}
.csdkHTMLEditor .csdkPopOutBox.emojiPopout {margin: 0 24px !important;} 
.csdkHTMLEditor .csdkPopOutBox.emojiPopout input
{
	background: url(../images/htmlEditorEmoji.svg) no-repeat center;
	background-size:  22px;
}
.csdkHTMLEditor .csdkPopOutBox.backgroundPopout input
{
	background: url(../images/htmlEditorBg.svg) no-repeat center;
	background-size: 25px 24px;
}
.csdkHTMLEditor .emojiSelectorContent button
{
	border: none;
	background: white;
	margin: 2px 2px 0 0;
	font-size:20px;
}
.csdkPopOutBoxContent .colorSelectorContent
{
	width: 164px;
	border: none;
	height: -webkit-fill-available;
	display: flex;
	flex-wrap: wrap;
	padding: 4px 10px;
}
.csdkPopOutBoxContent .colorSelectorContent button
{
	width: 26px;
	height: 20px;
	border: none;
	margin: 1px 0 0 1px; 
}
.csdkPopOutBoxContent .colorSelectorContent button.white,
.csdkPopOutBoxContent .colorSelectorContent button.transparent
{
	border:1px solid lightgray;
	background:transparent;
	position:relative;
}
.csdkPopOutBoxContent .colorSelectorContent button.transparent::after
{
	position:absolute;
	content:'';
	border-bottom: 1px solid red;
	-webkit-transform: translateY(-19px) translateX(4px) rotate(37deg);
	width: 30px;
	height:20px;
	left: -1px;
}
.csdkHTMLEditor #redoButton,
.csdkHTMLEditor #undoButton,
.csdkHTMLEditor > span,
.csdkHTMLEditor > div
{
	border: 1px solid lightgray;
	border-radius: 4px;   
	padding:5px 7px;    
	margin-top: 3px;
	width:25px;
	height: 25px;
	margin-right: 5px;
}
.csdkHTMLEditor .undoRedoSet
{
	display:none;
}
.csdkHTMLEditor .undoRedoSet.active
{
	display:block;
	border: none;
	width: fit-content;
	margin-left: 9px;
	padding: 0;
	margin-top: -17px;
}
.csdkHTMLEditor #redoButton,
.csdkHTMLEditor #undoButton
{
	background: url(/images/undoEmail.svg) center 45% no-repeat, #fff !important;
	background-size: 14px !important;
	color: transparent;
	font-size: 0;
	width: 40px;
	height: 36px;
	margin-right: 0;
}
.csdkHTMLEditor #redoButton
{
	background: url(/images/redoEmail.svg) center 45% no-repeat, #fff !important;
	background-size: 14px !important;
	margin-left:5px;
}

.csdkHTMLEditor #redoButton:disabled,
.csdkHTMLEditor #undoButton:disabled
{
	background-color: #c3c3c3 !important;
	opacity: 0.3;
	border: 1px solid #767676;
}

.csdkHTMLEditor .justifyRadioSet
{
	width:90px;
	display:flex;
	padding: 5px 10px 5px 2px;
	margin-top:0;
	cursor:pointer;
}
.csdkHTMLEditor .justifyRadioSet span.right
{
        background: url(../images/htmlEditorRight.svg) no-repeat center;
        background-size:  22px;
}
.csdkHTMLEditor .justifyRadioSet span.centre
{
        background: url(../images/htmlEditorCenter.svg) no-repeat center;
        background-size:  22px;
}
.csdkHTMLEditor .justifyRadioSet span.left
{
        background: url(../images/htmlEditorLeft.svg) no-repeat center;
        background-size:  22px;
}
.csdkHTMLEditor .justifyRadioSet span
{
        width: 25px;
        border: none;
        height: 24px;
}
.csdkHTMLEditor input[type="radio"].centre,
.csdkHTMLEditor input[type="radio"].right,
.csdkHTMLEditor input[type="radio"].left
{
	width: 34px;
	height: 24px;
	margin-right: -28px;
	opacity: 0;
}
input[type="checkbox"].boldToggle,
input[type="checkbox"].italicToggle,
input[type="checkbox"].underlineToggle,
input[type="checkbox"].strikeToggle
{
	width: 35px;
	height: 30px;
	opacity: 0;
	padding:18px 20px;
	margin:0;
}

/*HTML Editor END*/   
/*draggable Boxes*/   
div.csdkFullScreen
{
	z-index: 9999; 
	width: 100% !important;
	height: 100% !important;
	max-width: unset !important;
	max-height: unset !important;
	min-width: unset !important;
	min-height: unset !important;
	position: fixed; 
	top: 0; 
	left: 0; 
}
.csdkBoxesWrapper
{
        /*
        display: -ms-grid;
        -ms-grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        -ms-grid-gap: 10px;
        -ms-grid-auto-rows: minmax(180px, max-content);
        -ms-grid-auto-flow: dense;
	*/
        display: flex;
        /* grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); */
        /* grid-gap: 10px; */
        /* grid-auto-rows: minmax(180px, auto); */
        /* grid-auto-flow: dense; */
        /* padding: 10px; */
        border-width: 1px 0 0 0;
        margin-top: -2px;
	overflow-x:hidden;
        }
.csdkBoxesWrapper.statisticContentWrapper
{
        -ms-grid-auto-rows: minmax(120px, min-content);
        grid-auto-rows: minmax(120px, auto);
	display:block;
}
.csdkBoxesWrapper.csdkTabSetHeader
{
	display:flex;
	padding: 0px;
	border-width: 0px 0 0 0;
}
.csdkBoxesWrapper .csdkTabLabel.csdkEditableDivision:focus
{
	outline:none;
}
.csdkBoxesWrapper.csdkTabSetHeader .csdkTab,
.csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper .csdkTabLabel
{
	width:100%;
	text-align: center;
}
.csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper .csdkTabLabel
{
	border-width: 1px 1px 1px 1px;
	white-space:nowrap;
	padding:10px 0 !important;
}
.csdkTabSet .csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper.selected .csdkTabLabel
{
	background: #fff;
	border-width: 1px 1px 0 1px;
	color: rgb(224, 46, 46);
	border-top: 3px solid;
}
.csdkTabSet .csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper.selected:first-child .csdkTabLabel
{
	border-width: 1px 1px 0 0px;
}
/*comment out for now, unsure which part we need this bit (anna)
.csdkTabSet .csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper:first-child .csdkTabLabel
{
	border-left: none;
	border-width: 1px 1px 1px 0;
}
*/
.csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper
{
	border:none !important;
}
.csdkBoxesContentWrapper
{
        font-size: 14px;
        font-weight: bold;
        position:relative;
        text-transform: uppercase;
        color: #414142;
        /* border:1px solid lightgray; */
        background-color: #fff;
                &:nth-child(
        odd) {
                    /* background-color: #424242; */}
}
.csdkBoxesContentWrapper.chartPart,
.csdkBoxesContentWrapper.valuePart
{
	border:none;
}

.csdkBoxesContentWrapper.medium .statisticContentWrapper
{
	height: 400px;
	overflow-y:auto;
}
.csdkBoxesContentWrapper.long .statisticContentWrapper
{
	height: 580px;
	overflow-y:auto;
}
.csdkBoxesContentWrapper.section .statisticContentWrapper,
.csdkBoxesContentWrapper.large .statisticContentWrapper
{
	height: 405px;
	overflow-y:auto;
}
.csdkBoxesContentWrapper.small .statisticContentWrapper
{
	height: 115px;
	overflow-y:auto;
}
.csdkBoxesContentWrapper.small
{
        -ms-grid-column-end: span 1;
        -ms-grid-row-end: span 1;
        grid-column-end: span 1;
        grid-row-end: span 1;
}
.csdkBoxesContentWrapper.medium
{
        -ms-grid-column-end: span 1;
        -ms-grid-row-end: span 2;
        grid-column-end: span 1;
        grid-row-end: span 2;
}
.csdkBoxesContentWrapper.long
{
        -ms-grid-column-end: span 1;
        -ms-grid-row-end: span 3;
        grid-column-end: span 1;
        grid-row-end: span 3;
}
.csdkBoxesContentWrapper.section,
.csdkBoxesContentWrapper.large
{
        -ms-grid-column-end: span 2;
        -ms-grid-row-end: span 2;
        grid-column-end: span 2;
        grid-row-end: span 2;
}

.csdkBoxesContentWrapper.source.over.phantom,
.csdkBoxesContentWrapper.source.over
{
        background: #e6e7e8;
        border:2px dashed #bcbec0;
}
.csdkBoxesContentWrapper.source.over:before
{
        position:absolute;
        content:"Drag your widget here";
        color: rgb(224, 46, 46);
	background: rgba(250, 250, 250, 0.9);
        width: 100%;
        height:100%;
        font-size:14px;
        text-align: center;
}
.csdkBoxesWrapper.csdkTabSetHeader .csdkBoxesContentWrapper.source.over:before
{
        content:"";
	background:transparent;
	border-right: 3px solid pink;
}
.csdkTabSet .csdkTabAddButton,
.csdkTabSet .csdkTabRemoveButton
{
	display:none;
}
/*draggable Boxes END*/   

/* DATE PICKER NEED MORE WORK ON THIS **/   
.csdkDatePickerPopOut .csdkPopOutBoxContent 
{
	padding:0 !important;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .singleDatePicker .calenderRight
{
	display:none;
}
.csdkDatePickerInput 
{
	color: rgb(82, 82, 82);
}

.csdkDatePickerPopOut .csdkDatePickerInput 
{
	position: absolute;
	top: 9px;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button
{
	background: url(../images/save.svg) no-repeat 13px center;
	border: 2px solid #ef4356;
	padding: 5px 15px 5px 32px;
	background-size: 14px 14px;
	font-weight: bold;
	font-size: 12px;
	color: #333;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:last-child
{
	background: none;
	border: 2px solid gray;
	padding: 5px 15px;
	margin-left: 8px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:disabled
{
	filter: grayscale(1);
	opacity: 0.5;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:hover {opacity:0.7;}
.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:active {opacity:1;}

.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv
{
	border-top: 1px solid #e4e4e4;
	padding:10px;
	justify-content: flex-end;
	align-items: center;
	font-weight: bold;
	padding-top: 31px;
	position: relative;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv
{
	position:relative;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders + .timePickerDiv
{
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders.timePicker + .timePickerDiv
{
	height: 44px;
	border-top: 1px solid #e4e4e4;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding: 4px 0 14px 4px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders.timePicker.singleTimePicker + .timePickerDiv
{
	height: 29px !important;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .content
{
	flex-direction: column;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv,
.csdkDatePickerPopOut .csdkPopOutBoxContent .content,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div
{
	display:flex;
	font-family:arial;
	font-size:12px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .timePickerDiv
{

}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .rightDiv
{
	flex-direction: column;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderLeft {border-right: 1px solid #e4e4e4;}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderLeft,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderRight
{
	max-width: 234px;
	width: 234px;
	padding: 8px 12px 8px 8px;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges .csdkRow.selected
{
	background: url(../images/icon_arrowRight.svg) no-repeat -2px center;
	padding-left: 12px;
	background-size: 11px 11px;
	font-weight: bold;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges .csdkRow
{
	line-height: 28px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges
{
	flex:1;
	padding: 8px 13px;
	border-right: 1px solid #e4e4e4;
	max-width: 120px;
	min-width: 120px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges.is-hidden
{
	display:none;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .calenders
{
	flex:6;
	margin-bottom:0;
}


.csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker.timePicker .calenderLeft
{
	border-right: none;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker.timePicker + .timePickerDiv 
{
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleTimePicker + .timePickerDiv .csdkTimePickerWrapper:last-child
{
	display:none;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker + .timePickerDiv .csdkTimePickerWrapper:last-child
{
	margin-left:3px;
} 
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right
{
	display:flex;
	flex-wrap: wrap;
	padding: 10px 5px 10px 13px;
	position:relative;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton
{
	position: absolute;
	background: url(../images/datePickerArrowLeft.svg) no-repeat center;
	background-size: 30px;
	border: 1px solid lightgray;
	width: 30px;
	height: 25px;
	top: 18px;
	left: 12px;
	    z-index: 10;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton
{
	position: absolute;
	background: url(../images/datePickerArrowRight.svg) no-repeat center;
	background-size: 30px;
	border: 1px solid lightgray;
	width: 30px;
	height: 25px;
	top: 18px;
	right: 12px;
	    z-index: 10;
}


.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton:hover
{
	opacity: 0.7;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton:active,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton:active
{
        opacity: 0.5;                                                                                  
}


.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left div:nth-child(2),
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right div:nth-child(1)
{
	flex-basis: 100% !important;
	font-weight:bold;
	font-size: 15px;
	color: #ef4356;
	margin-bottom: 9px;
}

.left.quickSwitchMonth .csdkDatePickerMandY,
.left.quickSwitchMonthAndYear .csdkDatePickerMandY
{
    margin-bottom: 0 !important;
    }

.calenders .quickSwitchMonth  button.previousButton + div,
.calenders .quickSwitchMonthAndYear button.previousButton + div
{
    font-size: 16px !important;
    letter-spacing: -0.05rem;
    line-height: 28px;
}

.calenders .quickSwitchMonth  button.previousButton + div select,
.calenders .quickSwitchMonthAndYear button.previousButton + div select 
{
	background: transparent;
	position: relative;
	border: 0px;
	color: var(--main-color-pink);
	font-size: 15.5px;
	font-weight: bold;
	margin: 0;
	padding: 0 10px 3px 4px;
	letter-spacing: -0.03rem;
	text-align: center;
	top: -4px;
}

.calenders .quickSwitchMonth button.previousButton + div select {
	position: relative;
	padding-left: 0;
}

.calenders .quickSwitchMonth button.previousButton + div select + span.textYear {
	color: var(--main-color-pink);
	font-size: 15.5px;
	font-weight: bold;
	position: relative;
	top: -3px;
	left: -2px;
}

select.csdkDatePickerQuickSwitcher.switchYear 
{
	position: relative;
	top: 1px;
}



.calenders .quickSwitchMonth  button.previousButton + div select:hover,
.calenders .quickSwitchMonthAndYear button.previousButton + div select:hover
{
    background: url(../images/icon_arrowDown.svg) no-repeat;
    background-color:#cccccc47;
    background-position: calc(100% - 2px);
    background-size: 6px;

}

.quickSwitchMonth {
    position: relative;
}

.csdkDatePickerMandY 
{
	top: 5px;
	position: relative;
	margin-bottom: 9px;
	letter-spacing: -0.02rem;
}

.calenders .quickSwitchMonthAndYear button.previousButton + div select:first-child,
.calenders .quickSwitchMonth button.previousButton + div select
{
	position: relative;
	left: -9px;
	top: -4px;
}

.calenders .quickSwitchMonthAndYear button.previousButton + div select.csdkDatePickerQuickSwitcher.switchYear {
	position: relative;
	left: -7px;
}

.calenders .quickSwitchMonthAndYear button.previousButton + div select,
.calenders .quickSwitchMonth button.previousButton + div select{
    background: url(../images/icon_arrowDown.svg) no-repeat;
    background-position: calc(100% - 2px);
    background-size: 6px;
}


.left.quickSwitchMonth .switchMonth {
    margin: 0;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .cmonth.irange + .cmonth:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange
{
	border-top-right-radius: 13px;
	border-bottom-right-radius: 13px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.irange:hover
{
	border-radius: 0 !important;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.today:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange:hover
{
	border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.past.srange:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.today:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange
{
	border-top-left-radius: 13px;
	border-bottom-left-radius: 13px;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate.singleDatePicker .cmonth:hover
{
	border-radius: 13px !important;
}
#datePicker2Ref .csdkDatePickerInput
{
	background: url(../images/calendar.svg) 9px center no-repeat;
	background-size: 18px;
	border: 1px solid lightgray;
	padding: 6px 10px;
	width: min-content;
	margin: 10px;
	font-weight: bold;
	color: #ef4356;
	padding-left: 34px;
}
#datePicker2Ref .csdkDatePickerInput:hover {opacity:0.5;}
#datePicker2Ref .csdkDatePickerInput:active {opacity:1;}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange
{
	color: #fff;
}

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .cmonth:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders:hover .cmonth.irange
{
	background: #828282;
	color: #fff;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .cmonth.erange:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .cmonth.srange:hover,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange
{
	background: #595959;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .irange
{
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange
{
	background: #828282;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .csdkDatePickerDOW
{
	font-weight:bold;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .today
{
	font-weight:bold;
	color: #ef4356;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left div,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right div
{
	flex-basis: 30px;
	padding:6px 0;
	text-align:center;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .irange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .erange
{
	opacity:1 !important;
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.outofbounds
{
	opacity:0.3;
	pointer-events: none;
	background:repeating-linear-gradient(  45deg,  #c8c8c8,  #c8c8c8 10px,  #c8c8c894 10px,  #c8c8c894 20px);
}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.irange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.erange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.srange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.irange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.erange,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth,
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth
{
	opacity:0.4 !important;
}
.csdkRow.csdkDatePickerRow .csdkCell > div {
	position: relative;
}

.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow select
{
	display: none;
	padding: 2px 12px 2px 2px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-position: 23px;
	background-size: 7px 18px;
}

.csdkRow.csdkDatePickerRow .csdkCell {
	max-width: 43px; 
}

.csdkRow.csdkDatePickerRow .csdkCell:first-child {
        max-width: 57px; 
}

.csdkRow.csdkDatePickerRow .csdkCell > div span {
	border: 1px solid #e6e7e8;
	padding: 4px 10px;
	display: block;
}

.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerYear:hover select,
.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerMonth:hover select,
.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerDay:hover select
{
	display: block;
	position: absolute;
	left: 0px;
	top: -3px;
	border: 0;
	background-color: #eee;
}

.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerHours:hover select,
.csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerMinutes:hover select
{
	background-position: 17px;
	background-size: 7px 18px;
	z-index: 100;
}

/* TIME PICKER  **/
.csdkTimePickerWrapper .csdkTimePickerIcon {
	background: url(../images/time.svg) no-repeat;
	width: 15px;
	height: 15px;
	display: inline-block;
}

.csdkTimePickerWrapper
{
	color: #424143;
	font-family: arial;
	position: relative;
	font-size: 12px;
	transition: all 0.7s ease;
	flex-basis:120px;
}

.csdkTimePickerWrapper:last-child {margin-left: 28px;}

.timePickerDiv .csdkTimePickerIcon::before
{
	content: "Start";
	position: absolute;
	width: 50px;
	height: 10px;
	top: -21px;
	left: 50px;
	color: #919292;
	font-family: roboto;
}
.timePickerDiv .csdkTimePickerWrapper:last-child .csdkTimePickerIcon::before
{
	content: "To";
	left: 59px;
}
.singleTimePicker + .timePickerDiv .csdkTimePickerIcon::before
{
	content:"";
}
/*
.singleTimePicker + .timePickerDiv .csdkTimePickerWrapper.csdkDatePickerLTimePicker
{
	margin-left: 40px;
}
*/
.csdkDatePickerLTimePicker.csdkFilterGenTimer:before,
.singleTimePicker + .timePickerDiv .csdkDatePickerLTimePicker:before
{
	display:none;
}
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow {
	display: flex;
	position: absolute;
	width: 90px;
	border: 1px solid #dfdfdf;
	overflow: hidden;
	height: 20px;
	margin-left: 5px;
	padding: 1px 2px ;
	top: -4px;
	width: 95px;
	opacity: 1;
	overflow: visible;
}

.csdkTimePickerWrapper .csdkTimePickerIcon + .csdkRow.csdkTimePickerRow {
	margin-left: 20px;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow select
{
	display: none;	
	padding: 2px 12px 2px 2px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-position: 23px;
	background-size: 7px 18px;
	border: 0px;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMeridiem
{
	position: relative;
	align-self: center;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:after {
	content: ' : ';
	position: absolute;
	display: inline-block;
	top: -1px;
	width: 3px;
	height: 20px;
	margin-left: 5px;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkCell
{
	justify-content: center;	
	overflow: visible;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkCell:last-child
{
	justify-content: left;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:hover span,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes:hover span,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds:hover span,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMeridiem:hover span
{
	font-size:12px;
}


.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:hover select,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes:hover select,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds:hover select,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMeridiem:hover select
{
	display: block;
	position: absolute;
	border: 0;
	background-color: #eee;
	border: 1px solid #d3d3d37a;
	top: -9px;
	left:-8px;
}

.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:hover select,
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes:hover select
.csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds:hover select
{
	background-position: 17px;
	background-size: 7px 18px;
	z-index: 100;
}



/* IMAGE UPLOADER **/
.csdkImageUploadWrapper .csdkCell
{
	justify-content:center;
	overflow: unset;
}

.csdkImageUploadWrapper .csdkRow.vertical
{
	height:100%;
}

.csdkImageUploadWrapper.highlight
{
	background-color: #90cfee26;
}
.csdkImageUploadWrapper
{
	color: #424143;
	vertical-align: middle;
	border-radius: 5px;
	margin: 5px;
}

.csdkImageUploadWrapper .csdkTableBody .csdkRow .csdkCell:last-child
{
	position: absolute;
}

.csdkImageUploadWrapper progress
{
	visibility: hidden;
	position: absolute;
}

.csdkImageUploadWrapper .csdkTableBody .csdkRow .csdkCell
{
	
}

.csdkImageUploadImage
{
	max-height: 145px;
	max-width: 145px;
	justify-self: center;
	align-self: center;
}
.csdkImageUploadImageDivSpan
{
	position:absolute;
	font-size: 12px;
	font-family: arial;
	justify-self: center;
	align-self: center;
}
.csdkImageUploadImageDiv
{
	position:relative;
	min-height: 150px;
	min-width: 150px;
	max-height: 150px;
	max-width: 150px;
	padding: 10px;
	margin: 10px;
	border-radius: 5%;
	border: 2px dashed #dbdbdb;
	display: grid;
}
.csdkImageUploadInputLabel
{
	background-color: white;
	box-sizing: border-box;
	color: #333;
	display: inline-block;
	padding: 5px 15px 5px 30px;	
	text-align: center;
	font-size: 12px;
	font-family: arial;
	border: 1px solid #ee3e54;	
	background: url(../images/upload.svg) no-repeat;
	background-size: 14px;
	background-position: 9px 4px;
}
.csdkImageUploadInput
{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.csdkImageUploadInput:focus + .csdkImageUploadInputLabel,
.csdkImageUploadInputLabel:hover
{
	background-color: #ee3e54;
	cursor: pointer;
	background-color: #ececec;
	transition: all 0.7s ease;
}

/****************************************************************************/
/* Timer                                                                    */
/****************************************************************************/
.csdkTimer
{
	overflow: hidden;
}
.csdkTimerCell.divider
{
	width: 0.2em;
}
.csdkTimerCell
{
	line-height: 20px;
	display: inline-block;
	height: 20px;
	width: 0.5em;
	position: relative;
	vertical-align:top;
}
.csdkTimer
{
	background: url(../images/time.svg) no-repeat left center;
	background-size: 13px 13px;
	padding-left:15px;
}
/****************************************************************************/
/* ComboSelect                                                              */
/****************************************************************************/
.csdkDirBrowser.comboselect
{
	border: none;
	resize: none;
	width: 100%;
	position: relative;
	overflow: visible;
}
.csdkDirBrowser.comboselect .csdkRow.item > .csdkCell:first-child
{
	background: url(../images/green_doubletick.svg) no-repeat center;
	background-size: 20px;
	height: 20px;
	margin-right: 5px;
}
.csdkDirBrowser.comboselect .csdkTableBody {display:none; } 
.csdkDirBrowser.comboselect.active .csdkTableBody {display:flex; } 
.csdkDirBrowser.comboselect.active.picked .csdkTableBody {display:none; } 

.csdkDirBrowser.comboselect.picked .csdkHeader input 
{
	background: url(../images/callRecord_positive.svg) no-repeat 97% center;
	background-size: 15px;
}

.csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow .disclosureWrapper .disclosureLabel
{
	line-height: 20px;
} 
.csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow 
{
	padding: 8px 10px;
	border: 1px solid lightgray;
	border-width: 0 1px 0 1px;
	background: #ffffffe6;
	width: calc(100% - 22px);
}
.csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:first-child
{
	border-width: 1px 1px 0px 1px;
	padding-top:15px;
}
.csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:last-child
{
	padding-bottom:15px;
}
.csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:hover 
{
	background: #f3f3f3;
}
.csdkDirBrowser.comboselect.active .csdkTableBody
{
	border-bottom: 1px solid lightgray;
	width: 100% ;
	box-shadow: 3px 3px 4px #d3d3d357;
	position: absolute;
	top: 45px;
	z-index: 10000;
	left: 0px;
	max-height: 172px;
	overflow-y: auto;
}
.csdkDirBrowser.comboselect .csdkHeader .csdkCell input
{
	padding: 5px;
	border: 1px solid ;
	border-color: #dddbda ;
	border-radius: 0.25rem ;
	margin-top: 5px;
	font-size: 12px;
}    
.csdkDirBrowser.comboselect .csdkHeader .csdkCell > div    
{
	display: flex;
	flex-direction: column;
	width: 100% ;
}
.csdkComboSelect
{
	position: relative;
}
.csdkDirBrowser.comboselect .csdkRow.item.is_selected
{
	    background-color: #e7f7ff;
}
/****************************************************************************/
/* DirBrowser                                                               */
/****************************************************************************/

/* DirBrowser hierarchical menu */
.csdkDirBrowser.hierarchical .csdkRow.folder
{
	position:relative;
}

.csdkDirBrowser.hierarchical .disclosureContent
{
	position: absolute;
	left: 100px;
	border: 1px solid red;
	height: 200px;
	min-width: 100px;
	top: 5px;
}
/* DirBrowser hierarchical menu END*/

.csdkDirBrowser 
{
	user-select:none;
	width: 200px;
	resize: both;
	overflow: hidden;
	border: 1px solid lightgray;
	font-family: arial;
	font-size: 12px;
}
.csdkDirBrowser > .csdkTable { margin: 10px; }

.csdkDirBrowser .csdkHeader .csdkCell div
{
	display:inline-block;
}
.csdkDirBrowser .csdkHeader .csdkCell
{
	justify-content: center;
}

.csdkDirBrowser .csdkTableBody .csdkCell:first-child
{
	flex-basis: 20px;
	flex-grow:0;
}

.csdkDirBrowser .csdkRow.item > .csdkCell:first-child
{
	background: url(../images/folder.svg) no-repeat 7px top;
	background-size: 10px;
}
.csdkDirBrowser .csdkRow.folder > .csdkCell:first-child
{
	background: url(../images/folderClose.svg) no-repeat 3px top;
	background-size: 15px;
}
.csdkDirBrowser .csdkRow.folder.open > .csdkCell:first-child
{
	background: url(../images/folderOpen.svg) no-repeat 3px top;
	background-size: 15px;
}
.csdkDirBrowser .disclosureContent				
{ 
        display:block;
        height:0;
	transition: transform 0.1s ease-out;
	transform:scaleY(0);
	transform-origin:top;
}
.csdkDirBrowser .csdkRow.open > .csdkCell > .disclosureWrapper > .disclosureContent		
{ 
        display:block;
        height:auto;
	transition: transform 0.1s ease-out;
	transform:scaleY(1);
	transform-origin:top;
}
.csdkDirBrowser .disclosureWrapper				{ width:100%; }

/*Dirbrowser List style*/
.csdkDirBrowserBreadcrumbWrapper
{
	width: fit-content;
	margin-bottom: 10px;
}
.csdkRow.csdkDirBrowserBreadcrumbRow .csdkCell
{
	cursor:pointer;
}
.csdkRow.csdkDirBrowserBreadcrumbRow
{
	width: fit-content;
	gap:5px;
}
/*
#container .csdkDirBrowser.accordion .csdkRow.item > .csdkCell:first-child
{
	background-position:7px center;
	flex-basis:25px;
}
#container .csdkDirBrowser.accordion .csdkRow.folder > .csdkCell:first-child
{
	background: url(/images/icon_arrowRight.svg) 3px 6px / 5px no-repeat, url(/images/c7/icon_folder.svg) 13px center / 15px no-repeat ;
	flex-basis: 44px ;
}
#container .csdkDirBrowser.accordion .csdkRow.folder.open > .csdkCell:first-child
{
	background: url(/images/icon_arrowDown.svg) 0px 7px / 10px no-repeat, url(/images/c7/icon_folderOpen.svg) 13px center / 15px no-repeat;
	flex-basis: 44px;
}
*/
#container .csdkDirBrowser.accordion.rootTableToggles > .csdkTable { display:none;}
#container .csdkDirBrowser.accordion.rootTableToggles > .csdkTable.open { display:flex;}

/*Dirbrowser List style END*/


/****************************************************************************/
/* TableKit                                                                 */
/****************************************************************************/
.csdkTable,
.csdkTableBody
{
	display: flex;
	flex-flow: column nowrap;
	flex: 1 1 auto;
}

.csdkRow
{
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
}
.csdkRow.vertical
{
	width: 100%;
	display: flex;
	flex-flow: column nowrap;
}

/*
.csdkRow:nth-of-type(even) { background-color: #f2f2f2; }
.csdkRow:nth-of-type(odd) { background-color: #ffffff; }
*/

.csdkHeader
{
	white-space: normal;
	justify-content: center;
}

.csdkCell
{
	display: flex;
	flex-flow: row nowrap;
	flex-grow: 1;
	word-break: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0px;
	white-space: nowrap;
}

.coral6Table .csdkTable 
{
	display: flex;
	flex-direction: column;
}

.coral6Table .csdkTable .csdkRow
{
	border-bottom: 1px solid var(--tableBC);
	color: ver(--tableBFC);
	font-size: var(--tableFS);
	flex-direction: row;
	display: flex;
	flex-grow: 1;
}

.coral6Table .csdkTable .csdkRow.csdkFooter
{
	border-bottom: 0px;
}

.coral6Table .csdkTable .csdkRow:last-child
{
	border-bottom: 0px;
}

.coral6Tablea .csdkTable .csdkHeader
{
	border-radius: 3px 3px 0 0;
	border-top: 1px solid var(--tableBC);
	border-right: 1px solid var(--tableBC);
	border-left: 1px solid var(--tableBC);
}

.coral6Table .csdkTable .csdkHeader .csdkCell
{
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	padding: 8px 0.7% 8px 8px;
	color: var(--tableBFC);
}

.coral6Table .csdkTable .csdkCell
{
	padding: 5px 0.7% 5px 8px;
}

.coral6Table .csdkTable .csdkTableBody
{
	border-bottom: 1px solid var(--tableBC);
	border-right: 1px solid var(--tableBC);
	border-left: 1px solid var(--tableBC);
	border-radius: 0 0 3px 3px;
}

.coral6Table .csdkTable .csdkCell,
.coral6Table .csdkTable .CellGroup,
.coral6Table .csdkTable .CellGroup2
{
	text-overflow: ellipsis;
	display: inline-flex;
	flex-grow: 1;
	overflow: hidden;
}

.coral6Table .csdkTable .TableFooter .csdkCell
{
	border-bottom: 0px solid var(--tableBC);
}

.coral6Table .csdkTable .cell_small
{
	width: var(--tableCellSM);
}
.coral6Table .csdkTable .cell_medium
{
	width: var(--tableCellMD);
}
.coral6Table .csdkTable .cell_large
{
	width: var(--tableCellLG);
}
.coral6Table .csdkTable .cell_Xlarge
{
	width: var(--tableCellXL);
}
.coral6Table .csdkTable .cell_XXlarge
{
	width: var(--tableCellXXL);
}
.coral6Table .csdkTable .cell_number
{
	text-align: right;
	display: flow-root;
}

.coral6Table .csdkTable .csdkTableBody .csdkCell:last-child {

}

.coral6Table .csdkRow.csdkFooter > div.csdkCell {
	color: #494949;
	font-size: 12px;
}
.coral6Table .csdkTableBody .selectedRow,
.coral6Table .csdkTableBody .csdkRow:hover{
	background: #d4f2fc;
}


/***** CSDK PAGINATION *******/
.csdkTable .csdkRow.csdkPager.csdkPagerHidden
{
	/* JUNAID */
	display: none;
}
.coral6Table .csdkTable .csdkRow.csdkPager 
{
	border: 0px;
	margin: 0px auto;
}

.coral6Table .csdkPager .csdkPagination li{
	display: table-cell;
}

.coral6Table .csdkPager .csdkPagination button{
	background: #e8e7e6;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	margin-right: 5px;
	cursor: pointer;
	border: none;
	color: #919396;
	transition: background 0.5s;
}

.coral6Table .csdkPager .csdkPagination button:hover {
	background: #c7c7c7ba;
}

.coral6Table .csdkPager .csdkPagination button.selected {
	background: #767676;
	color: white;
}

.coral6Table .csdkPager .csdkPagination li.first button,
.coral6Table .csdkPager .csdkPagination li.previous button,
.coral6Table .csdkPager .csdkPagination li.next button,
.coral6Table .csdkPager .csdkPagination li.last button
{
	text-indent: -9999999999px;
	background-size: 40%;
	background-position: center;
	background-repeat: no-repeat;
}

.coral6Table .csdkPager .csdkPagination li.first button
{
	background-image: url(../images/left-arrow-stop.svg);
}

.coral6Table .csdkPager .csdkPagination li.previous button
{
	background-image: url(../images/left-arrow.svg);
}

.coral6Table .csdkPager .csdkPagination li.next button
{
	background-image: url(../images/right-arrow.svg);
}


.coral6Table .csdkPager .csdkPagination li.last button
{
	background-image: url(../images/right-arrow-stop.svg);
}
  
.coral6Table .csdkPager .csdkPagination li button[disabled] {
	display: none;
}

  /***** CSDK Media Query *******/

.csdkTable .CellGroup,
.csdkTable .CellGroup2
{
	flex-direction: row;
	flex-grow: 1;
}

.csdkTable .CellGroup .csdkCell,
.csdkTable .CellGroup .csdkCell.cell_large,
.csdkTable .CellGroup .csdkCell.cell_medium,
.csdkTable .CellGroup .csdkCell.cell_small,
.csdkTable .CellGroup2 .csdkCell,
.csdkTable .CellGroup2 .csdkCell.cell_large,
.csdkTable .CellGroup2 .csdkCell.cell_medium,
.csdkTable .CellGroup2 .csdkCell.cell_small
{
	flex-direction: row;
}


@media only screen and (max-width: 900px) {
.csdkTable .CellGroup
{
flex-direction: column;
	display: flex;
}

.csdkTable .CellGroup .cell_number
{
	text-align: left;
}
       
.csdkTable .CellGroup .csdkCell,
.csdkTable .CellGroup .csdkCell.cell_large,
.csdkTable .CellGroup .csdkCell.cell_medium,
.csdkTable .CellGroup .csdkCell.cell_small
{
	width: auto;
	display: block;
	padding: 0 0 0 10px;
}
/*END OF MEDIA QUERY max-width:900px*/}
@media only screen and (max-width: 600px) {

.csdkTable .CellGroup2
{
	flex-direction: column;
	display: flex;
}

.csdkTable .CellGroup2 .cell_number
{
	text-align: left;
}
     
.csdkTable .CellGroup2 .csdkCell,
.csdkTable .CellGroup2 .csdkCell.cell_large,
.csdkTable .CellGroup2 .csdkCell.cell_medium,
.csdkTable .CellGroup2 .csdkCell.cell_small
{
	width: auto;
	display: block;
	padding: 0 0 0 8px;
}
	      
}/*END OF MEDIA QUERY max-width:600px*/



/****************************************************************************/
/* InfoList                                                                 */
/****************************************************************************/
.infoListWrapper
{
	display: table;
	background: white;
	border-collapse: collapse;
	width: calc(100% - 1px);
	font-family: arial;
	color: #333 !important;
}
.infoListRow > div
{
	border-collapse: collapse;
}
.infoListRow
{
	display: table-row;
	width: 100%;
	border-bottom: 1px solid #E6E7E8;
}
.csdkPopOutBoxContent .infoListRow .infoListTitle
{
	font-weight: bold;
	color: #333;
}

.infoListRow.detailedInfoRowName .custInfoTextWrapper
{
	font-size: 18px;
}

.infoListWrapper .infoListRow
{
	height:41px;
	color: black;
}

.infoListRow DIV:first-child.infoListCell,
.infoListRow DIV:last-child.infoListCell
{
	width:20%;
}
.infoListCell
{
	display: table-cell;
	vertical-align: middle;
}
.infoListTextWrapper
{
	margin: 3.5px 0 !important;
	font-size:14px;
	pointer-events: none;
	cursor: default;
}
#tableDiv .tandcConferenceButton .infoListTextWrapper
{
	pointer-events: all;
}
.infoListSubTitle
{
	color:#686868;
	font-size:11px;
}

.infoListWrapper .infoListRightIcon
{
	height: 40px;
}

.infoListRightIcon.copy
{
	background: url(../images/copy.png) transparent center center no-repeat;
	background-size: 12px;
	padding: 0px;
	cursor: pointer;
}

.infoListRightIcon.menu
{
	background: url(../images/arrow.png) center center / 10px no-repeat transparent;
	box-shadow: unset;
}

.infoListRightIcon.close
{
	background: url(../images/close.png) #2d2d2d center center no-repeat;
	background-size: 7px;
	width: 17px;
	height: 17px;
	display: block;
	position: absolute;
	right: 7px;
	top: 7px;
	border-radius: 10px;
	cursor: pointer;
}

/****************************************************************************/
/* TabSet                                                                   */
/****************************************************************************/
.csdkTabSetHeader.single
{
	display:none;
}
.csdkTabSetContent .csdkTabContent.selected
{
	display:block;
}

.csdkTabSetContent .csdkTabContent
{
	display:none;
}
.csdkTabSet
{
	min-height:200px;
}
.csdkTab
{
	display: inline-block ;
	cursor: default;
}
.csdkTab .csdkTabLabel
{
	font-size: 14px;
	border: 1px solid black;
	border-width: 1px 1px 0px 0;
	display: inline-block;
	padding: 10px;
	color: #525252;
}

.csdkTab.selected > .csdkTabLabel
{
	color: #000;
	font-weight: bold;
}

.csdkTab.selected > .csdkTabContent
{
	display:block;
}

.csdkTab .csdkTabContent
{
	border: 1px solid black;
	position:absolute;
	display:none;
	left: 0px;
}

.csdkInput .csdkInputInput
{
	display:table-cell;
}
.csdkInput.csdkNumberInput .csdkInputInput
{
	width: 70px;
}

.csdkInput.csdkDateInput .csdkInputInput
{
	width: 70px;
}

.csdkInput.csdkDateInput .up,
.csdkInput.csdkNumberInput .up
{
	height: 10px;
	width: 10px;
	background: url(../images/arrow10_10_top.svg) no-repeat left center !important;
	position: absolute;
	top: 0px;
	left: 0px;     
}

.csdkInput.csdkDateInput .down,
.csdkInput.csdkNumberInput .down
{
	height: 10px;
	width: 10px;
	background: url(../images/arrow10_10_bottom.svg) no-repeat left center !important;
	position: absolute;
	top: 10px;
	left: 0px;
}
.csdkInput.csdkNumberInput .down:active
{
	background: url(../images/arrow10_10_bottom_active.svg) no-repeat left center !important;
}                                                                                                                                                  

.csdkInput.csdkNumberInput .up:active
{
	background: url(../images/arrow10_10_top_active.svg) no-repeat left center !important;                                                                
}
.csdkButtonWrapper
{
	position: relative;
	top: -15px;
	width: 15px;
	-webkit-user-select:none;
}


.csdkInput
{
	display:table-row;
}
.csdkInputLabel
{
	display:table-cell;
	text-align:right;
}
.prototypeTest_wrapper
{
	position: fixed;
	z-index: 10002;
	right: 50px;
	top: 20px;
	border-color: gray;
	background-color: rgba(255, 255, 0, 0.2);
	border: 1px solid;
	text-align: center;
	border-radius: 3px;
	box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.55);
}
.prototypeTest_title
{
	text-align: center;
	font-size: 14px;
	padding: 5px
}
.prototypeTest_testTitle
{
}

.prototypeTest_loglabel
{
	display:block;
}

.prototypeTest_input
{
	display:block;
}

.prototypeTest_inputButton
{
	display:block;
}

.prototypeTest_buttonBar
{
}

.prototypeTest_leftButton,
.prototypeTest_indexText,
.prototypeTest_rightButton
{
	display: inline-block;
}
/****************************************************************************/
/* popOutBox                                                                */
/****************************************************************************/

@media screen and (min-width:0\0) and (min-resolution: +72dpi)
{  
        div.csdkPopOutBoxContent
        {
                box-shadow: 0 1px 5px rgba(0,0,0,.3);                                                                                                                                                                                                           
        }
}
.csdkPopOutBoxContent.csdkToolTipPopOutBoxContent
{
	font-size:12px;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	min-height: 20px;
	min-width: 30px;
	line-height: 20px;
	transition: opacity 0.3s;
	padding: 10px;
}

.csdkPopOutBoxContent.csdkToolTipPopOutBoxContent.alert_tt
{
	z-index:10003;
}
div.csdkPopOutBoxContent.csdkPopOutBoxAnimates
{
	transition: all 0.5s ease-in-out;
}
div.csdkPopOutBoxContent
{
	color:rgb(82, 82, 82);
	padding:3px;
	background: white;
	position: absolute;
	left:30px;
	border-radius: 1px;
	display:inline-block;
	filter: drop-shadow(0 1px 5px rgba(0,0,0,.3));
	z-index: 1000;
	text-align: left;
	padding: 5px 0;
	min-width: 100px;
	min-height: 50px;
}
div.csdkPopOutBoxContent.csdkFilterPopOutBoxContent {z-index:999;}
div.csdkPopOutBoxContent.HierarchicalMenuToolTip
{
	font-size: 12px;
	font-family: arial;
	text-align: left;
	padding: 5px 10px;
	max-width: 350px;
	background: rgba(252, 247, 205, 0.9);
	color: #000;
	border: 1px solid #F9C580;
}
div.csdkPopOutBoxContent:before
{
        content:"";
        position: absolute;
        width: 0;
        height: 0;
}

div.csdkPopOutBoxContent.lt {  margin-top:-17px; margin-left: 10px }
div.csdkPopOutBoxContent.lm {                    margin-left: 10px }
div.csdkPopOutBoxContent.lb {  margin-top: 17px; margin-left: 10px }

div.csdkPopOutBoxContent.rt {  margin-top:-17px; margin-left:-10px }
div.csdkPopOutBoxContent.rm {                    margin-left:-10px }
div.csdkPopOutBoxContent.rb {  margin-top: 17px; margin-left:-10px }

div.csdkPopOutBoxContent.tl {  margin-top: 10px; margin-left: -17px;}
div.csdkPopOutBoxContent.tc {  margin-top: 10px; }
div.csdkPopOutBoxContent.tr {  margin-top: 10px; margin-left:  17px;}

div.csdkPopOutBoxContent.bl {  margin-top: -10px; margin-left: -17px;}
div.csdkPopOutBoxContent.bc {  margin-top: -10px; }
div.csdkPopOutBoxContent.br {  margin-top: -10px; margin-left:  17px;}

div.csdkPopOutBoxContent.lt:before { top:    10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid white; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.lm:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid white; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.lb:before { bottom: 10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid white; border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.rt:before { top:    10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid white; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.rm:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid white; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.rb:before { bottom: 10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid white; border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.tl:before { bottom: 100%;                   left: 10px;             border-bottom: 7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.tc:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.tr:before { bottom: 100%;                   right:10px;             border-bottom: 7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }

div.csdkPopOutBoxContent.bl:before { top:    100%;                   left: 10px;             border-top:    7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.bc:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.br:before { top:    100%;                   right:10px;             border-top:    7px solid white;    border-right: 9px solid transparent; border-left: 9px solid transparent; }


div.csdkPopOutBoxContent.lt.csdkToolTipPopOutBoxContent:before { top:    10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid #555; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.lm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid #555; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.lb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid #555; border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.rt.csdkToolTipPopOutBoxContent:before { top:    10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid #555; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.rm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid #555; border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.rb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid #555; border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.tl.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: 10px;             border-bottom: 7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.tc.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.tr.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   right:10px;             border-bottom: 7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }

div.csdkPopOutBoxContent.bl.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: 10px;             border-top:    7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.bc.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.br.csdkToolTipPopOutBoxContent:before { top:    100%;                   right:10px;             border-top:    7px solid #555;    border-right: 9px solid transparent; border-left: 9px solid transparent; }
/*Tooltip pointy colour*/
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lt.csdkToolTipPopOutBoxContent:before { top:    10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rt.csdkToolTipPopOutBoxContent:before { top:    10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid rgba(252, 247, 205, 0.9); border-bottom: 7px solid transparent; }

div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tl.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: 10px;             border-bottom: 7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tc.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tr.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   right:10px;             border-bottom: 7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

div.csdkPopOutBoxContent.HierarchicalMenuToolTip.bl.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: 10px;             border-top:    7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.bc.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
div.csdkPopOutBoxContent.HierarchicalMenuToolTip.br.csdkToolTipPopOutBoxContent:before { top:    100%;                   right:10px;             border-top:    7px solid rgba(252, 247, 205, 0.9);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

/*div.csdkPopOutBoxContent
{
	display:inline-block;
	border: 1px solid rgba(127, 127, 127, 0.55);
	position: absolute;
	background-color: rgba(255, 255, 255, 0.9);
	box-shadow: 0px 7px 14px rgba(30, 30, 30, 0.5);
	border-radius: 5px;
	z-index: 22;
	text-align: left;
	padding: 5px 0;
	min-width: 200px;
	min-height: 200px;
	background-color: yellow;
}
*/

/****************************************************************************/





div#coral_AlertPopUpDiv.csdkDialog .showQuery_Expansion
{
	text-align:left;
	width: calc(100% - 40px);
}
div#coral_AlertPopUpDiv.csdkDialog
{
	font-family: arial;
	font-weight: bold;
	font-size: 12px;
	position: absolute;
	width: auto;
	min-width: 300px;
	height: auto;
	border:1px solid #666;
	box-shadow: 0px 0px 10px #333;
	z-index: 10002;
	border-radius: 5px;
	padding: 8px;
	color:#111;
	background: rgb(254,255,255); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(254,255,255,1) 0%, rgba(242,242,242,1) 11%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,255,255,1)), color-stop(11%,rgba(242,242,242,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(254,255,255,1) 0%,rgba(242,242,242,1) 11%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(254,255,255,1) 0%,rgba(242,242,242,1) 11%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(254,255,255,1) 0%,rgba(242,242,242,1) 11%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(254,255,255,1) 0%,rgba(242,242,242,1) 11%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
	margin-right:5px;
}

div.jsoneditor-value.jsoneditor-string {
    color: green
}

div.jsoneditor-value.jsoneditor-array, div.jsoneditor-value.jsoneditor-object {
    min-width: 16px;
    color: grey
}

div.jsoneditor-value.jsoneditor-number {
    color: #ee422e
}

div.jsoneditor-value.jsoneditor-boolean {
    color: #ff8c00
}

div.jsoneditor-value.jsoneditor-null {
    color: #004ED0
}

.csdkJConfEmptyObject .string { color: green; }
.csdkJConfEmptyObject .number { color: #ee422e; }
.csdkJConfEmptyObject .boolean { color: #ff8c00; }
.csdkJConfEmptyObject .null { color: #004ED0; }

.csdkJConfEmptyObject
{
        display: table-cell;
        text-overflow: ellipsis;
        max-width: 330px;
        white-space: nowrap;
        overflow: hidden;
}       
        
.csdkJConfTypeLabel
{               
        color: #939597;
}       

.csdkJConfName::after,
.csdkJAdhocName::after
{
	content: ":";
}
.csdkJConfContent.string::before,
.csdkJConfContent.string::after
{
	content: "\"";
	display: inline-block;
}
.csdkJAdhocName
{
	resize:none;
	display: table-cell;
	background-color: lightgray;
	color: black;
}

input.csdkJConfString
{
	background: transparent;
	resize: none;
	border: none;
}

.csdkDWind.raised.fullscreen .csdkJConfWrapper
{
	max-height: 100%;
	max-height: auto;
}
.csdkDWind.raised .csdkJConfWrapper
{
	max-height: 600px;
	width: 650px;
	max-width: 650px;
	overflow-x: hidden;
}

.csdkJConfWrapper
{
	overflow-y: auto;
	margin-left: 12px;
}

.csdkJConfAddButton
{
	height: 15px;
	width: 15px;
	background: url("../images/add.svg") no-repeat center right;
	background-size: 12px;
	border: none;
	vertical-align: middle;
	display: inline-block;
}
.csdkJConfAddButton:hover
{
	background: url("../images/addH.svg") no-repeat center right;
	background-size: 12px;
}
.csdkJConfAddButton:active
{
	background: url("../images/addA.svg") no-repeat center right;
	background-size: 12px;
}
.csdkJConfAddButton:disabled
{
	background: url("../images/addD.svg") no-repeat center right;
	background-size: 12px;
}

.csdkJConfDeleteButton
{
	height: 15px;
	width: 15px;
	background: url("../images/delete.svg") no-repeat center right;
	background-size: 12px;
	border: none;
	vertical-align: middle;
	display: table-cell;
}
.csdkJConfDeleteButton:hover
{
	background: url("../images/deleteH.svg") no-repeat center right;
	background-size: 12px;
}
.csdkJConfDeleteButton:active
{
	background: url("../images/deleteA.svg") no-repeat center right;
	background-size: 12px;
}
.csdkJConfDeleteButton:disabled
{
	background: url("../images/deleteD.svg") no-repeat center right;
	background-size: 12px;
}

.csdkJConfContent.object .csdkJElemWrapper 
{
	padding: 5px 8px;
}
.csdkJConfContent.object .csdkJElemWrapper:first-child 
{
	padding-top: 8px;
}
.csdkJConfWrapper .csdkJElemWrapper:first-child
{
	border-left: none;
}

.csdkJConfAddDiv
{
	padding-top: 4px;
	padding-bottom: 4px;
	color: #939597 !important;
	font-weight: bold;
	border: 1px solid #f1f1f2;
	width: auto;
	display: table-cell;
	padding-right: 10px;
}
.csdkJConfContent.array .csdkJConfAddDiv
{
}
.csdkJElemWrapper
{
	padding-bottom: 5px;
	padding-top: 13px;
}
.csdkJElemWrapper
{
	display: block;
}
.csdkJConfAddDiv,
.csdkJElemWrapper
{
	padding-left: 10px;
	background-color: white;
	color: black;
	font-family: monospace;
}

.csdkJConfContent
{
	resize:none;
	display: table-cell;
	background-color: #fff;
	background: #fff;
	color: white;
}

.csdkJConfContent.array,
.csdkJConfContent.object
{
	display: block;
	margin-left:5px;
	margin-top:2px;
}

.csdkJConfContent.string
{
	background: #fff; 
	color:red;
	max-width: 240px;
}
.csdkJConfContent.json,
.csdkJConfContent.string,
.csdkJConfContent.number,
.csdkJConfContent.boolean
{
	padding-left: 3px;
	padding-right: 3px;
	margin-left: 2px;
	margin-right: 5px;
}

.csdkJConfContent.string .csdkJConfContentModel,
.csdkJConfEmptyObject,
.csdkJConfEmptyArray,
.csdkJConfTypeLabel
{
	display:table-cell;
	vertical-align: middle;
}

.csdkJConfHelp
{
	display: table-cell;
	background: url("../images/question.svg") no-repeat center right;
	background-size: 15px 15px;
	height: 15px;
	width: 20px;
	line-height: 20px;
	vertical-align: middle;
}
.csdkJConfHelp:hover
{
	background: url("../images/questionH.svg") no-repeat center right;
	background-size: 15px 15px;
}
.csdkJConfHelp:active
{
	background: url("../images/questionA.svg") no-repeat center right;
	background-size: 15px 15px;
}
.csdkJConfHelp:disabled
{
	background: url("../images/questionD.svg") no-repeat center right;
	background-size: 15px 15px;
}

.csdkJConfDisclosure
{
	display: table-cell;
	background: url("../images/jconfArrowRight.svg") no-repeat center right;
	background-size: 10px 10px;
	height: 10px;
	width: 12px;
	line-height: 20px;
	vertical-align: middle;
	margin-right: 3px;
}
.csdkJConfDisclosure.open
{
	background: url('/images/arrowDown.svg') no-repeat center left;
}
.csdkJConfDisclosure.open.none,
.csdkJConfDisclosure.none
{
	background-image: none;
	
}

.csdkJConfName
{
	display: table-cell;
	font-weight: bold;
	vertical-align: middle;
}

.csdkJConfSelect
{
	display: inline-block;
}

.csdkJConfString
{
	color:red;
	display: inline-block;
}

.csdkJConfCheckbox
{
}

.csdkJConfAddLabel
{
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
}

.csdkJConfExtendSelect
{
	display: inline-block;
	vertical-align: middle;
}

div.csdkDWind.fullscreen
{
	z-index: 9999 !important;
	width: 100% !important;
	height: 100% !important;
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
}
div.csdkDWind.fullscreen .csdkDWindContentWindow
{
	width: 100% !important;
	height: -webkit-calc(100% - 40px) !important;
	height: calc(100% - 40px) !important;
	resize:none !important;
	overflow-y: auto;
}

.csdkProgress
{
	border-radius: 16px;
	background-color: #757575;
	height: 100%;
	position: absolute;
	line-height: inherit
}
.csdkProgressContainer
{
	border-radius: 16px;
	width: 80%;
	height: 0.6em;
	position: relative;
	background-color: #f1f1f1;
	margin-left: auto;
	margin-right: auto;
}

div.csdkDWind
{
	position: absolute;
	z-index: 20;
	top: 5px;
        left: 275px;
	display: block;
	min-width:300px;
	height:auto;
	box-shadow: 0px 4px 10px rgba(50, 50, 50, 0.6);
	background: #e6e7e8;
	border-radius: 4px;
	font-family: arial;
}
div.csdkDWind.raised
{
}
div.csdkDWindTitleBar
{
	position:relative;
	top:0px;
	background-color:#718191;
	border-bottom:1px solid #464f5a;
	border: 1px solid rgba(147, 147, 147, 0.2);	
	height: 20px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	background-image: linear-gradient(top, rgb(255, 255, 255), rgb(236, 236, 236) );
	background-image: -webkit-linear-gradient(top, rgb(255, 255, 255), rgb(236, 236, 236) );
	background-image: -moz-linear-gradient(top, rgb(255, 255, 255), rgb(236, 236, 236) );
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #e7e7e7 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(99%,#e7e7e7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#e7e7e7 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#e7e7e7 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#e7e7e7 99%); /* IE10+ */
	background: linear-gradient(to bottom, #ffffff 0%,#e7e7e7 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e7e7e7',GradientType=0 );
/*	width: 100%; */
	text-align:center;
	cursor:pointer;
	color:rgba(158, 158, 158, 1.000);
}
div[widget].csdkDWind
{
	z-index:20;
}
div[widget].csdkDWind.raised
{
	z-index:21;
}
div[widget].csdkDWind.raised .csdkDWindTitleBar
{
	color:rgba(58, 58, 58, 1.000);
	/* background-image: linear-gradient(top, rgb(236, 236, 236), rgb(169, 168, 169) );
	background-image: -webkit-linear-gradient(top, rgb(236, 236, 236), rgb(169, 168, 169) );
	background-image: -moz-linear-gradient(top, rgb(236, 236, 236), rgb(169, 168, 169) );
	background: #e7e7e7; /* Old browsers */
	/* background: -moz-linear-gradient(top, #e7e7e7 0%, #989798 100%); /* FF3.6+ */
	/* background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e7e7e7), color-stop(100%,#989798)); /* Chrome,Safari4+ */
	/* background: -webkit-linear-gradient(top, #e7e7e7 0%,#989798 100%); /* Chrome10+,Safari5.1+ */
	/* background: -o-linear-gradient(top, #e7e7e7 0%,#989798 100%); /* Opera 11.10+ */
	/* background: -ms-linear-gradient(top, #e7e7e7 0%,#989798 100%); /* IE10+ */
	/* background: linear-gradient(to bottom, #e7e7e7 0%,#989798 100%); /* W3C */
	/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7e7e7', endColorstr='#989798',GradientType=0 ); */
	z-index:21;
}
.csdkDWindTitle
{
	font-family:helvetica, sans-serif;
	text-shadow: 0px 1px 0px rgba(255,255,255,.5); /* 50% white from bottom */
	line-height:20px;
	font-size:14px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	cursor:pointer;
}
div.csdkDWindTitleBarButtonDock
{
	position: absolute;
	top:2px;
	right:2px;
	height:20px;
	background: none;
	display:flex;
}
div.csdkDWindContentWindow
{
	position:relative;
	top:0px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-top:1px solid rgba(106, 106, 106, 1.000);
	border: 1px solid rgba(147, 147, 147, 0.770);
	background: #e6e7e8;
	overflow:hidden; 
	font-size: 12px;
	padding:10px 10px 10px 0;
}

div.csdkDWindSettingsWindow
{
	width:90%;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
}
div.csdkDWindSettingsContentWindow
{
	position:absolute;
	top:-109%;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-top:1px solid rgba(106, 106, 106, 1.000);
	border: 1px solid rgba(147, 147, 147, 0.770);
	background:white;
	width:90%;
	height:90%;
	margin-left:auto;
	margin-right:auto;
	box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.6);
	transition-property: top;
	transition-duration: 0.5s;
	-webkit-transition-property: top;
	-webkit-transition-duration: 0.5s;
	z-index:100;
}
div.csdkDWindSettingsContentWindowShow
{
	top:-1%;	
	transition-property: top;
	transition-duration: 0.5s;
	-webkit-transition-property: top;
	-webkit-transition-duration: 0.5s;
}

button.csdkDWindCloseButton
{
	height:15px;
	width:15px;
	background-size:15px 15px;
	background-repeat: no-repeat;
	background-image: url('/images/coralDraggableWindowClose.svg');
	background-color:transparent;
	border: none;
	margin-right: 5px;
}
button.csdkDWindCloseButton:hover
{
	background-image: url('/images/coralDraggableWindowCloseH.svg');
}
button.csdkDWindCloseButton:active
{
	background-image: url('/images/coralDraggableWindowCloseA.svg');
}

button.csdkDWindMaximizeButton, button.csdkDWindMaximizeButton:hover
{
	height:15px;
	width:15px;
	background-size:15px 15px;
	background-repeat: no-repeat;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='14.17px' height='14.17px' viewBox='0 0 14.17 14.17' enable-background='new 0 0 14.17 14.17' xml:space='preserve'%3E%3Cg%3E%3Ccircle fill='%23333333' cx='7.085' cy='7.086' r='7.086'/%3E%3Cpath fill='%23FFFFFF' d='M10.513,3.35h-0.479c-0.166,0-0.441,0-0.607,0H6.503c-0.167,0-0.305,0.137-0.305,0.305v0.479 c0,0.167,0.138,0.304,0.305,0.304h2.17c0.166,0,0.205,0.097,0.088,0.216L4.655,8.762C4.536,8.878,4.438,8.84,4.438,8.672V6.506 c0-0.167-0.136-0.305-0.304-0.305H3.656c-0.167,0-0.304,0.137-0.304,0.305v2.925c0,0.167,0,0.44,0,0.608v0.478 c0,0.167,0.137,0.304,0.304,0.304h0.479c0.167,0,0.44,0,0.609,0h2.923c0.168,0,0.305-0.137,0.305-0.304v-0.478 c0-0.168-0.135-0.304-0.305-0.304H5.498c-0.167,0-0.206-0.098-0.089-0.216l4.105-4.111c0.119-0.117,0.217-0.078,0.217,0.09v2.168 c0,0.168,0.135,0.305,0.303,0.305h0.479c0.166,0,0.305-0.137,0.305-0.305V4.74c0-0.166,0-0.44,0-0.607V3.654 C10.817,3.488,10.679,3.35,10.513,3.35z'/%3E%3C/g%3E%3C/svg%3E%0A");
	background-color:transparent;
	border: none;
	margin-right: 5px;
}
button.csdkDWindMaximizeButton:hover
{
	opacity:0.7;
}
button.csdkDWindMaximizeButton:active
{
	opacity:0.5;
}

button.csdkDWindMinimizeButton, button.csdkDWindMinimizeButton:hover
{
	height:15px;
	width:15px;
	background-size:15px 15px;
	background-repeat: no-repeat;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='17px' height='17px' viewBox='0 0 17 17' enable-background='new 0 0 17 17' xml:space='preserve'%3E%3Cg%3E%3ClinearGradient id='SVGID_1_' gradientUnits='userSpaceOnUse' x1='8.5005' y1='17' x2='8.5005' y2='4.882812e-04'%3E%3Cstop offset='0' style='stop-color:%23BCBEC0'/%3E%3Cstop offset='1' style='stop-color:%23696A6D'/%3E%3C/linearGradient%3E%3Ccircle fill='url(%23SVGID_1_)' cx='8.5' cy='8.501' r='8.5'/%3E%3Cg%3E%3ClinearGradient id='SVGID_2_' gradientUnits='userSpaceOnUse' x1='8.4995' y1='0' x2='8.4995' y2='17.0005'%3E%3Cstop offset='0' style='stop-color:%23696B6D'/%3E%3Cstop offset='1' style='stop-color:%238A8C8F'/%3E%3C/linearGradient%3E%3Cpath fill='url(%23SVGID_2_)' d='M8.5,0.5c4.411,0,8,3.589,8,8.001c0,4.411-3.589,7.999-8,7.999s-8-3.588-8-7.999 C0.5,4.089,4.089,0.5,8.5,0.5 M8.5,0C3.806,0,0,3.806,0,8.501C0,13.194,3.806,17,8.5,17S17,13.194,17,8.501 C17,3.806,13.194,0,8.5,0L8.5,0z'/%3E%3C/g%3E%3C/g%3E%3ClinearGradient id='SVGID_3_' gradientUnits='userSpaceOnUse' x1='8.5' y1='1.9766' x2='8.5' y2='15.0239'%3E%3Cstop offset='0' style='stop-color:%23C7C7C7'/%3E%3Cstop offset='1' style='stop-color:%23727476'/%3E%3C/linearGradient%3E%3Cpath fill='url(%23SVGID_3_)' d='M8.5,15.023c-3.597,0-6.522-2.926-6.522-6.522S4.904,1.977,8.5,1.977 c3.596,0,6.522,2.928,6.522,6.524S12.097,15.023,8.5,15.023z'/%3E%3Cpath fill='%23FFFFFF' d='M13.041,9.223c0,0.165-0.135,0.3-0.3,0.3H4.259c-0.165,0-0.3-0.135-0.3-0.3V7.777c0-0.165,0.135-0.3,0.3-0.3 h8.482c0.165,0,0.3,0.135,0.3,0.3V9.223z'/%3E%3C/svg%3E%0A");
	background-color:transparent;
	border: none;
	margin-right: 5px;
}
button.csdkDWindMinimizeButton:hover
{
	opacity:0.7;
}
button.csdkDWindMinimizeButton:active
{
	opacity:0.5;
}

button.csdkDWindSettingsButton
{
	height:15px;
	width:15px;
	background-repeat: no-repeat;
	background-size:15px 15px;
	background-image: url('/images/coralDraggableWindowSettings.svg');
	background-color:transparent;
	border: none;
	margin-right: 5px;
}
button.csdkDWindSettingsButton:hover
{
	background-image: url('/images/coralDraggableWindowSettingsH.svg');
}
button.csdkDWindSettingsButton:active
{
	background-image: url('/images/coralDraggableWindowSettingsA.svg');
}
/*
.coralDock:hover div.csdkDWindButtonDock
{
	visibility:visible;
}
*/
div.csdkDWindButtonDock
{
	border: none;
	float:right;
	/*visibility:hidden;*/
}
button.csdkDWindMaximiseButton
{
	height:15px;
	width:15px;
	max-width: 15px;
	background-size:15px ;
	background-image: url(/images/coralDraggableWindowMaximise.svg);
	background-repeat: no-repeat;
	background-color:transparent;
	border: none;
	vertical-align:-webkit-baseline-middle;
	vertical-align:baseline-middle;
	display: inline-block;
}
button.csdkDWindMaximiseButton:hover
{
	background-image: url(/images/coralDraggableWindowMaximiseHover.svg);
}
button.csdkDWindMaximiseButton:active
{
	background-image: url(/images/coralDraggableWindowMaximiseActive.svg);
}
.csdkDWindLeftDockedWindowIcon
{
	width:25px;
	height:25px;
}
.csdkDWindDockedSpan
{
	margin-left:8px;
	vertical-align:super;
	max-width: 160px;
	display: inline-block;
	/*width: 160px;*/
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 17px;
}
ul.coralDock_after .csdkDWindDockedSpan
{
	display:none;
}

/* CSS Based Wait animation */
div.csdkDWindTitleBarWaitDiv
{
	position: absolute;
	top:0px;
	left:5px;
	height:20px;
	width:16px;
	display:none;
	background-image: url(/images/csdkDWindWait.svg);
	background-size: 20px 20px;
}
.csdkDWindLeftDockedWindowIcon
{
	width: 25px; 
	height:25px; 
	background-size: 25px;  
	display:inline-block;
}
.configuratorButtonWrapper .configuratorGenerateButton
{
	margin-left: 12px;
}
.configuratorButtonWrapper
{
	width: 274px;
	margin-right: auto;
	margin-left: auto;
}
.csdkDialog .showQuery_ButtonRow button
{
	padding: 4px 10px;
}
.configuratorButtonWrapper .configuratorGenerateButton,
.configuratorButtonWrapper .configuratorResetButton,
.configuratorButtonWrapper .configuratorSaveButton,
.csdkDialog .showQuery_ButtonRow button
{
	margin-right: 6px;
	margin-top: 10px;
	background: #828c95; /* Old browsers */
	background: -moz-linear-gradient(top, #828c95 0%, #28343b 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #828c95 0%,#28343b 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #828c95 0%,#28343b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	padding: 4px 10px;
	border: none;
	border-radius: 4px;
}
.configuratorButtonWrapper .configuratorGenerateButton:hover,
.configuratorButtonWrapper .configuratorResetButton:hover,
.configuratorButtonWrapper .configuratorSaveButton:hover,
.csdkDialog .showQuery_ButtonRow button:hover
{
	text-shadow: 1px 1px 0px #666666;
}
.configuratorButtonWrapper .configuratorGenerateButton:active,
.configuratorButtonWrapper .configuratorResetButton:active,
.configuratorButtonWrapper .configuratorSaveButton:active,
.csdkDialog .showQuery_ButtonRow button:active
{
	text-shadow: none;
	background: #28343b; /* Old browsers */
	background: -moz-linear-gradient(top, #28343b 0%, #828c95 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #28343b 0%,#828c95 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #28343b 0%,#828c95 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	color: #172126;
}
.callguideSaveButton,
.callguideResetButton
{
	margin-left: 4px;
}
.fileUploadButton 
{
	background: #828c95; /* Old browsers */
	background: -moz-linear-gradient(top, #828c95 0%, #28343b 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #828c95 0%,#28343b 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #828c95 0%,#28343b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	position: relative;
	overflow: hidden;
	margin: 0px;
	margin-left: 4px;
	color: #fff;
	font-weight: bold;
	border-color: #2e6da4;
	width: 80px;
	text-align: center;
	padding: 3px 10px;
	border-radius: 4px;
	font-family: arial;
	display: inline;
}
.fileUploadButton:hover 
{
	text-shadow: 1px 1px 1px #d1d2d4;
}
.fileUploadButton input.configuratorLoadButton 
{
	width: 62px;
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0;
	font-size: 20px;
	cursor: pointer;
	opacity: 0;
	filter: alpha(opacity=0);
}
.csdkDialog .showQueryImageUrl
{
	width: 40px;
	height: 40px;
}
.csdkDialog .showQueryTableCellText
{
	width: calc(100% - 38px);
}
.csdkDialog ..showQuery_Expansion
{
	margin-bottom: 0; 
}
.csdkDialog .showQuery_TableCell
{
	width: 40px;
}
.callguideButtonWrapper
{
	margin-left: 12px;
	margin-top: 10px;
}
#CALLGUIDE .expandedContent
{
	font-family: arial;
}
.callTypesWrapper select,
.reasonsWrapper select,
.proceduresWrapper select
{
	width: 130px;
	float: right;
	margin-right: 3px;
}
.callTypesWrapper,
.reasonsWrapper,
.proceduresWrapper
{
	color: #fff;
	height: 20px;
	font-size: 12px;
	padding-left: 4px;
	line-height: 20px;
}

/***** CSDK PAGER *******/

.csdkPager .csdkPagination
{
	margin: 15px auto;
	display: flex;
}

.csdkPager .csdkPagination li
{
	display: table-cell;
}

.csdkPager .csdkPagination button
{
	background: #e8e7e6;
	border-radius: 50%;
	min-width: 30px;
	height: 30px;
	margin-right: 5px;
	cursor: pointer;
	border: none;
	color: #919396;
	transition: background 0.5s;
}

.csdkPager .csdkPagination button:hover {
	background: #c7c7c7ba;
}

.csdkPager .csdkPagination button.selected {
	background: #767676;
	color: white;
}

.csdkPager .csdkPagination li.first button,
.csdkPager .csdkPagination li.previous button,
.csdkPager .csdkPagination li.next button,
.csdkPager .csdkPagination li.last button
{
	background-size: 40%;
	background-position: center;
	background-repeat: no-repeat;
	font-size:0px !Important;
}

.csdkPager .csdkPagination li.first button
{
	background-image: url(../images/left-arrow-stop.svg);
}

.csdkPager .csdkPagination li.previous button
{
        background-image: url(../images/left-arrow.svg);
}

.csdkPager .csdkPagination li.next button
{
        background-image: url(../images/right-arrow.svg);
}

.csdkPager .csdkPagination li.last button
{
        background-image: url(../images/right-arrow-stop.svg);
}

.csdkPager .csdkPagination li button[disabled] {
	opacity:0.4;
	background-color: #cbcbcb !important;
	pointer-events: none;
}


/****************************************************************************/ 
/* Disclosure Panel                                                               */ 
/****************************************************************************/ 

.csdkDisclosurePanelParent.modeFill {
	display: flex;
	flex-direction: row;
	height: 100%;
	white-space: normal;
	width: 100%;
	flex-grow: 1;
}

.csdkDisclosurePanel.modeFill {
	width: 257px;
	transition: margin 0.7s ease;
}
.csdkHeader .csdkCell.sortDescending,
.csdkHeader .csdkCell.sortAscending
{
	padding-left: 11px;
	padding-right: 0;
}
.csdkHeader .csdkCell.sortDescending::before,
.csdkHeader .csdkCell.sortAscending::before
{
	position: absolute;
	content: '';
	width: 10px;
	height: 10px;
	margin-left: -10px;
}
.csdkHeader .csdkCell.sortAscending::before
{
	background: url(../images/arrowDown.svg) no-repeat left bottom;
	background-size: 6px;
}
.csdkHeader .csdkCell.sortDescending::before
{
	background: url(../images/arrowUp.svg) no-repeat left bottom;
	background-size: 6px;
}
.csdkDisclosurePanelParent .csdkCell
{
	white-space: normal;
}

.csdkDisclosurePanel.modeFill.positionedLeft + div.csdkDisclosurePAdjacentWrapper,
.csdkDisclosurePanel.modeFill.positionedRight + div.csdkDisclosurePAdjacentWrapper {
	width: calc(100% - 250px);
	transition: width 0.7s ease;
}

.csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden {
	padding: 0;
	margin-left: -250px;
}


.csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden + div,
.csdkDisclosurePanel.modeFill.positionedRight.csdkDisclosurePanelBodyHidden + div
{
	width: 100%;
}

.csdkDisclosurePanel.modeFill.positionedRight {
	order: 2;
}

.csdkDisclosurePanel.modeFill.positionedRight.csdkDisclosurePanelBodyHidden {
	margin-right: -250px;
	padding: 0;
}
.csdkDisclosurePanel.modeFill .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
	height: 100%;
	z-index: 1000;
	overflow: visible;
	padding-right: 13px;
	transition: left 0.7s ease;
	top: 0px;
	border-right: 1px solid #dfdfdf;
	white-space: normal;                
}
.csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
        border-right: 0px solid #dfdfdf;
        border-left: 1px solid #dfdfdf;
}
.csdkDisclosurePanel.modeFill .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	z-index: 10000;
	height: 70px;
	background: #ffffff;    
	width: 15px;
	transition: left 0.7s ease;
	cursor: pointer;
	position: absolute;
	padding: 0;
	display: inline-block;
	top: calc(50% - 35px);
}

.csdkDisclosurePanel.modeFill.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 253px;
	border-right: 1px solid #dfdfdf;
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	border-radius: 0 5px 5px 0;
}

.csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	right: 253px;
	border-left: 1px solid #dfdfdf;
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	border-radius: 5px 0px 0px 5px;
}


.csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 4px;
}

.csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell {
	right: 4px;
}

.csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
	position: absolute;
	width: 243px;
	height: 100%;
	z-index: 499;
	background: #ffffff;
	overflow: visible;
	padding-right: 13px;
	transition: left 0.7s ease;
	top: 0px;
	border-right: 1px solid #dfdfdf;
	white-space: normal;
}

.csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell > div
{
	padding: 10px;
}
.csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	left: 0;        
}

.csdkDisclosurePanel.modeOverlay.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	left: -253px;
	transition: all 0.7s ease;
}

.csdkDisclosurePanel.modeOverlay.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	right: 0;        
	border-left: 1px solid #dfdfdf;
	border-right: 0px;
	transition: right 0.7s ease;
}

.csdkDisclosurePanel.modeOverlay.positionedRight.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	right: -253px;
	transition: all 0.7s ease;
	border-left: 1px solid #dfdfdf;
	border-right: 0px;
}

.csdkDisclosurePanel.modeOverlay.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {   
	left: -253px;
	transition: all 0.7s ease;
}

.csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	position: absolute;
	z-index: 500;
	height: 70px;
	background: #fff;
	top: calc(50% - 35px);
	width: 15px;
	transition: left 0.7s ease;
	cursor: pointer;
	transition: all 0.7s ease;
}

.csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 256px;
	border-right: 1px solid #dfdfdf;
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	border-radius: 0 5px 5px 0;
}

.csdkDisclosurePanel.modeOverlay.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	Right: 256px;
	border-left: 1px solid #dfdfdf;
	border-top: 1px solid #dfdfdf;
	border-bottom: 1px solid #dfdfdf;
	border-radius: 5px 0px 0px 5px;
} 

.csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell {
	left: 3px;
}

.csdkDisclosurePanel .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	position: absolute;
	font: 16px/1 'Open Sans', sans-serif;
	top: calc(50% - 10px);
	content: '\27E9';
	vertical-align: middle;
	flex-grow: 1;
}

.csdkDisclosurePanel.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	content: '\27E8';               
}

.csdkDisclosurePanel.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	left: 4px;                                                                                                                           
}

.csdkDisclosurePanel.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	right: 2px;
}

.csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	right: 3px;
}

.csdkDisclosurePanel.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell::before
{
	content: '\27E8';
}

.csdkDisclosurePanel.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell::before
{
	content: '\27E9';
}
/* CSDK FILTER GEN */
.csdkFilterGeneratorWrapper {
	width: calc(100% - 15px);
}

.csdkFilterGeneratorWrapper .csdkFiltersWrapper
{
	border-bottom: 1px dotted rgba(211, 211, 211, 0.37);
	margin-bottom: 5px;
}

.csdkFilterGenerator
{
	display: inline-block;
}

.csdkFilterGeneratorWrapper button.csdkFilterAddBtn
{
	background: url(../images/plus.svg) #fff no-repeat;
	border: 0px;
	background-color:transparent;
	text-indent: -999999px;
	width: 15px;
	height: 15px;
	margin: 2px 0 0 6px;
	background-position: 0 0px;
	cursor: pointer;
	border-radius: 5px;
	position: absolute;
	background-size: 15px;
	right: 0;
}
.csdkFilterGenerator select,
.csdkFilterGenerator input
{
	margin: 0px 3px 0;
}
.csdkFilterGenerator DIV
{
	color:black;
	display:inline-block;
}
.csdkFilterGenerator .csdkInput .csdkButtonWrapper {
	width: 10px;
	top: -14px;
	margin: 0 3px 0 0;
}
.csdkFilterGenerator .csdkInput.csdkNumberInput.inputCount {
	position: relative;
	top: 1px;
}
.csdkFilter
{
	display: inline-block;
	background-color: rgb(62, 119, 188);
	margin: 0px 4px 6px 0px;
	padding-right: 15px;
	position: relative;
	box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
}
.csdkFilter.sort
{
	background-color: #8f2f77;
}
.csdkFilter.date
{
	background-color: rgb(37, 176, 230);
}
.csdkFilter.number
{
	background-color: rgb(62, 119, 188);
}
.csdkFilter.string
{
	background-color: #8BC34A;
}
.csdkPopOutBox.csdkFilterPopOutBox
{
	display: inline-block;
}
.csdkFilterRemoveBtn
{
	width: 11px;
	height: 11px;
	cursor: pointer;
	background: url(../images/delete.svg);
	position: absolute;
	right: 3px;
	top: 4px;
	background-size: 10px;
	background-repeat: no-repeat;
}
.csdkPopOutBox.csdkFilterPopOutBox input
{
	border-width: 0px;
	background-color: transparent;
	margin:0;
	color: #fff;
	cursor: pointer;
	max-width: 432px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.csdkPopOutBoxContent.csdkFilterPopOutBoxContent
{
	min-height: 0px;
	margin: 0px;
	padding: 6px 4px;
	border-radius: 6px;
	background:#fff;
	font-size: 12px;
}


/***IE11 differences***/

/* variable issue*/
/*IE 9 and above*/
@media screen and (min-width:0\0) and (min-resolution: +72dpi) {

.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges {border-top: 1px solid #dfdfdf;}
.csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders
{
	flex-basis: 251px;
	border-top:1px solid #dfdfdf;
}







}
/*input range style*/

input[type=range] {
	-webkit-appearance: none;
	width: 100%;
	margin: 5.8px 0;
}
input[type=range]:focus {
	outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
	width: 100%;
	height: 6px;
	cursor: pointer;
	box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
	background: #bcbec0;
	border-radius: 1.3px;
	border: 0.2px solid rgba(0, 0, 0, 0);
}
input[type=range]::-webkit-slider-thumb {
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
	border: 0px solid rgba(0, 0, 0, 0);
	height: 20px;
	width: 20px;
	border-radius: 10px;
	background: #449fd8;
	cursor: pointer;
	-webkit-appearance: none;
	margin-top: -6px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
	background: #c9cbcc;
}
input[type=range]::-moz-range-track {
	width: 100%;
	height: 6px;
	cursor: pointer;
	box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
	background: #bcbec0;
	border-radius: 1.3px;
	border: 0.2px solid rgba(0, 0, 0, 0);
}
input[type=range]::-moz-range-thumb {
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
	border: 0px solid rgba(0, 0, 0, 0);
	height: 20px;
	width: 20px;
	border-radius: 10px;
	background: #449fd8;
	cursor: pointer;
}
input[type=range]::-ms-track {
	width: 100%;
	height: 6px;
	cursor: pointer;
	background: transparent;
	border-color: transparent;
	color: transparent;
}
input[type=range]::-ms-fill-lower {
	background: #afb1b4;
	border: 0.2px solid rgba(0, 0, 0, 0);
	border-radius: 2.6px;
	box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
}
input[type=range]::-ms-fill-upper {
	background: #bcbec0;
	border: 0.2px solid rgba(0, 0, 0, 0);
	border-radius: 2.6px;
	box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
}
input[type=range]::-ms-thumb {
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
	border: 0px solid rgba(0, 0, 0, 0);
	height: 20px;
	width: 20px;
	border-radius: 10px;
	background: #449fd8;
	cursor: pointer;
	height: 8.4px;
}
input[type=range]:focus::-ms-fill-lower {
	background: #bcbec0;
}
input[type=range]:focus::-ms-fill-upper {
	background: #c9cbcc;
}


/*input range style END*/


.csdkDirBrowser .csdkRow.item .csdkCell .disclosureWrapper.separator
{
	border-bottom: 1px dashed #dadada !important;
	width: 100%;
	display: inline-flex;
}

.csdkRow.item.separator {
	pointer-events: none;
}

.csdkRow.item.separator .csdkCell:first-child {
	display: none;
}




/***USER MENU SELECTOR***/

div.csdkPopOutBoxContent.UMS_PopOutBoxContent
{
	filter: none;
	box-shadow: rgba(50, 50, 50, 0.3) 0px 4px 10px;
}

.csdkDirBrowser.hierarchical.UMS_Menu
{
	display: block; 
	background: var(--mainBackground) !important;
	overflow: visible;
	overflow-y: unset !important;
}

.csdkDirBrowser.UMS_Menu 
{
	border-radius: 0.35rem;
	overflow-y: auto;
}

div#coral_AlertPopUpDiv.UMS_DialogBox.Mode_accordion
{
	width: auto !important;
}

div#coral_AlertPopUpDiv.UMS_DialogBox .csdkDirBrowser.hierarchical.UMS_Menu{
	display: none;
	box-shadow: 0px 0px 10px #3333332e;
}

div#coral_AlertPopUpDiv.UMS_DialogBox .csdkDirBrowser.hierarchical.UMS_Menu.active{                                           
	display: block;                                                                                                 
	margin-left: 20px;
	z-index: 1000;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTableBody {
	padding: 5px 0;
	background: white;
	border-radius: 0.25rem;
	overflow:visible;
}

.csdkDirBrowser.hierarchical.UMS_Menu .disclosureContent {
	min-width: 200px;
	left: 100%;
	top: 0px;
	padding: 5px 0;
	position: absolute;
	background: #fff !important;
	border-radius: 0.25rem;
	width: calc(100% - 40px);
	border-color: var(--colorBorder) !important;
	z-index: 10;
	resize: both;
	height: auto !important;
}


.UMS_MenuWrapper .hierarchical.UMS_Menu .csdkDirBrowser .csdkRow > .csdkCell:first-child
{                                  
	background: url(../images/folderClose.svg) no-repeat 3px top;
	background-size: 15px;
	background-color: red;
	height: 22px;
	width: 22px;
	min-width: 22px;
	border-radius: 0.25rem;
	flex-basis: 22px;
	margin-right: 5px;
}

.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child 
{
	margin-right: 5px;
	height: 22px;
	width: 22px;
	border-radius: 0.25rem;
	flex-basis: 22px;
}
.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.item > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.item > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.item > .csdkCell:first-child
{
	background-image: url(/images/iconW_item.svg);
	background-size: 11px;
	background-position: center;
	background-color: #9acc00;
}


div#coral_AlertPopUpDiv.UMS_DialogBox.Mode_accordion .showQuery_Expansion {
	width: fit-content !important;
	margin: 0;
	padding: 0 !IMPORTANT;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child
{
	background-image: url(/images/iconW_folder.svg);
	background-size: 12px;
	    background-position: center center;
	background-color: #6582d4;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child
{
        display: none;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child + .csdkCell,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child  + .csdkCell,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child  + .csdkCell
{
        padding-left: 27px;
	position: relative;
	overflow: inherit;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child + .csdkCell:before,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child  + .csdkCell:before,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child  + .csdkCell:before
{
	background-image: url(/images/iconW_folder.svg);
	background-size: 12px;
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 0.25rem;
	background-color: #6582d4;
	content: ' ';
	display: inline-block;
	width: 22px;
	height: 22px;
	position:absolute;
	left: 0px;
	top: -3px;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before
														{
																	        background-image: url(/images/iconW_folderOpen.svg);
																		        background-size: 13px;
																			        background-position: 5px 6px;
																				        background-color: #6582d4;
																					}


div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.open {
	background: rgb(238 249 255);
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable
{
	margin: 0px;
	background: white;
	border-radius: 0.25rem;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTableBody .csdkCell:first-child {
	margin-right: 5px;
	background-color: red;
	width: 25px;
	height: 25px;
	border-radius: 0.25rem;
	flex-basis: 25px;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkRow.csdkHeader
{
	width: calc(100% - 20px);
	padding: 10px 10px 5px 10px;
}

.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkRow.csdkHeader
{
	width: 100%;
	padding: 0;
}

.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .disclosureLabel
{
	text-align: left;
	font-weight: normal;
	font-size: 12px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow,
.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow
{
	padding: 5px 10px;
	width: calc(100% - 20px);
	cursor: pointer;
}

div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow
{
	padding: 5px 0px;
	width: 100%;
	cursor: pointer;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow:hover,
.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow:hover,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow:hover
{
	background-color: #f4f6f9;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow.separator,
.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow.separator,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.separator
{
	padding: 0 7px;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow .csdkCell:nth-child(2),
.UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow .csdkCell:nth-child(2),
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow .csdkCell:nth-child(2)
{
	    margin-top: 2px;
}

.csdkDirBrowser .csdkRow.item .csdkCell .disclosureWrapper.separator
{
	border-bottom: 2px solid var(--colorBorder);
}

.csdkRow.item.separator .csdkCell:first-child {
	display: none;
}

.UMS_DialogBox .UMS_MenuWrapper .csdkCell > div
{
	display: block;
	width: 100%;
}

.UMS_DialogBox.Mode_hierarchical .showQuery_Expansion .UMS_MenuWrapper {
    text-align: center;
        margin-top: 15px;

}

.UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn {
	background-size: 20px;
	padding: 5px 10px;
	text-transform: capitalize;
	    background: var(--brandAccessible) !important;
	border-radius: var(--borderRadiusMedium);
	cursor: pointer;
	height:35px;
	width: calc(100% - 40px);
	color: #fff;
	font-size: 13px;
   	margin: 10px auto 5px;
	border: 0px;
}

.UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn:hover
{
	background: var(--brandAccessibleActive) !important;
}


.UMS_DialogBox .showQueryTableCellTextTextSpan
{
	font-size: 14px !important;
	text-align: center !important;
	padding: 20px 20px 5px !important;
	min-height: 20px !important;
}

.csdkPopOutBoxContent.UMS_PopOutBoxContent {
	padding: 0;
	border-radius: 0.5rem;
}

#USERMENUSELECTOR
{
	background-color: var(--mainBackground);
}

#USERMENUSELECTOR .csdkDWindTitleBar
{
	border-bottom: 1px solid #D1D2D4;
}

.UMS_PopOutBoxContent .UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn
{
	width: 100%;
	margin: 0;
}

div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div  button {
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	background-size: 12px;
	font-size: 12px;
	padding: 10px;
	background-position: 5px center;
	margin-right: 3px;
}

div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div  button:hover
{
	background-color: #f4f6f9;
}


.UMS_PopOutBoxContent .UMS_MenuWrapper {
	min-width: 200px;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkHeader .csdkCell div
{
	    display: contents;
}


div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div {
        background: white;
	margin: 10px;
}
.UMS_PopOutBoxContent .UMS_MenuWrapper .csdkDirBrowser.hierarchical.UMS_Menu.active .disclosureContent
{
	left: 100px;
	min-width: 200px;
}

div#USERMENUSELECTOR .csdkDWindContentWindow {
	padding: 0;
	background: white;
}

.UMS_MenuWrapper input[placeholder="Search"] {
	background: var(--mainBackground) !important;
	width: 100%;
	text-transform: capitalize !important;
	border: 1px solid lightgray !important;
	font-size: 13px !important;
	margin-bottom: 5px !important;
	background-image: url(../images/iconB_search.svg) !important;
	background-repeat: no-repeat !important;
	background-position: calc(100% - 8px) center !important;
	background-size: 13px !important;
	text-transform: capitalize !important;
	font-size: 12px !important;
	font-family: SalesforceSans-Regular, arial !important;
	padding: 0.2rem 0.5rem;
	border: 1px solid !important;
	border-color: var(--colorBorder) !important;
	border-radius: var(--borderRadiusMedium) !important;
	height: 20px;}

div#coral_AlertPopUpDiv.UMS_DialogBox .showQuery_Expansion 
{
    padding: 0 20px !important;
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu {
	border: 0;
	resize: none;
	width: 100%;
	overflow-y: auto;
}

.csdkDirBrowser.UMS_Menu .csdkRow.open > .csdkCell > .disclosureWrapper > .disclosureContent {
	display: block;
	margin-top: 5px;
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkHeader .csdkCell > div {
	width: calc(100% - 20px);
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkHeader .csdkCell > div input[placeholder="Search"]
{
	width: calc(100% - 15px);
}

div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkHeader .csdkCell
{
	justify-content: left;
}

div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkHeader .csdkCell > div
{
         width: calc(100% - 20px);                                                                                   
}
div#coral_AlertPopUpDiv.UMS_DialogBox button[disabled="true"],
div.csdkPopOutBoxContent.UMS_PopOutBoxContent button[disabled="true"]{
	background: var(--disabled-button-background-color) !important;
	filter: grayscale(1);
	pointer-events: none;
}

.USM_ToolTip
{
	z-index:99999 !important;
}

.showQuery_Table span.showQueryTableCellTextTextSpan:empty, 
div#coral_AlertPopUpDiv.stepUpAuth .showQuery_Expansion:empty
{
	display:none !Important;
}

div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTextSpan
{
	color: #999 !important;
	display: block;
	max-width: 100%;
	text-align: left !important;
	font-size: 12px !important;
	border-bottom: 1px solid var(--colorBorder) !important;
	min-height: 10px !important;
	padding: 10px !important;
	margin: 0;
	width: calc(100% - 20px) !important;
}

div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTextSpan span
{
	/* color: red !Important; */
}

div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTextSpan span.itemSelected
{
	color: var(--brandAccessible) !important;
}


/***SALESFORCE**/

.salesforce .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child, div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child {
	height: 20px;
	width: 20px;
	border-radius: 0.2rem;
	flex-basis: 20px;
	margin-right: 5px;
}

.salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow, 
.salesforce .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow {
	padding: 3px 7px;
}

.salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child, 
.salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.folder > .csdkCell:first-child, 
.salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child 
{
        background-size: 11px;
	    background-position: center;
}

.salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child, 
.salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child, 
.salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder.open > .csdkCell:first-child 
{
	background-size: 12px;
	background-position: center;
}

.salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.item > .csdkCell:first-child, 
.salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.item > .csdkCell:first-child, 
.salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.item > .csdkCell:first-child 
{
        background-size: 9px;
}

.salesforce div#coral_AlertPopUpDiv.csdkDialog {
	position: absolute;
	left: 50px !important;
	top: 50px !important;
}

.salesforce .UMS_DialogBox .showQuery_Expansion
{
	margin: 0;	
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion 
{
	border: 0;
	resize: none;
	width: 600px;
	display: flex;
	flex-direction: row;
	max-width: 600px;
	overflow: auto;
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable
{
        display: none;
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable.open,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable.Root,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable.open,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable.Root
{
	display: block;
}  

.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable {
	padding: 10px;
}

.UMS_PopOutBoxContent .UMS_MenuWrapper .UMS_ClosePopOutBtn
{
	background: url(../images/close.svg);
	width: 15px;
	height: 15px;
	border: 0;
	position: absolute;
	right: 2px;
	top: 2px;
	z-index: 10;
	left: auto;
	background-repeat: no-repeat;
	background-size: 6px 6px;
	border-radius: 50%;
	background-position: center;
	cursor: pointer;
}   


.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion > .csdkTable ,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion > .csdkTable
{
	margin: 0px;
	border-right:1px solid var(--colorBorder) !important;
	padding: 10px 0;
	min-width: 150px;
	display: none;
}

.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion > .csdkTable
{
	padding: 10px;
}

.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion > .csdkTable.open,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion > .csdkTable:first-child,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion > .csdkTable.open,
.UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion > .csdkTable:first-child
{
	display: flex;
}

.csdkDialog.UMS_DialogBox ::-webkit-scrollbar,
.UMS_PopOutBoxContent ::-webkit-scrollbar
{
	width: 10px !important;
	background-color: #eeeeee9e !important;
	height: 5px;
} 

.csdkDialog.UMS_DialogBox ::-webkit-scrollbar-thumb,
.UMS_PopOutBoxContent  ::-webkit-scrollbar-thumb
{
	background: #d7d7d7;
}

div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTitle,
.UMS_PopOutBoxContent .showQueryTableCellTextTitle
{
	border-bottom: 2px solid var(--colorBorder) !important;
}

span#postOutcomeReasonDisplaySpan {
        padding: 3px 7px;
	display: inline-block;
	border-radius: 0.2rem;
	    cursor: pointer;
	background: var(--mainBackground) !important;
	color: var(--color-text-link) !important;
	font-family: SalesforceSans-Bold, arial !important;
	text-transform: capitalize !important;
	border: 1px solid lightgray !important;
	margin-bottom: 3px;
	font-size:13px !important;
}

span#postOutcomeReasonDisplaySpan:hover
{
	background-color: #f1f5fc !important;
}


/**IE11**/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {

.UMS_DialogBox .showQuery_TableRow
	{
		display: block;
	}


.showQuery_Expansion .UMS_MenuWrapper .csdkCell
	{
	display: block;
	}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow :nth-child(2).csdkCell, .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow :nth-child(2).csdkCell, div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow :nth-child(2).csdkCell
{
	text-align: left;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.item > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.item > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.item > .csdkCell:first-child
{
	background-image: url(../images/iconW_item.svg);
	background-size: 11px 12px;
	background-position: 4px 4px;
	background-color: #9acc00;
}

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child
{
	background-image: url(../images/iconW_folder.svg);
	background-size: 14px 11px;
	background-position: 6px 6px;
	background-color: #6582d4;
}                                                                                                                                          

.csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child,
.UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder.open > .csdkCell:first-child,
div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder.open > .csdkCell:first-child
{
	background-image: url(../images/iconW_folderOpen.svg);
	background-size: 14px 11px;
	background-position: 6px 6px;
	background-color: #6582d4;
}

div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkHeader .csdkCell > div
{
	width: 100%;
}

.UMS_MenuWrapper input[placeholder="Search"] {
        background: var(--mainBackground) !important;
	width: calc(100% - 20px);
	background-image: url(../images/iconB_search.svg) !important;                                                                      
	background-repeat: no-repeat !important;
	background-position: calc(100% - 8px) center !important;
	background-size: 13px 13px !important;
}

.UMS_PopOutBoxContent .UMS_MenuWrapper {
	position: relative;
	width: 200px;
}

}




/* DirBrowser accordion  menu */

.csdkDirBrowser.accordion,
.csdkDirBrowser.accordion
{       
        position:static;
        border: 0;
        overflow-x: auto;
        width: 100% !important;
        max-width: 100% !important;
        resize: none;
}

.csdkDirBrowser.accordion.csdkTable,
.csdkDirBrowser.accordion .csdkTable
{       
        margin: 0;
        max-height: 322px;
        overflow: auto;
}
.csdkDirBrowser.accordion .csdkTable:first-child, 
.csdkDirBrowser.accordion .csdkTable.open
{
	display: inline-flex;
}
.csdkDirBrowser.accordion 
{
        display: flex;
        flex-direction: row;
        border-bottom: 1px solid lightgray;
        border-left: none;
        min-width: 530px;
        max-width: 640px;
        overflow-x: auto;
        z-index: 10;
        background: #fff;
        font-size: 14px;
	height: 280px;
	max-height: 280px;
	min-height: 280px;
}
.csdkDirBrowser.accordion .csdkTable
{
        flex-basis: 210px;                                                                                                                                
        flex-grow: 0;
        overflow: hidden;
        display:none;
        min-width:210px;
        margin: 0;
}
.csdkDirBrowser.accordion .csdkTable:first-child,
.csdkDirBrowser.accordion .csdkTable.open
{
            display: inline-flex;
        overflow-y: auto;
}
.csdkDirBrowser.accordion .csdkTable:first-child .csdkTableBody,
.csdkDirBrowser.accordion .csdkTable.open .csdkTableBody
{
            min-width:202px;
}
.csdkDirBrowser.accordion .csdkTable:first-child:hover .csdkTableBody,
.csdkDirBrowser.accordion .csdkTable.open:hover .csdkTableBody
{
            min-width: 202px;
}

.csdkDirBrowser.accordion .csdkTable
{
        border-right: 1px solid lightgray;
}
.csdkDirBrowser.accordion .csdkTable:last-child
{
}
.csdkDirBrowser.accordion .csdkRow
{
        padding: 0;
            position: relative;
        line-height: 22px;
}
.csdkDirBrowser.accordion .EWTFresh,
.csdkDirBrowser.accordion .EWTRefreshing,
.csdkDirBrowser.accordion .EWTStale
{
        max-height: 16px;
        line-height: 18px;
        padding-top: 0;
        justify-content: flex-end;
        min-width: 37px;
        font-weight: normal;
}
.csdkDirBrowser.accordion .csdkRow.folder .disclosureWrapper div.category button,
.csdkDirBrowser.accordion .csdkRow.item .disclosureWrapper div.item button
{       
        background-color: var(--main-button-hover);
}

.csdkDirBrowser.accordion .csdkRow.item > .csdkCell.favourite + .csdkCell,
.csdkDirBrowser.accordion .csdkRow.item > .csdkCell.notfavourite + .csdkCell
{       
        min-width: 126px;
        width: 126px; 
        margin-right: 3px;
}
.csdkDirBrowser.accordion .csdkRow.folder.favourites
{       
        border-bottom: 1px solid lightgray;
        padding-bottom: 6px;
        margin-bottom: 6px;
}
.csdkDirBrowser.accordion .csdkRow.item > .csdkCell.favourite
{       
        background: url(../images/favFilled.svg) no-repeat left top;
        background-size: 17px;
}
.csdkDirBrowser.accordion .csdkRow.item > .csdkCell.notfavourite
{       
        background: url(../images/favUnfilled.svg) no-repeat left top;
        background-size: 17px;
}
.csdkDirBrowser.accordion .csdkTable::-webkit-scrollbar
{       
        width: 8px;
}
.csdkDirBrowser.accordion .csdkTable .csdkRow.folder > .csdkCell:last-child
{       
        background: none;
        background-size: 6px;
        min-width: 8px;
        width: 100%;
        flex-grow: 0;
}
.csdkDirBrowser.accordion .csdkRow:hover
{
        background-color: var(--main-button-hover);
}
.csdkDirBrowser.accordion .csdkRow:hover .csdkCell.EWTFresh:last-child,
.csdkDirBrowser.accordion .csdkRow:hover .csdkCell.EWTRefreshing:last-child,
.csdkDirBrowser.accordion .csdkRow:hover .csdkCell.EWTStale:last-child
{
        margin-right:8px;
        min-width: 29px;
}
.csdkDirBrowser.accordion .csdkRow.open:hover .csdkCell:last-child
{
        margin-right:0px;
}
.csdkDirBrowser.accordion .csdkRow.folder.open
{
        background-color: var(--main-background-selected);
        background: url(/images/icon_arrowRightG.svg) no-repeat calc(100% - 0px) center;
        background-size: 6px;
}

.csdkTable .csdkFooter .csdkCell.csdkfResultHidden 
{
	display: none !important;
}


/**  key focus  **/
body.kbnav #transferDiv div:focus,
body.kbnav #actionDiv div:focus,
body.kbnav #previousCallDataDiv div:focus,
body.kbnav #callDataDiv div:focus,
body.kbnav #callStatusDiv div:focus,
body.kbnav #affinityStatusDiv div:focus,
body.kbnav #previousCallDataShowLabel:focus, 
body.kbnav #CreditApplianceGoesHere input[type="button"]:focus,
body.kbnav #CreditApplianceGoesHere input[type="button"]:focus,
body.kbnav .transferPopUpActions input[type="button"]:focus,
body.kbnav .transferPopUpActions[type="button"]:focus,
body.kbnav .selectMaxCallTimerWrapper:focus,
body.kbnav input.transferTypeButton[type="button"]:focus,
body.kbnav .mmdPop button:focus,
body.kbnav .mmdPop input[type="button"]:focus,
body.kbnav #CreditApplianceGoesHere #transferCancelButton:focus, 
body.kbnav #CreditApplianceGoesHere #redButton[value="HotDesk"]:focus,
body.kbnav #CreditApplianceGoesHere #redButton[value="Change Number"]:focus,
body.kbnav label.keypadRevealer_inputClass:focus,
body.kbnav button#asw_testWind_runCanCelTestcase:focus,
body.kbnav .configuratorButtonWrapper .configuratorGenerateButton:focus,
body.kbnav .configuratorButtonWrapper .configuratorResetButton:focus,
body.kbnav .configuratorButtonWrapper .configuratorSaveButton:focus,
body.kbnav .csdkDialog .showQuery_ButtonRow button:focus,
body.kbnav button#dismissCancel:focus,
body.kbnav button.dismissCancel:focus, button#dismissOk:focus, 
body.kbnav #launchPandora:focus, div.csdkDWindButtonDock:focus,
body.kbnav #standardHeading:focus,
body.kbnav #standardHeading .coralDockRightIconWrapper .plus:focus, 
body.kbnav #NotificationsGoesHere button:focus, 
body.kbnav #hotdeskContent #hotdesk_registerDN:focus, 
body.kbnav #hotdeskMaster .navigation li:focus, 
body.kbnav #hotdeskContent:focus, span#hotdeskSpanID:focus, 
body.kbnav #searchCallerWindow .coralDraggableWindowContentWindow input[type="button"]:focus, 
body.kbnav div#authenticateCallerButtonWrapper button:focus, 
body.kbnav #AgentScript input[type="button"]:focus, 
body.kbnav #transferWidgetWindow #Destination button:focus, 
body.kbnav .statusWidget_right_queueWrapperTitleClass,
body.kbnav .statusWidget_right_agentWrapperTitleClass:focus,
body.kbnav .acbWidgetDock ul.WidgetTabBar li:focus,
body.kbnav .acb_tableTitleCell:focus, 
body.kbnav .coralDock #standardHeading .coralDraggableWindowLeftDockedWindowIcon:focus,
body.kbnav #expandedContent button:focus,
body.kbnav #expandedContent input[type="button"]:focus,
body.kbnav .coralDraggableWindowContentWindow input[type="button"]:focus,
body.kbnav .DesktopOrchestrationToolkitWindow .ButtonBar button:focus,
body.kbnav .userbtn button:focus,
body.kbnav .greybutton:focus, 
body.kbnav #AdminTool .tenantWrapper li .after_hide_text:focus,
body.kbnav #AdminTool .systemWrapper li .after_hide_text:focus,
body.kbnav .destlisteditResetButton:focus, 
body.kbnav .fileUpload:focus,
body.kbnav  .destlisteditButtonWrapper input[type="button"]:focus,
body.kbnav .destlisteditButtonWrapper button:focus,
body.kbnav .ComboSelect.chooseGroupsOnly:focus,
body.kbnav .dleSearchInput:focus,
body.kbnav .coralkvptable .kvpTableValueCell:focus, 
body.kbnav #EATESTHARNESS .csdkDWindDockedSpan:focus, 
body.kbnav #OCMEA .csdkDWindDockedSpan:focus,
body.kbnav .csdkDWindDockedSpan:focus,
body.kbnav .growAnimate .coralDraggableWindowDockedSpan:focus,
body.kbnav #coralChangePasswordDiv:focus, 
body.kbnav .LeftsAdmin button#logoutButton:focus,
body.kbnav #container .CreditApplianceDock #agentStatusText:focus,
body.kbnav #previousCallDataShowLabel:focus, #transferDiv div:focus,
body.kbnav #actionDiv div:focus, 
body.kbnav #previousCallDataDiv div:focus, 
body.kbnav #callDataDiv div:focus,
body.kbnav #callStatusDiv div:focus,
body.kbnav #affinityStatusDiv div:focus,
body.kbnav #previousCallDataShowLabel:focus,
body.kbnav #CreditApplianceGoesHere input[type="button"]:focus,
body.kbnav input#authenticateCallerButton:focus,
body.kbnav input#previousCallCallBackButton:focus, 
body.kbnav label.keypadRevealer_inputClass:focus, 
body.kbnav #CreditApplianceGoesHere .skillsSelectDiv select.skillSelect:focus, 
body.kbnav #notReadyTime:focus,
body.kbnav .coralDraggableWindowLeftDockedWindowIcon:focus, 
body.kbnav #standardHeading .coralDockRightIconWrapper div#widgetDisclosure:focus,
body.kbnav #crDockContent input:focus,
body.kbnav #CreditApplianceGoesHere .remoteDestinationText:focus,
body.kbnav .coralDock #standardHeading .coralDraggableWindowLeftDockedWindowIcon:focus,
body.kbnav .coralDockRightIconWrapper:focus, 
body.kbnav button.csdkDWindPreviewButton:focus,
body.kbnav #CTIA_remoteDestinationText ul li:focus,
body.kbnav .activateFavouritesManager:focus,
body.kbnav:focus,
body.kbnav input[type="button"]:focus,
body.kbnav .inCallNotesTextArea:focus,
body.kbnav #standardHeading .coralDockRightIconWrapper .minus:focus,
body.kbnav #ASW #favourites #selectTargetDN:focus,
body.kbnav .recordWrapper:focus,
body.kbnav .recordTitle:focus,  body.kbnav .recordButton:focus,
body.kbnav .csdkDirBrowser > .csdkTable:focus,
body.kbnav .csdkDirBrowser.hierarchical.creditAppliance_notReadyReasonsOneClickMenu:focus,
body.kbnav .csdkDirBrowser.hierarchical.creditAppliance_notReadyReasonsOneClickMenu .csdkRow.item:focus,
body.kbnav .ComboSelect:focus,
body.kbnav #CreditApplianceGoesHere .infoListCell:focus,
body.kbnav #CreditApplianceGoesHere #tableDiv .infoListRightIcon:focus,
	body.kbnav .callStatusWrapper .infoListWrapper:focus,
body.kbnav .callStatusWrapper .infoListWrapper .infoListRow:focus,
body.kbnav .csdkPopOutBox:focus,
body.kbnav .csdkPopOutBox div:focus,
body.kbnav div#expandedContent .CLCallInfoCell select:focus
{
    outline: 3px solid rgb(102 204 255 / 25%);
    border-radius: 0.25rem;  
    outline-offset: 4px;
    outline-style: groove;
    background-color: #ecf6ff;
}

body.kbnav SPAN.HierarchicalMenuFrame ul li:focus,
body.kbnav #crDockContent button:focus,
body.kbnav #crDockContent .csdkTableBody .csdkRow:first-child .csdkCell:focus
{
	 outline: 3px solid rgb(102 204 255 / 25%);
    outline-offset: -3px;
    outline-style: groove;
    background-color: #ecf6ff;
}

body.kbnav #expandedContent #CLCallInfoWrapper input[type="button"]:focus
{
	outline: 3px solid rgb(102 204 255 / 25%);
	outline-offset: 3px;
	outline-style: groove;
	background: #333;
}

body.kbnav #actionDiv .keypadDigitClass:focus,
body.kbnav #actionDiv .recordButton:focus,
body.kbnav #standardHeading.toolHeader_4_nr + #expandedContent #CreditApplianceGoesHere #muteButton:focus,
body.kbnav div#expandedContent .CLCallInfoCell input:focus,


{
	outline: 3px solid rgb(102 204 255 / 25%);
	border-radius: 0.25rem;  
	outline-offset: 0px;
	outline-style: solid;
}


/********  Enhanced Combo Select   **********/

.csdkDirBrowser.enhancedComboSelect 
{
    border: 0px;
    resize:none;
    /* min-height: 25px; */
    /* display: inline-flex; */
    padding: 0;
    margin: 0;
    overflow: visible;
}


.csdkDirBrowser.enhancedComboSelect .Root .csdkRow.csdkHeader
{
    width:100%;
}

.csdkDirBrowser.enhancedComboSelect .csdkHeader .csdkCell
{
    justify-content: flex-start;
}

.csdkDirBrowser.enhancedComboSelect input[placeholder="Search"],
.csdkDirBrowser.enhancedComboSelect input[type="text"]
{
    border: var(--border-lightgray);
    border-radius: var(--borderRadiusMedium) !important;
    padding: 4px 30px 4px 8px;
    width: calc(100% - 33px);
    background-image:url(../images/searchIcon.svg);
    background-size: 12px;
    background-repeat:no-repeat;
    background-position: calc(100% - 8px) 6px;
    background-color: var(--mainBackground);
    padding-right: 22px;
    text-overflow: ellipsis;
}

.csdkDirBrowser.enhancedComboSelect input[type="text"]
{
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 9.1 6.2' style='enable-background:new 0 0 9.1 6.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%234082C3;%7D%0A%3C/style%3E%3Cg%3E%3Cg id='Layer_1-2'%3E%3Cpolygon class='st0' points='4.5,6.2 9.1,0 0,0 '/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
	background-size: 9px;
	background-repeat:no-repeat;
	background-position: calc(100% - 8px) center;
}

.csdkDirBrowser.enhancedComboSelect input[type="text"]:disabled 
{
	pointer-events: none;
	filter: grayscale(1);
	background-color: #d7d7d7;
	opacity: 0.7;
}

.csdkDirBrowser.enhancedComboSelect .csdkTable.Root 
{
    margin: 0;
    position: relative;
    z-index: 1;
    /* top: 0; */
}

.csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody 
{
    max-height: 170px;
    border: var(--border-lightgray);
    margin: 0 5px 5px;
    position: relative;
    top: -1px;
    display:none;


    overflow-y: auto;
    box-shadow: rgb(202, 199, 197) 0px 0px 3px;
    resize: none;
    border-radius: var(--borderRadiusMedium) !important;
    height: auto !important;
    background-color: var(--mainBackground);
}

.csdkDirBrowser.enhancedComboSelect.active .csdkTable.Root .csdkTableBody 
{
	display: block;
	position: absolute;
	top: 26px;
	width: calc(100% - 8px);
	margin-left: 0px;
}

.csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody .csdkRow
{
    padding: 7px 10px;
    cursor:pointer;
    flex-direction:row-reverse;
    border-bottom: 1px solid rgb(230, 230, 235);
    transition:0.2s background;
    width: calc(100% - 20px);
    min-width: 170px;
}

.csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody .csdkRow:hover
{
    background-color: rgb(230 231 232 / 54%);
}

.csdkDirBrowser.enhancedComboSelect .csdkRow.csdkHeader 
{
    padding: 0;
}

.csdkDirBrowser.enhancedComboSelect .csdkRow.item > .csdkCell:first-child 
{
    background-image:url(../images/tickGreen.svg);
    background-size: 11px;
    background-repeat:no-repeat;
    background-position: right 2px;
    display:none;
}


.csdkDirBrowser.enhancedComboSelect .csdkTable.Root .disclosureLabel 
{
   
    cursor: pointer;
    color: var(--color-text-link) !important;
}


.csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar {
     width: 8px; 
}       
        
.csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-track 
{
     background: #f6f6f6;
}

.csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-thumb 
{
     background: #dbd9d9; 
     border-radius:0.5rem;
}       
        
.csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-thumb:hover 
{
     background: #c5c5c5;
     cursor:pointer;
}

.csdkDirBrowser.enhancedComboSelect .csdkRow.item.is_selected 
{
    background: var(--color-background-selection);
}

.csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkRow.csdkHeader .csdkCell > div
{
    width: calc(100% - 4px);
}



/*** enhanced combo select end here  ***/

.csdkDisableDockOverlay
{
	position: absolute;
	background-color: rgb(230 230 230 / 85%);
	z-index: 1;
	top: 0px;
	left: 0px;
	width: 100%;
	display: block;
	height: 100%;
}








/* CoralVersion:4.8.000.3971 */


/****************************************************************************/
/*                              coral7 csdk                                */
/***************************************************************************/

/****************************************************************************/
/*  IMAGE UPLOADER                                                         */
/***************************************************************************/

#coral7 .csdkImageUploadWrapper .csdkCell
{
	justify-content:center;
	overflow: unset;
}

#coral7 .csdkImageUploadWrapper .csdkRow.vertical
{
	height:100%;
}

#coral7 .csdkImageUploadWrapper.highlight
{
	background-color: #90cfee26;
}
#coral7 .csdkImageUploadWrapper
{
	color: #424143;
	vertical-align: middle;
	border-radius: 5px;
	margin: 5px;
}

#coral7 .csdkImageUploadWrapper .csdkTableBody .csdkRow .csdkCell:last-child
{
	position: absolute;
}

#coral7 .csdkImageUploadWrapper progress
{
	visibility: hidden;
	position: absolute;
}

#coral7 .csdkImageUploadWrapper .csdkTableBody .csdkRow .csdkCell
{
	
}

#coral7 .csdkImageUploadImage
{
	max-height: 145px;
	max-width: 145px;
	justify-self: center;
	align-self: center;
}
#coral7 .csdkImageUploadImageDivSpan
{
	position:absolute;
	font-size: 12px;
	font-family: arial;
	justify-self: center;
	align-self: center;
}
#coral7 .csdkImageUploadImageDiv
{
	position:relative;
	min-height: 150px;
	min-width: 150px;
	max-height: 150px;
	max-width: 150px;
	padding: 10px;
	margin: 10px;
	border-radius: 5%;
	border: 2px dashed #dbdbdb;
	display: grid;
}
#coral7 .csdkImageUploadInputLabel
{
	background-color: white;
	box-sizing: border-box;
	color: #333;
	display: inline-block;
	padding: 5px 15px 5px 30px;	
	text-align: center;
	font-size: 12px;
	font-family: arial;
	border: 1px solid #ee3e54;	
	background: url(../images/c7/upload.svg) no-repeat;
	background-size: 14px;
	background-position: 9px 4px;
}
#coral7 .csdkImageUploadInput
{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

#coral7 .csdkImageUploadInput:focus + .csdkImageUploadInputLabel,
#coral7 .csdkImageUploadInputLabel:hover
{
	background-color: #ee3e54;
	cursor: pointer;
	background-color: #ececec;
	transition: all 0.7s ease;
}


/****************************************************************************/
/* CSDK TABLE                                                               */
/*e**************************************************************************/
#coral7 #loggedinEntry > .csdkTable, 
#coral7 .csdkTableBody
{
	display: flex;
	flex-flow: column nowrap;
	flex: 1 1 auto;
	height: 100%;
}
#coral7 .csdkTable, .csdkTableBody
{
	display: flex;
	flex-flow: column nowrap;
	flex: 1 1 auto;
}
#coral7 #loggedinEntry > div.csdkTable > div > div.csdkCell.rightMaster > div.csdkTable > div.csdkRow.column,
#coral7 #loggedinEntry > .csdkTable > .csdkRow
{
	flex-grow: 1;
}
#coral7 .csdkRow.csdkHeader .csdkCell {
        font-family: var(--main-font-Bold);
	font-weight: normal;
	color: var(--colorTextSubBasic);
	font-size: 13px;
}
#coral7 .csdkRow
{
	display: flex;
	flex-flow: row nowrap;
}
#coral7 .csdkCell
{
        display: flex;
        flex-flow: row nowrap;
        flex-grow: 1;
        word-break: break-word;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0px;
        white-space: nowrap;
}
#coral7 .csdkCell.widgetSection
{
        overflow: visible;
}



#coral7 .coraldivtable_table
{
	display: table;
}

#coral7 .coraldivtable_header
{
	display: table-header-group;
}
#coral7 .coraldivtable_header_tr,
#coral7 .coraldivtable_body_tr
{
	display: table-row;
}
#coral7 .coraldivtable_body
{
	display: table-column-group
}
#coral7 .coraldivtable_body_td,
#coral7 .coraldivtable_header_th
{
	display: table-cell	
}


#coral7 div.coralDraggableWindow
{
	position: absolute;
	z-index: 20;
	left: 810px;
	top: 363px;
	display: block;
	min-width:200px;
	height:auto;
	box-shadow: var(--boxShadow);
	background: var(--mainBackground);
	border-radius: 0.5rem 0.5rem 0 0;
}
#coral7 div.coralDraggableWindowTitleBarActive
{
	color:#323232;
	background-image: #d1d2d4;
	background: #d1d2d4;
}

#coral7 div.coralDraggableWindowContentWindow
{
	position: relative;
	top: 0px;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border: 1px solid var(--colorBorder);
	border-top: 0px;
	background: var(--mainBackground);
	overflow: hidden;
	color: var(--colorTextBasic);
}

#coral7 div.coralIEElementResize
{
    -webkit-user-select: none;
    user-select: none;
	position: absolute;
	height: 10px;
	width: 10px;
	right:1px;
	bottom:1px;
	background: url(../images/c7/resizeIE11.svg) no-repeat left bottom;
	background-size: 10px;
}

#coral7 div.coralDraggableWindowSettingsWindow
{
	width:90%;
	margin-left:auto;
	margin-right:auto;
	overflow:hidden;
}
#coral7 div.coralDraggableWindowSettingsContentWindow
{
	position:absolute;
	top:-109%;
	border-top:1px solid rgba(106, 106, 106, 1.000);
	border: 1px solid rgba(147, 147, 147, 0.770);
	background:white;
	width:90%;
	height:90%;
	margin-left:auto;
	margin-right:auto;
	box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.6);
	transition-property: top;
	transition-duration: 0.5s;
	-webkit-transition-property: top;
	-webkit-transition-duration: 0.5s;
	z-index:100;
}
#coral7 .coralDraggableWindowTitleBar.coralDraggableWindowTitleBarActive #coral7 .coralDraggableWindowTitleBarButtonDock
{
	opacity: 1;
}
#coral7 .coralDraggableWindowTitleBarButtonDock button:last-child
{
	margin-right: 5px;
	border: 0;
	background-color: transparent;
	margin-top: 3px;	
}

#coral7 #transferDiv, #coral7 #actionDiv, #coral7 #previousCallDataDiv, #coral7 #callDataDiv, #coral7 #callStatusDiv, #coral7 #affinityStatusDiv
{
	background: var(--mainBackground);	
}

/****************************************************************************/
/* csdk Window                                                              */
/****************************************************************************/
#coral7 div.csdkDWind
{
	position: absolute;
	z-index: 20;
	display: block;
	min-width: 300px;
	height: auto;
	box-shadow: var(--boxShadow);
	background: var(--mainBackground);
	border: var(--border-lightgray);
	border-radius: 0.5rem 0.5rem 0 0; 
	left: 5px;
	top: 5px;
}
#coral7.slim div.csdkDWind[widget],
#coral7.triple div.csdkDWind[widget],
#coral7.horizontal div.csdkDWind[widget],
#coral7.double div.csdkDWind[widget],
#coral7.bottom div.csdkDWind[widget]
{
	top:0 !important;
	left:0 !important;
}
#coral7 div.csdkDWind.raised
{
	z-index: 100;
}
#coral7.double div.csdkDWind[widget],
#coral7.triple div.csdkDWind[widget],
#coral7.horizontal div.csdkDWind[widget],
#coral7.bottom div.csdkDWind[widget],
#coral7.slim div.csdkDWindn[widget]
{
	height: -webkit-fill-available;
	width: -webkit-fill-available;
	left: 0 !important;
	top: 0 !important;
}
#coral7.bottom div.csdkDWind[widget]
{
	top:0 !important;
	left:0 !important;
}
#coral7.horizontal div.csdkDWind[widget]   
{
	top:52px !important;
	left:0 !important;
}
#coral7 div.csdkDWindTitleBar,
#coral7 div.coralDraggableWindowTitleBar
{
	z-index: 21;
	display: flex;
	line-height: 25px;
	border-radius: 0.5rem 0.5rem 0 0;
        text-align: center;
}

#coral7.left div.csdkDWindTitleBar,
#coral7.right div.csdkDWindTitleBar,
#coral7.right div.coralDraggableWindowTitleBar,
#coral7.left div.coralDraggableWindowTitleBar
{
	background: var(--colorBackground);
}
#coral7.left div.csdkDWindTitleBar .csdkDWindTitle,
#coral7.right div.csdkDWindTitleBar .csdkDWindTitle,
#coral7.right div.coralDraggableWindowTitleBar .csdkDWindTitle,
#coral7.left div.coralDraggableWindowTitleBar .csdkDWindTitle
{
	line-height:36px;
	height: 36px;
}
#coral7.right div.csdkDWindTitleBar,
#coral7.left div.csdkDWindTitleBar,
#coral7.right div.coralDraggableWindowTitleBar,
#coral7.left div.coralDraggableWindowTitleBar
{
	cursor: pointer;
	height: 36px;
	padding: 0;
	margin: 0;
}
#coral7.ec div.csdkDWindTitleBar,
#coral7.ec div.coralDraggableWindowTitleBar
{
	background: transparent;
}
#coral7 div.csdkDWindTitleBar:hover,
#coral7 div.coralDraggableWindowTitleBar:hover
{
	opacity: 0.8;
	transition: opacity 0.2s;
}
#coral7 div.csdkDWindTitleBar:active ,
#coral7 div.coralDraggableWindowTitleBar:active
{
	transition: opacity 0.2s, background 0.2s;
	opacity: 0.8;
}
#coral7 div.csdkDWind .csdkDWindContentWindow
{
	padding: 15px;
	border: 0;
}
#coral7 .csdkDWindTitleBarButtonDock,
#coral7 .coralDraggableWindowTitleBarButtonDock
{
	flex-grow: 0;
	flex-basis: 69px;
	position: absolute;
	right: 3px;
	top: 2px;
}
#coral7 .csdkDWind .csdkDWindTitle,
#coral7 span.coralDraggableWindowTitle
{
	width: 100%;
	background: var(--colorBackground);
	line-height: 33px;
	height: 33px;
	font-family: var(--main-font);
	font-size: 13px;
	border-radius: 0.5rem 0.5rem 0 0;
	text-shadow: none;
	color: var(--colorTextBasic) !important;
	border-bottom: 1px solid lightgray;
}
#coral7 .csdkDWind[widget] .csdkDWindTitle
{
	line-height: 25px;
	height: 25px;
	border-bottom:none;
	background: none;
	text-align: left;
	font-size: 16px;
	font-family: 'Poppins-Bold';
	padding-left: 0px;
}
#coral7.right .csdkDWind[widget] .csdkDWindTitle,
#coral7.left .csdkDWind[widget] .csdkDWindTitle
{
	padding-left: 17px;
}
#coral7.bottom .csdkDWind[widget] .csdkDWindTitle,
#coral7.horizontal .csdkDWind[widget] .csdkDWindTitle
{
	padding-left:3px;
}
#coral7 .csdkDWindTitleBarButtonDock button,
#coral7 .coralDraggableWindowTitleBarButtonDock button
{
	border:none;
	width: 20px;
	height: 22px;
	cursor:pointer;
	filter: grayscale(1);
}
#coral7 .csdkDWindTitleBarButtonDock button:hover,
#coral7 .coralDraggableWindowTitleBarButtonDock button:hover
{
	opacity: 0.8;
}
#coral7 .csdkDWindMinimizeButton,
#coral7 .coralDraggableWindowMinimizeButton,
#coral7 .csdkDWindMaximizeButton,
#coral7 .coralDraggableWindowMaximizeButton,
#coral7 .csdkDWindCloseButton,
#coral7 .coralDraggableWindowCloseButton
{
	background:none;
	pointer-events: none;
	border:none;
}
#coral7.left .csdkDWindMinimizeButton,
#coral7.right .csdkDWindMinimizeButton,
#coral7.left .coralDraggableWindowMinimizeButton,
#coral7.right .coralDraggableWindowMinimizeButton
{
	background: url(../images/c7/minimisedWindow.svg) no-repeat center;
	background-size: 11px;
	pointer-events: all;
	border:none;
}
#coral7.left .csdkDWindMaximizeButton,
#coral7.right .csdkDWindMaximizeButton,
#coral7.right .coralDraggableWindowMaximizeButton,
#coral7.left .coralDraggableWindowMaximizeButton
{
	background: url(../images/c7/maximisedWindow.svg) no-repeat center;
	background-size: 9px;
	pointer-events: all;
	border:none;
}
#coral7.left .csdkDWindCloseButton,
#coral7.right .csdkDWindCloseButton,
#coral7.right .coralDraggableWindowCloseButton,
#coral7.left .coralDraggableWindowCloseButton
{
	background: url(../images/c7/closeWindow.svg) no-repeat center;
	background-size: 9px;
	pointer-events: all;
	border:none;
}
#coral7 .csdkDWindSettingsButton,
#coral7 .coralDraggableWindowSettingsButton
{
	background: url(../images/c7/settingWindow.svg) no-repeat center;
	background-size: 11px;
	pointer-events: all;
	border:none;
}



/****************************************************************************/
/* CSDK Tab                                                               */
/****************************************************************************/

/*tab header*/
#coral7 #container .csdkTabSetHeader.single
{
	display: none;
}
#coral7 .WidgetTabBar,
#coral7 #container .csdkTabSetHeader,
#coral7 #container .csdkTabSetHeader .csdkRow,
#coral7 #container .csdkTabSetHeader .csdkTab .csdkTabLabel,
#coral7 #container .csdkTabSetHeader .csdkTab
{
        display:flex;
        font-size: var(--main-fontsize-small);
        color: var(--key-color);
        flex-grow: 1;
}
#coral7 #container .csdkTabSetHeader .csdkTab
{
	cursor: pointer;
}
#coral7 .WidgetTabBar li,
#coral7 #container .csdkTab .csdkTabLabel
{
        border: 1px #dfdfde;
        border-style: none solid solid none;
        padding: 5px;
	color: var(--main-color-black);
	border-color: var(--colorBorder);
}
#coral7 .CoralTabs ul
{
	display: flex;
}
#coral7  .CoralTabs>ul>li
{
	display: inline-flex;
	justify-content: center;

}
#coral7 .WidgetTabBar li
{
	font-family: var(--main-font);
	line-height:20px;
        border-style: solid solid solid none;
	text-transform: uppercase;
	text-align: center;
	padding-right: 3px;
	cursor: pointer;
	padding: 6px 2px;
}

#coral7 .WidgetTabBar li:last-child
{
	border-right:none;
}
#coral7 #container .csdkTab:last-child .csdkTabLabel
{
        border-right: 1px solid transparent;
}
#coral7 #container .csdkTab
{
        background: var(--disabled-button-background-color);
	min-width: 66px;
}
#coral7 .WidgetTabBar li.active,
#coral7 #container .csdkTab.selected
{
        background: var(--main-background);
}
#coral7 .WidgetTabBar li.active
{
	border-bottom: 1px solid var(--main-background);
	border-top: 3px solid var(--colorTextBrand);
	padding-top: 5px;
	font-family: var(--main-font-Bold);
}

#coral7 li {list-style:none;}

#coral7 .acbWidgetDock .WidgetTabDiv
{
	padding:10px 10px 5px 10px;
	background: var(--mainBackground);
}
#coral7 .acbWidgetDock ul.WidgetTabBar {
	width: 100%;
	margin: 0;
	padding: 0;
}
#coral7 #container .csdkTab.selected .csdkRow,
#coral7 #container .csdkTab.selected .csdkTabLabel
{
        color: var(--main-color-gray);
}
#coral7 #container .csdkTab.selected .csdkTabLabel
{
        border-bottom: 1px solid transparent;
}
#coral7 #container .csdkTabSetHeader .csdkRow .csdkCell:nth-child(2)
{
        align-self: center;
}
/*CSDK Tab*/                                                                                                                                                                                    

/*tab header*/
#coral7 .csdkTabSetHeader,
#coral7 .csdkTab .csdkTabLabel,
#coral7 .csdkTabSetHeader .csdkRow,
#coral7 .csdkTabSetHeader .csdkTab
{
        display:flex;
        font-size: var(--main-fontsize-small);
        color: var(--key-color);
}
#coral7 .csdkTabSetHeader 
{
	border: 0px var(--colorBorder);
	border-style: solid none none none;
}
#coral7 .csdkTabSetHeader .csdkTab
{
	cursor: pointer;
	background-color: var(--mainBackground);
}

#coral7 .csdkTab .csdkTabLabel
{
	border: 1px var(--colorBorder);
        border-style: none solid solid none;
        padding: 5px;
}
#coral7 .csdkTab:last-child .csdkTabLabel
{
        border-right: 1px solid transparent;
}
#coral7 .csdkTab
{
        background: var(--disabled-button-background-color);
}
#coral7 .csdkTab.selected
{
	background: var(--mainBackground);
}
#coral7 .csdkTab.selected .csdkRow,
#coral7 .csdkTab.selected .csdkTabLabel
{
	color: var(--colorTextBasic);
}
#coral7 .csdkTab.selected .csdkTabLabel
{
        border-bottom: 1px solid transparent;
}
#coral7 .csdkTabSetHeader .csdkRow .csdkCell:nth-child(2)
{
        align-self: center;
}
#coral7 .csdkTab .csdkCell.closeButton button
{
	background: transparent;
	border: none;
}
#coral7 .csdkTab .csdkCell.closeButton
{
	display:none;
}
#coral7 .csdkTab:hover .csdkCell.closeButton
{
	display: block;
	background: url(../images/c7/tabClose.svg) no-repeat center, var(--colorBorder);
	background-size: 6px;
	visibility: visible;
	width: 6px;
	height: 6px;
	position: absolute;
	right: 3px;
	padding: 4px;
	border-radius: 100%;
	top: 5px;
}
/*tab header END*/

/*tab contents*/
#coral7 .csdkTabSetContent .csdkTabContent
{
	display: none;
}
#coral7 .csdkTabSetContent .csdkTabContent.selected
{
	display: flex;
	flex-grow: 1;
	height: 100%;
}
#coral7 .csdkTabSetContent
{
}
/*tab contents* END*/

/*CSDK Tab END*/

/****************************************************************************/
/*  button                                                                  */
/***************************************************************************/
#coral7 .coralModalOverlay button,
#coral7 .csdkDialog button,
#coral7 .csdkNotificationCentre button,
#coral7 .csdkPopOutBoxContent button,
#coral7 #alertPopUpOverlay button,
#coral7 .masterContainer button:not(DIV.compassReact button)    
{
	border: var(--border-lightgray);	
	padding: 5px 7px;
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	background-color: var(--mainBackground);
}
#coral7 #masterContainer div:not(.compassReact).csdkDWindTitleBarButtonDock button
{
	border:none;
	background-color:transparent;
	height: 30px;
}
#coral7 .coralModalOverlay button:hover,
#coral7 .csdkDialog button:hover,
#coral7 .csdkNotificationCentre button:hover,
#coral7 .csdkPopOutBoxContent button:hover,
#coral7 #alertPopUpOverlay button:hover,
#coral7 .masterContainer button:not(DIV.compassReact button):hover  
{
	opacity: 0.7;
	text-shadow: none;
}
#coral7 .coralModalOverlay button:active,
#coral7 .csdkDialog button:active,
#coral7 .csdkNotificationCentre button:active,
#coral7 .csdkPopOutBoxContent button:active,
#coral7 #alertPopUpOverlay button:active,
#coral7 .masterContainer button:not(DIV.compassReact button):active  
{
	opacity: 1;
}

#coral7 #coral_AlertPopUpDiv button
{
	background: var(--main-button-background);
	margin: 5px 5px 0 0;
}

#coral7 div.csdkDWind button[disabled] {
	background-color: #efefef !important;
	filter: grayscale(1);
	opacity: 0.7;
	cursor: none;
}

/****************************************************************************/
/* textinput, other input                                                   */
/****************************************************************************/


#coral7 input.inputText {
	border: var(--border-lightgray);
	font-size: var(--main-fontsize-small);
	width: inherit;
	padding: 5px 10px;
	border-radius: 5px;
	line-height: 1rem;
}
#coral7 .coralModalOverlay input[type=text],
#coral7 .csdkDialog input[type=text],
#coral7 .csdkNotificationCentre input[type=text],
#coral7 .csdkPopOutBoxContent input[type=text],
#coral7 #alertPopUpOverlay input[type=text],
#coral7 .masterContainer input[type=text]:not(DIV.compassReact input[type=text])    
{
	border: var(--border-lightgray);
	padding: 5px;
	color: var(--colorTextBasic) ;
}
#coral7 .masterContainer input[name=Password]:not(DIV.compassReact input[name=Password])    
{                                                                                                                                                               
        -webkit-text-security: disc;
}
#coral7 .coralModalOverlay :focus,
#coral7 .csdkDialog :focus,
#coral7 .csdkNotificationCentre :focus,
#coral7 .csdkPopOutBoxContent :focus,
#coral7 #alertPopUpOverlay :focus,
#coral7 .masterContainer div:not(.compassReact) :focus 
{outline:none;}

#coral7 input.csdkSearchBox
{
	background: url(../images/c7/searchIcon.svg) no-repeat calc(100% - 5px);
	background-size: 15px;
	padding-right: 23px;
	text-overflow: ellipsis;
}

#coral7 input.csdkBorderlessInput,
#coral7 input.csdkBorderlessInput
{
	border:1px solid transparent;
}

#coral7 input.csdkBorderlessInput:hover,
#coral7 input.csdkBorderlessInput:focus
{
	border: var(--border-lightgray);	
	background: #feffe1;
}


/*full screen*/

#coral7 div.csdkDWind.fullscreen
{
	z-index: 9999 !important;
	width: 100% !important;
	height: 100% !important;
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
}
#coral7 div.csdkDWind.fullscreen .csdkDWindContentWindow
{
	width: 100% !important;
	height: -webkit-calc(100% - 40px) !important;
	height: calc(100% - 40px) !important;
	resize:none !important;
	overflow-y: auto;
}

/*checkbox*/

/* styled checkbox wasn't working so commented out for now 17th Feb 2020 by Anna */
/****************************************************************************/
/* radio button, check box                                                   */
/****************************************************************************/
#coral7 .coralModalOverlay input[type=radio]:checked,
#coral7 .csdkDialog input[type=radio]:checked,
#coral7 .csdkNotificationCentre input[type=radio]:checked,
#coral7 .csdkPopOutBoxContent input[type=radio]:checked,
#coral7 #alertPopUpOverlay input[type=radio]:checked,
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):checked, 

#coral7 .coralModalOverlay input[type=radio]:hover,
#coral7 .csdkDialog input[type=radio]:hover,
#coral7 .csdkNotificationCentre input[type=radio]:hover,
#coral7 .csdkPopOutBoxContent input[type=radio]:hover,
#coral7 #alertPopUpOverlay input[type=radio]:hover,
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):hover, 
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):checked:hover, 

#coral7 .coralModalOverlay input[type=radio],
#coral7 .csdkDialog input[type=radio],
#coral7 .csdkNotificationCentre input[type=radio],
#coral7 .csdkPopOutBoxContent input[type=radio],
#coral7 #alertPopUpOverlay input[type=radio],
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]), 
#coral7 .coralModalOverlay input[type=checkbox],
#coral7 .csdkDialog input[type=checkbox],
#coral7 .csdkNotificationCentre input[type=checkbox],
#coral7 .csdkPopOutBoxContent input[type=checkbox],
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]) 
/*
#coral7 input[type=radio]:checked, 
#coral7 input[type=radio]:hover, 
#coral7 input[type=radio],
#coral7 input[type=checkbox]
*/
{
	    border: none;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
    position: relative;
    background: transparent;
    border: var(--border-gray);
    color: var(--main-color-pink);
    height: 17px;
    width: 27px;
    cursor: pointer;
    margin: 0 5px;
    outline: none;
    min-height: 26px;
}
#coral7 .coralModalOverlay input[type=radio]:checked::before,
#coral7 .csdkDialog input[type=radio]:checked::before,
#coral7 .csdkNotificationCentre input[type=radio]:checked::before,
#coral7 .csdkPopOutBoxContent input[type=radio]:checked::before,
#coral7 #alertPopUpOverlay input[type=radio]:checked::before,
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):checked:before, 

#coral7 .coralModalOverlay input[type=checkbox]:checked::before,
#coral7 .csdkDialog input[type=checkbox]:checked::before,
#coral7 .csdkNotificationCentre input[type=checkbox]:checked::before,
#coral7 .csdkPopOutBoxContent input[type=checkbox]:checked::before,
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]):checked:before,
/*
#coral7 input[type="radio"]:checked::before, 
#coral7 input[type="checkbox"]:checked::before {
*/
{
	font-size: 14px !important;
	top: -2px;
	left: 5px;
}
#coral7 .coralModalOverlay input[type=radio],
#coral7 .csdkDialog input[type=radio],
#coral7 .csdkNotificationCentre input[type=radio],
#coral7 .csdkPopOutBoxContent input[type=radio],
#coral7 #alertPopUpOverlay input[type=radio],
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]) 
/*
#coral7 input[type=radio]
*/
{
	border-radius: 50%;
}
#coral7 .coralModalOverlay input[type=checkbox],
#coral7 .csdkDialog input[type=checkbox],
#coral7 .csdkNotificationCentre input[type=checkbox],
#coral7 .csdkPopOutBoxContent input[type=checkbox],
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]) 
{
	border-radius: var(--borderRadiusMedium);
}

#coral7 .coralModalOverlay input[type=checkbox]:checked:before,
#coral7 .csdkDialog input[type=checkbox]:checked:before,
#coral7 .csdkNotificationCentre input[type=checkbox]:checked:before,
#coral7 .csdkPopOutBoxContent input[type=checkbox]:checked:before,
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]):checked:before
{
	position: absolute;
	left: 6px;
	top: 5px;
	color: #41bc9c;
	content: '';
	width: 18px;
	height: 20px;
	font-family: monospace;
	font-size: 14px;
	background-repeat: no-repeat;
	background-size: 15px;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.8.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 18 18' style='enable-background:new 0 0 18 18;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2341BC9C;%7D%0A%3C/style%3E%3Cpath class='st0' d='M16.8,5.7c0,0.3-0.1,0.5-0.3,0.7l-7.3,7.3L7.9,15c-0.2,0.2-0.4,0.3-0.7,0.3S6.7,15.2,6.5,15l-1.4-1.4L1.5,10 C1.3,9.8,1.2,9.6,1.2,9.3s0.1-0.5,0.3-0.7l1.4-1.4C3.1,7.1,3.3,7,3.5,7S4,7.1,4.2,7.3l3,3l6.6-6.6c0.2-0.2,0.4-0.3,0.7-0.3 s0.5,0.1,0.7,0.3L16.5,5C16.7,5.2,16.8,5.4,16.8,5.7z'/%3E%3C/svg%3E%0A");
}
#coral7 .coralModalOverlay input[type=radio]:hover,
#coral7 .csdkDialog input[type=radio]:hover,
#coral7 .csdkNotificationCentre input[type=radio]:hover,
#coral7 .csdkPopOutBoxContent input[type=radio]:hover,
#coral7 #alertPopUpOverlay input[type=radio]:hover,
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):hover,

#coral7 .coralModalOverlay input[type=checkbox]:hover,
#coral7 .csdkDialog input[type=checkbox]:hover,
#coral7 .csdkNotificationCentre input[type=checkbox]:hover,
#coral7 .csdkPopOutBoxContent input[type=checkbox]:hover,
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]):hover
/*
#coral7 input[type=radio]:hover,
#coral7 input[type=checkbox]:hover
*/
{
	background-color: var(--main-background-lightgray);
}
#coral7 .coralModalOverlay input[type=radio]:checked,
#coral7 .csdkDialog input[type=radio]:checked,
#coral7 .csdkNotificationCentre input[type=radio]:checked,
#coral7 .csdkPopOutBoxContent input[type=radio]:checked,
#coral7 #alertPopUpOverlay input[type=radio]:checked,
#coral7 .masterContainer input[type=radio]:not(DIV.compassReact input[type=radio]):checked,

#coral7 .coralModalOverlay input[type=checkbox]:checked,
#coral7 .csdkDialog input[type=checkbox]:checked,
#coral7 .csdkNotificationCentre input[type=checkbox]:checked,
#coral7 .csdkPopOutBoxContent input[type=checkbox]:checked,
#coral7 .masterContainer input[type=checkbox]:not(DIV.compassReact input[type=checkbox]):checked
/*
#coral7 input[type=radio]:checked,
#coral7 input[type=checkbox]:checked
*/
{
	background: var(--colorBackground);
}
/*toggle switch*/


#coral7 input[type=checkbox].csdkToggleSwitch,
#coral7 input[type=checkbox].csdkToggleSwitch.off {
	width: 35px;
	background-color: var(--switchbox-background);
	border-radius: 20px;
	height: 20px;
	min-height: 20px;
	max-height: 20px;
	transition: 0.5s background;
	top: 9px;
}

#coral7 input[type=checkbox].csdkToggleSwitch:hover {
	opacity: 0.8;
	transition: opacity 0.3s;
}

#coral7 input[type=checkbox].csdkToggleSwitch:active {
	opacity: 0.5;
	transition: opacity 0.3s;
}

#coral7 input[type=checkbox].csdkToggleSwitch.off::before,
#coral7 input[type=checkbox].csdkToggleSwitch::before                                                                                      
{
	content: ' ';
	width: 14px;
	height: 14px;
	background: var(--mainBackground);
	transform: none;
	border-radius: 50%;
	right: auto;
	left: 3px;
	position:absolute;
	top: 2px;
}

#coral7 input[type=checkbox].csdkToggleSwitch.on {
	width: 35px;
	background-color: var(--colorTextBrand);
	border-radius: 20px;
	height: 20px;
}

#coral7 input[type=checkbox].csdkToggleSwitch.on::before {
	content: ' ';
	width: 14px;
	height: 14px;
	background: var(--mainBackground);
	transform: none;
	border-radius: 50%;
	right: 3px;
	left: auto;
}

/*checkbox END*/



/*Ascending Order*/


#coral7 .csdkHeader .csdkCell.sortDescending,
#coral7 .csdkHeader .csdkCell.sortAscending                                                                                                                                                                     
{
	padding-left: 11px;
	padding-right: 0;
}
#coral7 .csdkHeader .csdkCell.sortDescending::before,
#coral7 .csdkHeader .csdkCell.sortAscending::before
{
        position: absolute;
	content: '';
	width: 10px;
	height: 10px;
	margin-left: -10px;
}
#coral7 .csdkHeader .csdkCell.sortAscending::before
{
        background: url(../images/c7/arrowDown.svg) no-repeat left bottom;
	background-size: 6px;
}
#coral7 .csdkHeader .csdkCell.sortDescending::before
{
        background: url(../images/c7/arrowUp.svg) no-repeat left bottom;
	background-size: 6px;
}

/****************************************************************************/
/* pop out box                                                             */
/****************************************************************************/
#coral7 .csdkPopOutBoxContent.csdkWidgetDockPopOut.growAnimate 
{
	max-width:270px;
}
#coral7 .csdkDirBrowser.hierarchical > .csdkTable > .csdkTableBody,
#coral7 div.csdkPopOutBoxContent.csdkPopOutBoxAnimates                                                                       
{
        transition: all 0.5s ease-in-out;
}
/*
.csdkPopOutBox.agentStateReasonsPopOut .csdkPopOutBoxContent
*/
#coral7 .csdkPopOutBoxContent
{
	background: var(--main-background);
	color: var(--main-color-gray);
	position: absolute;
	filter: drop-shadow(0 1px 5px rgba(0,0,0,.1));
	z-index: 999;
	min-width: 199px;
	border: var(--border-lightgray);
}
#coral7 div:before .csdkPopOutBoxContent
{
	bottom: 100%;
	left: 10px;
	border-bottom: 7px solid var(--mainBackground);
	border-right: 9px solid transparent;
	border-left: 9px solid transparent;
}

#coral7 .csdkPopOutBoxContent .csdkRow.subcategory
{
	padding: 4px 9px;
}
#coral7 .csdkPopOutBoxContent .csdkTable .csdkRow:hover
{
	background: var(--main-color-gray);
}
#coral7 .csdkPopOutBoxContent .csdkRow.nonselectable:hover
{
	background: var(--main-background);
}
#coral7 .csdkCell.rricon
{
	flex-basis: 30px;
	flex-grow: 0;
}
#coral7 .csdkPopOutBoxContent .csdkRow.subcategory .csdkCell
{
	color: var(--main-color-pink);
}
#coral7 .csdkPopOutBoxContent .csdkRow.category .csdkCell
{
	color: var(--main-color-gray);
}
#coral7 .csdkPopOutBoxContent .csdkTableBody .csdkRow:hover .csdkCell
{
	color: var(--main-background);
}
#coral7 .csdkPopOutBoxContent .csdkRow.nonselectable:hover .csdkCell
{
	color: var(--main-color-gray);
}
#coral7 .csdkPopOutBoxContent .csdkRow.Internal .rricon,
#coral7 .csdkPopOutBoxContent .csdkRow.Ready .rricon
{
	background: url(../images/c7/tabPhone.svg) no-repeat left center;
	background-size: 16px;
	flex-basis: 20px;
	flex-grow: 0;
}
#coral7 .csdkPopOutBoxContent .csdkRow.Not.Ready .rricon
{
	background: url(../images/c7/tabPhoneGrey.svg) no-repeat left center;
	background-size: 16px;
	flex-basis: 20px;
	flex-grow: 0;
}
#coral7 .csdkPopOutBoxContent .csdkRow.Internal
{
	margin: 5px 0 0px 0;
} 
#coral7 .csdkPopOutBoxContent .csdkRow.category 
{
	padding: 8px ;
}
#coral7 .csdkPopOutBoxContent .csdkRow.Internal, 
#coral7 .csdkPopOutBoxContent .csdkRow.Not.Ready 
{
	border-top: 1px solid var(--colorBorder);
}
#coral7 .closePopOutIcon,
#coral7 .csdkPopOutBoxContent.lm.testcaseKvpTableWrapper .closePopOutIcon,
#coral7 .csdkPopOutBoxContent.lm.logOutPutWrapper  .closePopOutIcon
{
        background: url(../images/c7/closeWindow)  center no-repeat;
        background-size: 10px;                                                                                                                                                  
        width: 17px;
        height: 17px;
        display: block;
        position: absolute;
        right: 7px;
        top: 7px;
        border-radius: 10px;
        cursor: pointer;
}

/*popoutBox END*/
/*Tool Tip*/
#coral7 .csdkPopOutBoxContent.csdkToolTipPopOutBoxContent
{
	z-index:1000;
	background: var(--toolTip) !important;
	color: #fff !important;
        text-align: center;
        border-radius: 0px;
	border:none;
        min-height: 20px;
        line-height: 20px;
        min-width: 50px;
	width: fit-content;
	padding: 8px 10px;
        transition: opacity 0.3s;
	font-family: var(--main-font)  ;
}
#coral7.dark .csdkPopOutBoxContent.csdkToolTipPopOutBoxContent
{
        background: #010133 !important;                                                                                                                                                                                                                                                                              
	        border:1px solid #39395d;
		}
#coral7 .csdkPopOutBoxContent.csdkToolTipPopOutBoxContent div,
#coral7 .csdkPopOutBoxContent.csdkToolTipPopOutBoxContent span
{
	background: var(--toolTip) !important;
	color: #fff !important;
}

#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip
{
	font-size: var(--main-fontsize-small);
        font-family: arial;
        text-align: left;
        padding: 5px 10px;
        max-width: 350px;
        background: rgba(252, 247, 205, 0.9);
	color: var(--main-color-white);
	color: #fff;
}
#coral7 div.csdkPopOutBoxContent
{
	box-shadow: var(--boxShadow);
	background-color: var(--mainBackground);
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusLarge);
}
#coral7 div.csdkPopOutBoxContent:before
{
        content:"";
        position: absolute;
        width: 0;
        height: 0;
}
/*this is temp*/
#coral7 div.csdkPopOutBoxContent.lt {  margin-top:9px; margin-left: 10px }
#coral7 div.csdkPopOutBoxContent.lm {                    margin-left: 10px }
#coral7 div.csdkPopOutBoxContent.lb {  margin-top: 0px; margin-left: 10px }

#coral7 div.csdkPopOutBoxContent.rt {  margin-top:-17px; margin-left:-10px }
#coral7 div.csdkPopOutBoxContent.rm {                    margin-left:-10px }
#coral7 div.csdkPopOutBoxContent.rb {  margin-top: 6px; margin-left:-8px }

#coral7 div.csdkPopOutBoxContent.tl {  margin-top: 10px; margin-left: -17px;}
#coral7 div.csdkPopOutBoxContent.tc {  margin-top: 10px; }
#coral7 div.csdkPopOutBoxContent.tr {  margin-top: 10px; margin-left:  36px;}

#coral7 div.csdkPopOutBoxContent.bl {  margin-top: -10px; margin-left: -17px;}
#coral7 div.csdkPopOutBoxContent.bc {  margin-top: -10px; }
#coral7 div.csdkPopOutBoxContent.br {  margin-top: -10px; margin-left:  36px;}

#coral7 div.csdkPopOutBoxContent.lt:before { top:    14px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--mainBackground); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.lm:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--mainBackground); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.lb:before { bottom: 14px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--mainBackground); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.rt:before { top:    14px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid  var(--mainBackground); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.rm:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid  var(--mainBackground); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.rb:before { bottom: 14px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid var(--mainBackground); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.tl:before { bottom: 100%;                   left: 14px;             border-bottom: 7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.tc:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.tr:before { bottom: 100%;                   right:14px;             border-bottom: 7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

#coral7 div.csdkPopOutBoxContent.bl:before { top:    100%;                   left: 14px;             border-top:    7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.bc:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.br:before { top:    100%;                   right:14px;             border-top:    7px solid   var(--mainBackground);    border-right: 9px solid transparent; border-left: 9px solid transparent; }


#coral7 div.csdkPopOutBoxContent.lt.csdkToolTipPopOutBoxContent:before { top:    10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.lm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.lb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.rt.csdkToolTipPopOutBoxContent:before { top:    10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.rm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.rb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid var(--toolTip); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.tl.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: 10px;             border-bottom: 7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.tc.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.tr.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   right:10px;             border-bottom: 7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

#coral7 div.csdkPopOutBoxContent.bl.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: 10px;             border-top:    7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.bc.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.br.csdkToolTipPopOutBoxContent:before { top:    100%;                   right:10px;             border-top:    7px solid var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
/*Tooltip pointy colour*/
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lt.csdkToolTipPopOutBoxContent:before { top:    10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      right: 100%;            border-top: 7px solid transparent; border-right: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.lb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   right: 100%;            border-top: 7px solid transparent; border-right: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rt.csdkToolTipPopOutBoxContent:before { top:    10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rm.csdkToolTipPopOutBoxContent:before { top:    calc( 50% - 9px );      left:  100%;            border-top: 7px solid transparent; border-left: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.rb.csdkToolTipPopOutBoxContent:before { bottom: 10px;                   left:  100%;            border-top: 7px solid transparent; border-left: 9px solid   var(--toolTip); border-bottom: 7px solid transparent; }

#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tl.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: 10px;             border-bottom: 7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tc.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   left: calc( 50% - 7px); border-bottom: 7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.tr.csdkToolTipPopOutBoxContent:before { bottom: 100%;                   right:10px;             border-bottom: 7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.bl.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: 10px;             border-top:    7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.bc.csdkToolTipPopOutBoxContent:before { top:    100%;                   left: calc( 50% - 7px); border-top:    7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }
#coral7 div.csdkPopOutBoxContent.HierarchicalMenuToolTip.br.csdkToolTipPopOutBoxContent:before { top:    100%;                   right:10px;             border-top:    7px solid   var(--toolTip);    border-right: 9px solid transparent; border-left: 9px solid transparent; }

/*pointy dark mode with border*/

#coral7.dark div.csdkPopOutBoxContent:before 
{
	background: url(../images/c7/popout_dark.svg) no-repeat center;
	background-size: 10px;
	width: 10px;
	height: 15px;
	border: none !important;
}
#coral7.dark div.csdkPopOutBoxContent.lb:before 
{
	bottom: 10px;
	right: calc(100% - 1px);
}
#coral7.dark div.csdkPopOutBoxContent.lt:before 
{ 
	top: 10px;                   
	right: calc(100% - 1px); 
}
#coral7.dark div.csdkPopOutBoxContent.lm:before 
{ 
	top:calc( 50% - 9px );      
	right: calc(100% - 1px); 
}
#coral7.dark div.csdkPopOutBoxContent.rt:before 
{
	top:10px;      
	left: calc(100% - 1px); 
	transform: rotate(180deg);
}
#coral7.dark div.csdkPopOutBoxContent.rm:before 
{
	top:calc( 50% - 9px );      
	left: calc(100% - 1px); 
	transform: rotate(180deg);
}
#coral7.dark div.csdkPopOutBoxContent.rb:before 
{
	bottom:10px;      
	left: calc(100% - 1px); 
	transform: rotate(180deg);
}

#coral7.dark div.csdkPopOutBoxContent.tl:before 
{
	left:10px;      
	bottom: calc(100% - 1px); 
	transform: rotate(90deg);
}
#coral7.dark div.csdkPopOutBoxContent.tc:before 
{
	left: calc( 50% - 7px);
	bottom: calc(100% - 1px); 
	transform: rotate(90deg);
}
#coral7.dark div.csdkPopOutBoxContent.tr:before 
{
	right:10px;      
	bottom: calc(100% - 1px); 
	transform: rotate(90deg);
}

#coral7.dark div.csdkPopOutBoxContent.bl:before 
{
	left:10px;      
	top: calc(100% - 1px); 
	transform: rotate(-90deg);
}
#coral7.dark div.csdkPopOutBoxContent.bc:before 
{
	left:calc( 50% - 7px);      
	top: calc(100% - 1px); 
	transform: rotate(-90deg);
}
#coral7.dark div.csdkPopOutBoxContent.br:before 
{
	right:10px;      
	top: calc(100% - 1px); 
	transform: rotate(-90deg);
}

/****************************************************************************/
/* combo select and normal select                                           */
/****************************************************************************/
#coral7 input.csdkInputInput
{
        border:var(--border-lightgray);
	padding: 6px ;
	border-radius: var(--borderRadiusMedium);
	background: var(--mainBackground);
	color: var(--colorTextBasic);
	width: calc(100% - 14px);
}
#coral7 .csdkComboSelect .ComboSelectElementDelete
{
	color: transparent;
	font-size: 0;
	background: url(/images/c7/iconW_cancel.svg) no-repeat center, #b1b1b1;
	background-size: 6px, 100%;
	padding: 7px 7px;
	border-radius: 100%;
	vertical-align: middle;
	margin-left: 5px;
}
#coral7 .csdkComboSelect {position:relative;}
#coral7 .csdkComboSelect input.ComboSelect {
	border-radius: 4px;
	padding: 5px 7px;
	margin: 0;
	background: url(../images/c7/icon_arrowDownG.svg) no-repeat;
	background-size: 10px;
	background-position: calc(100% - 10px), center;
	cursor: pointer;
	border: 1px solid var(--colorBorder);
}

#coral7 .csdkComboSelect input.ComboSelect:hover
{
	background-color: var(--main-button-hover);
}

#coral7 .ComboSelectPopup
{
	border: var(--border-lightgray);
	background: var(--mainBackground);
	position: absolute;
	z-index: 100;
	border-radius: 0.5rem;
	margin-top: 1px;
}

#coral7 .ComboSelectPopup .ComboSelectElement {
	padding: 4px 10px;
	cursor: pointer;
	font-size: 12px;
	text-overflow: ellipsis;
	overflow: hidden;
}

#coral7 .ComboSelectPopup .ComboSelectSentinel
{
	display:none;
	background: linear-gradient(45deg, #c24725 25%, #d24a27 25%, #d24a27 50%, #c24725 50%, #c24725 75%, #d24a27 75%, #d24a27 100%) , 20px;
	text-align: center;
	color: white;
	border-radius: 0 0 0.25rem 0.25rem;
	padding: 3px 0;
	cursor: pointer;
	background-size: 20px;
	font-size: 12px;
}

#coral7 .ComboSelectPopup .ComboSelectSentinel:hover
{
	opacity: 0.8;
}
#coral7 .coralModalOverlay textarea,
#coral7 .csdkDialog textarea,
#coral7 .csdkNotificationCentre textarea,
#coral7 .csdkPopOutBoxContent textarea,
#coral7 #alertPopUpOverlay textarea,
#coral7 .masterContainer textarea:not(DIV.compassReact textarea)
{
        border:var(--border-lightgray);
        background: var(--main-background-lightgray);
        padding: 5px;
	color: var(--colorTextBasic);
}

#coral7 #UserDataConfig select
{
	padding:5px !important;
	height:unset !important;
}

#coral7 .coralModalOverlay select,
#coral7 .csdkDialog select,
#coral7 .csdkNotificationCentre select,
#coral7 .csdkPopOutBoxContent select,
#coral7 #alertPopUpOverlay select,
#coral7 .masterContainer select:not(DIV.compassReact select)
{
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	border: var(--border-lightgray);
	font-size: var(--main-fontsize-small);
	width: inherit;
	padding: 4px 20px 4px 10px;
	height: inherit;
	background: url(../images/c7/icon_arrowDownG.svg) no-repeat calc(100% - 8px) center;
	background-size: 9px;
	cursor: pointer;
	border-radius: 0;
	color: var(--colorTextBasic);
	font-size:13px;
	white-space: nowrap;
	text-overflow: ellipsis;
	border-radius: var(--borderRadiusMedium);
}
#coral7 .coralModalOverlay input[type=button],
#coral7 .csdkDialog input[type=button],
#coral7 .csdkNotificationCentre input[type=button],
#coral7 .csdkPopOutBoxContent input[type=button],
#coral7 #alertPopUpOverlay input[type=button],
#coral7 .masterContainer input[type=button]:not(DIV.compassReact input[type=button])
{
        background: var(--main-background);
	font-size: var(--main-fontsize-button);
        border: 0px;
        padding: 1px 13px;
        cursor: pointer;
        border-radius: 0px;
}

#coral7 .coralModalOverlay input[type=button]:hover,
#coral7 .csdkDialog input[type=button]:hover,
#coral7 .csdkNotificationCentre input[type=button]:hover,
#coral7 .csdkPopOutBoxContent input[type=button]:hover,
#coral7 #alertPopUpOverlay input[type=button]:hover,
#coral7 .masterContainer input[type=button]:not(DIV.compassReact input[type=button]):hover
{
        opacity: 0.8;
}

#coral7 .ComboSelectPopup .ComboSelectElement:hover
{
	background: #efefef80;
}
/*combo select and select END*/



/****************************************************************************/
/* dir Browser                                                               */
/****************************************************************************/
/*dirBrowser hierarchical menu type*/

#coral7 .csdkDirBrowser.hierarchical
{
	overflow: visible;
	position: relative;
}

#coral7 .csdkDirBrowser .csdkTableBody .csdkRow:hover
{
	background: var(--colorBackground);
}
#coral7 .csdkDirBrowser .csdkTableBody .csdkRow:hover > .csdkCell 
{
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.folder
{
        position:relative;
}

#coral7 .csdkDirBrowser.hierarchical .disclosureContent
{
        position: absolute;
        left: 190px;
        min-width: 100px;
        top: 15px;
}

#coral7 .csdkDirBrowser.hierarchical.active > .csdkTable > .csdkTableBody
{
	display:block;
}
#coral7 .csdkDirBrowser.hierarchical > .csdkTable > .csdkTableBody
{
	position: absolute;
	top:43px;
	display: none;
}

#coral7 .csdkDirBrowser.hierarchical .csdkTableBody
{
	background: var(--main-background-white);
	color: var(--main-color-gray);
	border: var(--border-lightgray);
	filter: drop-shadow(0 1px 5px rgba(0,0,0,.1));
	z-index: 25;
	min-width: 217px;
	font-size: var(--main-fontsize-button);
	height:auto;
}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkRow
{
	padding: 2px 5px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkRow:first-child
{
	padding: 7px 5px 2px 5px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkRow:last-child
{
	padding: 2px 5px 7px 5px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkRow:last-child
{
	padding-bottom: 8px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.item > .csdkCell:first-child
{
        background: url(../images/c7/destination.svg) no-repeat 7px center;
        background-size: 13px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.folder > .csdkCell:first-child
{
        background: url(../images/c7/dirFolder.svg) no-repeat 6px center;
        background-size: 18px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.folder.open > .csdkCell:first-child
{
        background: url(../images/c7/dirFolderOpen.svg) no-repeat 2px center;
        background-size: 22px;
}




/*favourite and recents in destination list*/
#coral7 .csdkDirBrowser.hierarchical .csdkRow.item > .csdkCell.notfavourite
{
        background: url(../images/c7/favourite.svg) no-repeat 5px center;
        background-size: 19px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.item > .csdkCell.favourite
{
        background: url(../images/c7/favouriteFilled.svg) no-repeat 5px center;
        background-size: 19px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.favourites.open > .csdkCell:first-child,
#coral7 .csdkDirBrowser.hierarchical .csdkRow.favourites > .csdkCell:first-child
{
        background: url(../images/c7/favouriteFilled.svg) no-repeat 5px center;
        background-size: 19px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.recents.open > .csdkCell:first-child,
#coral7 .csdkDirBrowser.hierarchical .csdkRow.recents > .csdkCell:first-child
{
        background: url(../images/c7/recentIcon.svg) no-repeat 5px center;
        background-size: 19px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkRow.favourites 
{
	border-bottom: var(--border-lightgray);
	padding-bottom: 6px;
	margin-bottom: 5px;
}
/*favourite and recents in destination list END*/



#coral7 .csdkDirBrowser.hierarchical.destinationList .csdkTableBody .csdkRow > .csdkCell:last-child
{
	flex-basis: 20px;
        flex-grow: 0;
	height: 23px;
	justify-content: flex-end;
}
#coral7 .csdkDirBrowser.hierarchical.destinationList .csdkTableBody .csdkRow.folder > .csdkCell:last-child
{
        background: url(../images/c7/menuRightArrow.svg) no-repeat  center;
        background-size: 7px;
}
#coral7 .csdkDirBrowser.hierarchical.destinationList .csdkTableBody .csdkRow.folder:hover > .csdkCell:last-child
{
        background: url(../images/c7/menuRightArrowWhite.svg) no-repeat  center;
        background-size: 7px;
}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkCell {align-self: center;}
#coral7 .csdkDirBrowser.hierarchical .csdkTableBody .csdkCell:first-child
{
        flex-basis: 32px;
        flex-grow:0;
	height: 23px;
}
#coral7 .csdkDirBrowser.hierarchical > .csdkTable > .csdkHeader > .csdkCell > div > input
{
        background: url(../images/c7/icon_arrowDownG.svg) no-repeat 97% center;
        background-size: 8px;
}

/*dirBrowser folder open/close type*/
#coral7 .csdkDirBrowser
{
        user-select:none;
        width: 100%;
        resize: both;
        overflow: hidden;
        font-size: 12px;
	color: var(--colorTextDefault);
}

#coral7 .csdkDirBrowser > .csdkTable { margin: 10px; }
#coral7 .csdkDirBrowser.hierarchical > .csdkTable { margin: 10px 0 0 0; }

#coral7 .csdkDirBrowser .csdkHeader .csdkCell div
{
        display:inline-block;
}
#coral7 .csdkDirBrowser .csdkHeader .csdkCell
{
        justify-content: center;
}

#coral7 .csdkDirBrowser .csdkTableBody .csdkCell:first-child
{
        flex-basis: 20px;
        flex-grow:0;
}

#coral7 .csdkDirBrowser .csdkRow.item > .csdkCell:first-child
{
        background: url(/images/c7/icon_folder.svg) no-repeat 3px 4px;
        background-size: 13px;
}
#coral7 .csdkDirBrowser .csdkRow.folder > .csdkCell:first-child
{
        background: url(/images/c7/icon_folder.svg) no-repeat 3px 4px;
        background-size: 13px;
}
#coral7 .csdkDirBrowser .csdkRow.folder.open > .csdkCell:first-child
{
        background: url(/images/c7/icon_folderOpen.svg) no-repeat 2px 3px;
        background-size: 15px;
}

#coral7 .csdkDirBrowser .disclosureContent                              { display:none; }
#coral7 .csdkDirBrowser .csdkRow.open > .csdkCell > .disclosureWrapper > .disclosureContent             { display:block; }
#coral7 .csdkDirBrowser .disclosureWrapper                              { width:100%; }


/*dirBrowser END*/







/****************************************************************************/
/* CSDK DOMAIN SELECTOR                                                     */
/****************************************************************************/
#coral7 .coralUIDomainSelectorBreadcrumb
{
	font-size: var(--main-fontsize-small);
	color: var(--key-color);
}
#coral7 .coralUIDomainSelectorHeader
{
	font-size: var(--main-fontsize-subtitle);
	font-weight: bold;
	margin: 5px 0;
}
#coral7 .coralUIDomainSelectorSearchbar input.csdkInputInput.coralUIDomainSelectorSearchbarField
{
	border: none;
	border-bottom: var(--border-gray);
	width: 85%;
	background: url(../images/c7/searchIcon.svg) no-repeat 5px center;
	background-size: 15px;
	padding:8px 8px 8px 24px;
}
#coral7 .csdkTable.coralUIDomainSelectorDomainsTable
{
	margin-top:10px;
}
#coral7 .csdkTable.coralUIDomainSelectorDomainsTable > .csdkTableBody .csdkRow:first-child
{
}
#coral7 .csdkTable.coralUIDomainSelectorDomainsTable > .csdkTableBody .csdkRow
{
	padding: 17px 5px;
	border-bottom: var(--border-lightgray);
}
#coral7 .breadcrumbWrapper
{
	background: url(../images/c7/breadCrumbsBack.svg) no-repeat left center;
	background-size: 14px;
	padding-left: 18px;
}
#coral7 .coralUIDomainSelector > .csdkTabSet > .csdkTabSetHeader
{
	border: var(--border-lightgray);
	border-radius: 8px;
}
#coral7 .coralUIDomainSelector > .csdkTabSet > .csdkTabSetHeader .coralUIDomainSelectorTab.csdkTab:last-child
{
	border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
}
#coral7 .coralUIDomainSelector > .csdkTabSet > .csdkTabSetHeader .coralUIDomainSelectorTab.csdkTab:first-child
{
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}
#coral7 .coralUIDomainSelector > .csdkTabSet > .csdkTabSetHeader .coralUIDomainSelectorTab.csdkTab.selected .csdkTabLabel
{
	color: var(--main-color-pink);
	font-weight: bold;
} 
#coral7 .coralUIDomainSelector > .csdkTabSet > .csdkTabSetHeader .coralUIDomainSelectorTab .csdkTabLabel
{
	padding: 5px;
	font-size: var(--main-fontsize-button);
	justify-content: center;
}




/****************************************************************************/
/* CSDK PAGINATION                                                          */
/****************************************************************************/
#coral7 .csdkPager .csdkPagination
{
        margin: 15px auto;
	padding:0;
	display:flex;
	width:auto;
}

#coral7 .csdkPager .csdkPagination li
{
        display: flex;
	position:relative !important;
	top:unset !important;
	right:unset !important;
}

#coral7 .csdkPager .csdkPagination button
{
	color: var(--color-text-link);
        background: var(--mainBackground);
	border: var(--border-lightgray);
        border-radius: var(--borderRadiusMedium);
        width: 30px;
        height: 30px;
        margin-right: 5px;
        cursor: pointer;
        border: none;
        color: #919396;
        transition: background 0.5s;
	padding: 7px;
}

#coral7 .csdkPager .csdkPagination button:hover {
        background: #c7c7c7ba;
}

#coral7 .csdkPager .csdkPagination button.selected {
        background: #767676;
        color: white;
}

#coral7 .csdkPager .csdkPagination li button:disabled 
{
	filter:grayscale(1);
	opacity:0.7;
}
#coral7 .csdkPager .csdkPagination li.first button,
#coral7 .csdkPager .csdkPagination li.previous button,
#coral7 .csdkPager .csdkPagination li.next button,
#coral7 .csdkPager .csdkPagination li.last button
{
        text-indent: -9999999999px;
        background-size: 50%;
        background-position: center;
        background-repeat: no-repeat;
	position:relative;
}

#coral7 .csdkPager .csdkPagination li.previous button,
#coral7 .csdkPager .csdkPagination li.next button
{
	background-size: 30%;
}
#coral7 .csdkPager .csdkPagination li.first button
{
        background-image: url(../images/c7/iconB_doubleLeftArrow.svg);
}

#coral7 .csdkPager .csdkPagination li.previous button
{
        background-image: url(../images/c7/iconB_leftArrow.svg);
}

#coral7 .csdkPager .csdkPagination li.next button
{
        background-image: url(../images/c7/iconB_rightArrow.svg);
}

#coral7 .csdkPager .csdkPagination li.last button
{
        background-image: url(../images/c7/iconB_doubleRightArrow.svg);
}
#coral7 .csdkPager .csdkPagination li button[disabled] {
	opacity: 0.2;
}
#coral7.dark .csdkPager .csdkPagination li button[disabled] {
	opacity: 0.5;
}

#coral7 .csdkPager.csdkPagerHidden
{
	display:none;
}



/****************************************************************************/
/* InfoList                                                                 */
/****************************************************************************/

#coral7 .infoListIcon {
	height: 36px;
	border-radius: 50%;
	width: 36px;
	margin: 8px;
	color: transparent;
	background-size: 40%;
	background-repeat: no-repeat;
	background-position: center;
}


#coral7 .infoListTextWrapper .infoListSubTitle.date button
{
	background-image: url(/images/c7/iconB_authenticate.svg);
	background-repeat: no-repeat;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	background-size: 12px;
	font-size: 12px;
	padding: 5px 10px 5px 30px;
	background-position: 10px center;
	padding-left: 35px;
	background-size: 10px;
	font-size: 11px;
	padding: 5px 10px 5px 20px;
	background-position: 6px center;
	line-height: 10px;
}

#coral7 .infoListWrapper
{
        display: table;
	background: var(--mainBackground);
        border-collapse: collapse;
        width: calc(100% - 1px);
	color: var(--colorTextBasic);
}
#coral7 .infoListRow > div
{
        border-collapse: collapse;
}
#coral7 .infoListRow
{
        display: table-row;
        width: 100%;
}
#coral7 .csdkPopOutBoxContent .infoListRow .infoListTitle
{
        font-weight: bold;
        color: #333;
}

#coral7 .infoListRow.detailedInfoRowName .custInfoTextWrapper
{
        font-size: 18px;
}

#coral7 .infoListWrapper .infoListRow
{
        height:41px;
        color: black;
}

#coral7 .infoListCell
{
        display: table-cell;
        vertical-align: middle;
}
#coral7 .infoListTextWrapper
{
        margin: 3.5px 0 !important;
        font-size:14px;
        pointer-events: none;
        cursor: default;
}
#coral7 .infoListSubTitle
{
	color: var(--colorTextBrand);
	font-size: 12px;
}
#coral7 .infoListWrapper .infoListRightIcon
{
        height: 100%;
}
#coral7 .infoListRightIcon.copy
{
        background-size: 10px;
        padding: 0px;
        cursor: pointer;
	background: url(/images/c7/copy.svg) transparent center center no-repeat;
	height: 20px;
	background-size:12px;
}

#coral7 .infoListRightIcon.menu
{
	padding: 0px;
	cursor: pointer;
	width: 16px;
	height: 16px;
	background: url(/images/c7/icon_arrowRightG.svg) no-repeat center;
	background-size: 4px;
	border-radius: var(--borderRadiusMedium);
	align-self: unset;
	display: inline-flex;
}
#coral7 .infoListRightIcon.close
{
	background: url(../images/c7/close.png) #58585b center center no-repeat;
	background-size: 6px;
	width: 14px;
	height: 14px !important;
	display: block;
	position: absolute;
	right: 3px;
	top: 3px;
	border-radius: 10px;
	cursor: pointer;
}
#coral7 .infoListPopout .infoListRightIcon.close
{
	width: 18px;
	height: 18px !important;
	right: -5px;
	top: 4px;
	background: url(../images/close.png) #cfcfcf center center no-repeat;
	background-size: 9px;
}

/*button table*/
#coral7 .csdkTable.buttonTable
{
	margin-top: 4px;
}

/****************************************************************************/
/* search input                                                               */
/****************************************************************************/
#coral7 input[placeholder="Search"]
{
	width: 205px;
	padding: 5px 6px;
	border: var(--border-lightgray);
	background: url(../images/c7/search.svg) 95% center;
	background-size: 15px;
}

#coral7 .csdkDirBrowser input[placeholder="Search"]
{
	width: 205px;
	padding: 5px 6px;
	border: var(--border-lightgray);
	background: url(../images/c7/selectIcon.svg) no-repeat 98% center;
	background-size:6px;
}


/****************************************************************************/
/* button                                                               */
/****************************************************************************/



/****************************************************************************/
/* Disclosure Panel                                                               */
/****************************************************************************/


#coral7 .csdkDisclosurePanelParent.modeFill {
	display: flex;
	flex-direction: row;
	height: 100%;
	white-space: normal;
	width: 100%;
	flex-grow: 1;
}

#coral7 .csdkCell.csdkDisclosurePanel.modeFill {
	width: 257px;
	transition: all 0.7s ease;
}

#coral7 .csdkDisclosurePanelParent .csdkCell
{
	white-space: normal;
	overflow: visible;
}

#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedLeft + div.csdkDisclosurePAdjacentWrapper,
#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedRight + div.csdkDisclosurePAdjacentWrapper {
	width: calc(100% - 250px);
	transition: all 0.7s ease;
}

#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden {
	padding: 0;
	margin-left: -250px;
}


#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden + div,
#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedRight.csdkDisclosurePanelBodyHidden + div
{
	width: 100%;
}

#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedRight {
	order: 2;	
}

#coral7 .csdkCell.csdkDisclosurePanel.modeFill.positionedRight.csdkDisclosurePanelBodyHidden {
	margin-right: -250px;
	padding: 0;
}
#coral7 .csdkDisclosurePanel.modeFill .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
	height: 100%;
	z-index: 1000;
	overflow: visible;
	padding-right: 13px;
	transition: left 0.7s ease;
	top: 0px;
	border-right: 1px solid var(--colorBorder);
	white-space: normal;		
}
#coral7 .csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
	border-right: 0px solid var(--colorBorder);
	border-left: 1px solid var(--colorBorder);
}
#coral7 .csdkDisclosurePanel.modeFill .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	z-index: 10000;
	height: 70px;
	background: var(--mainBackground);	
	width: 15px;
	transition: left 0.7s ease;
	cursor: pointer;
	transition: all 0.7s ease;
	position: absolute;
	padding: 0;
	display: inline-block;
	top: calc(50% - 35px);
}

#coral7 .csdkDisclosurePanel.modeFill.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 253px;
	border-right: 1px solid var(--colorBorder);
	border-top: 1px solid var(--colorBorder);
	border-bottom: 1px solid var(--colorBorder);
	border-radius: 0 5px 5px 0;
}

#coral7 .csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	right: 253px;
	border-left: 1px solid var(--colorBorder);
	border-top: 1px solid var(--colorBorder);
	border-bottom: 1px solid var(--colorBorder);
	border-radius: 5px 0px 0px 5px;
}


#coral7 .csdkDisclosurePanel.modeFill.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 4px;
}

#coral7 .csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.modeFill.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell {
	right: 4px;
}

#coral7 .csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell
{
	position: absolute;
	width: 243px;
	height: 100%;
	z-index: 1000;
	background:var(--mainBackground);
	overflow: visible;
	padding-right: 13px;
	transition: left 0.7s ease;
	top: 0px;
	border-right: 1px solid var(--colorBorder);
	white-space: normal;
}

#coral7 .csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell > div
{
	padding: 10px;
}
#coral7 .csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	left: 0;	
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	left: -253px;
	transition: all 0.7s ease;
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	right: 0;        
	border-left: 1px solid var(--colorBorder);
	border-right: 0px;
	transition: right 0.7s ease;
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedRight.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {
	right: -253px;
	transition: all 0.7s ease;
	border-left: 1px solid var(--colorBorder);
	border-right: 0px;
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelBodyCell {   
	left: -253px;
	transition: all 0.7s ease;
}

#coral7 .csdkDisclosurePanel.modeOverlay .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	position: absolute;
	z-index: 10000;
	height: 70px;
	background: var(--mainBackground);
	top: calc(50% - 35px);
	width: 15px;
	transition: left 0.7s ease;
	cursor: pointer;
	transition: all 0.7s ease;
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	left: 256px;
	border-right: 1px solid var(--colorBorder);
	border-top: 1px solid var(--colorBorder);
	border-bottom: 1px solid var(--colorBorder);
	border-radius: 0 5px 5px 0;
}

#coral7 .csdkDisclosurePanel.modeOverlay.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
        Right: 256px;
	border-left: 1px solid var(--colorBorder);
	border-top: 1px solid var(--colorBorder);
	border-bottom: 1px solid var(--colorBorder);
	border-radius: 5px 0px 0px 5px;
} 

#coral7 .csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.modeOverlay.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell {
	left: 3px;
}

#coral7 .csdkDisclosurePanel .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	position: absolute;
	font: 16px/1 'Open Sans', sans-serif;
	top: calc(50% - 10px);
	content: '\27E9';
	vertical-align: middle;
	flex-grow: 1;
	color: var(--main-color-pink);
}

#coral7 .csdkDisclosurePanel.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	content: '\27E8';		
}

#coral7 .csdkDisclosurePanel.positionedLeft .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	left: 2px;				                                                                                                                                
}

#coral7 .csdkDisclosurePanel.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell:before
{
	right: 2px;
}

#coral7 .csdkDisclosurePanelBodyHidden.csdkDisclosurePanel.positionedRight .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell
{
	right: 3px;
}

#coral7 .csdkDisclosurePanel.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell::before
{
	content: '\27E8';
	color: inherit;
}
																																		  
#coral7 .csdkDisclosurePanel.positionedLeft.csdkDisclosurePanelBodyHidden .csdkDisclosurePanelRow .csdkDisclosurePanelToggleCell::before
{
	content: '\27E9';
	color: inherit;
}

/*input range style*/

#coral7 input[type=range] {
        -webkit-appearance: none;
        width: 100%;
        margin: 5.8px 0;
	border:none !important;
}
#coral7 input[type=range]:focus {
        outline: none;
}
#coral7 input[type=range]::-webkit-slider-runnable-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
        background: var(--ambivalent-background2);
        border-radius: 1.3px;
        border: 0.2px solid rgba(0, 0, 0, 0);
}
#coral7 input[type=range]::-webkit-slider-thumb {
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
        border: 0px solid rgba(0, 0, 0, 0);
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--ambivalent-background);
        cursor: pointer;
        -webkit-appearance: none;
        margin-top: -6px;
}
#coral7 input[type=range]:focus::-webkit-slider-runnable-track {
        background: var(--colorBorder);
}
#coral7 input[type=range]::-moz-range-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
        background: var(--colorBorder);
        border-radius: 1.3px;
        border: 0.2px solid rgba(0, 0, 0, 0);
}
#coral7 input[type=range]::-moz-range-thumb {
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
        border: 0px solid rgba(0, 0, 0, 0);
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--ambivalent-background);
        cursor: pointer;
}
#coral7 input[type=range]::-ms-track {
        width: 100%;
        height: 6px;
        cursor: pointer;
        background: transparent;
        border-color: transparent;
        color: transparent;
}
#coral7 input[type=range]::-ms-fill-lower {
        background: var(--border-lightgray);
        border: 0.2px solid rgba(0, 0, 0, 0);
        border-radius: 2.6px;
        box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
}
#coral7 input[type=range]::-ms-fill-upper {
        background: var(--border-lightgray);
        border: 0.2px solid rgba(0, 0, 0, 0);
        border-radius: 2.6px;
        box-shadow: 0.4px 0.4px 0px rgba(0, 0, 0, 0), 0px 0px 0.4px rgba(13, 13, 13, 0);
}
#coral7 input[type=range]::-ms-thumb {
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);
        border: 0px solid rgba(0, 0, 0, 0);
        height: 20px;
        width: 20px;
        border-radius: 10px;
        background: var(--colorTextBrand);
        cursor: pointer;
        height: 8.4px;
}
#coral7 input[type=range]:focus::-ms-fill-lower {
        background: var(--border-lightgray);
}
#coral7 input[type=range]:focus::-ms-fill-upper {
        background: var(--border-lightgray);
}


/*input range style END*/


/****************************************************************************/
/* DATE PICKER                                                              */
/****************************************************************************/

/* DATE PICKER NEED MORE WORK ON THIS **/   
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent 
{
	padding:0 !important;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .singleDatePicker .calenderRight
{
	display:none;
}
#coral7 .csdkDatePickerInput 
{
	color: var(--colorTextSubBasic);
}

#coral7 .csdkDatePickerPopOut .csdkDatePickerInput 
{
	position: absolute;
	top: 9px;
}

#coral7 #tempMaster .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button
{
	background: url(/images/c7/iconB_authenticate.svg) no-repeat 13px center;
	border: 1px solid var(--colorBorder);
	padding: 5px 15px 5px 32px;
	background-size: 12px 12px;
	font-size: 12px;
	color: var(--color-text-link);
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	cursor: pointer;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:hover
{
	opacity: 1;
	background-color: var(--main-button-hover);
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button.cancel {
	background: url(/images/c7/iconB_cancel.svg) no-repeat 13px center;
	background-size: 9px;
	margin-left: 8px;}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:disabled
{
	filter: grayscale(1);
	opacity: 0.5;
	background-color: var(--disabled-button-background-color);
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv button:active {opacity:0.5;}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv
{
	border-top: 1px solid var(--colorBorder);
	padding:10px;
	justify-content: flex-end;
	align-items: center;
	font-weight: bold;
	padding-top: 31px;
	position: relative;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv
{
	position:relative;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders + .timePickerDiv
{
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders.timePicker + .timePickerDiv
{
	height: 44px;
	border-top: 1px solid var(--colorBorder);
	display: flex;
	justify-content: center;
	align-items: flex-end;
	padding: 4px 0 14px 4px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .content .calenders.timePicker.singleTimePicker + .timePickerDiv
{
	height: 29px !important;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .content
{
	flex-direction: column;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .applyDiv,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .content,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div
{
	display:flex;
	font-family:arial;
	font-size:12px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .timePickerDiv
{

}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .rightDiv
{
	flex-direction: column;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderLeft {border-right: 1px solid #e4e4e4;}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderLeft,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .calenderRight
{
	max-width: 234px;
	width: 234px;
	padding: 8px 12px 8px 8px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges .csdkRow.selected
{
	background: url(../images/c7/icon_arrowRightG.svg) no-repeat -2px center;
	padding-left: 12px;
	background-size: 11px 11px;
	font-weight: bold;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges .csdkRow
{
	line-height: 28px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges
{
	flex:1;
	padding: 8px 13px;
	border-right: 1px solid var(--colorBorder);
	max-width: 120px;
	min-width: 120px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .ranges.is-hidden
{
	display:none;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .calenders
{
	flex:6;
	margin-bottom:0;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker.timePicker .calenderLeft
{
	border-right: none;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker.timePicker + .timePickerDiv 
{
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleTimePicker + .timePickerDiv .csdkTimePickerWrapper:last-child
{
	display:none;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .calenders.singleDatePicker + .timePickerDiv .csdkTimePickerWrapper:last-child
{
	margin-left:3px;
} 
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right
{
	display:flex;
	flex-wrap: wrap;
	padding: 10px 5px 10px 13px;
	position:relative;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton
{
	position: absolute;
	background: url(/images/c7/iconB_leftArrow.svg) no-repeat;
	background-size: 5px;
	width: 21px;
	height: 21px;
	top: 12px;
	left: 12px;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	background-position: 6px center !important;
}


#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton
{
	position: absolute;
	right: 12px;
	background: url(/images/c7/iconB_rightArrow.svg) no-repeat;
	background-size: 5px;
	width: 21px;
	height: 21px;
	top: 12px;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	background-position: 7px center !important;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton:hover 
{
	opacity: 1;
	background-color: var(--main-button-hover);
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.previousButton:active,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv button.nextButton:active 
{
	opacity: 0.5;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left div:nth-child(2),
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right div:nth-child(1)
{
	width: 100% !important;
	flex-basis: 100% !important;
	text-align: center;
	font-size: 14px;
	color: var(--colorTextBrand);
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .cmonth.irange + .cmonth:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.srange.erange
{
	border-top-right-radius: 13px;
	border-bottom-right-radius: 13px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.irange:hover
{
	border-radius: 0 !important;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.today:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange:hover
{
	border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.past.srange:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth.erange.today:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate .cmonth:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.srange.erange
{
	border-top-left-radius: 13px;
	border-bottom-left-radius: 13px;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate.endDate.singleDatePicker .cmonth:hover
{
	border-radius: 13px !important;
}
#coral7 #datePicker2Ref .csdkDatePickerInput
{
	background-image: url(/images/c7/iconB_calendar.svg);
	background-repeat: no-repeat;
	background-position: 9px center;
	background-size: 12px;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	padding: 5px 12px;
	padding-left: 28px;
	font-size: 13px;
	display: inline-block;
}
#datePicker2Ref .csdkDatePickerInput:hover
{
	opacity: 1;
	background-color: var(--main-button-hover);
}
#coral7 #datePicker2Ref .csdkDatePickerInput:active
{
	opacity: 0.5;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.srange.erange
{
	color: #fff;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .cmonth:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders:hover .cmonth.irange
{
	background: #828282;
	color: #fff;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .cmonth.erange:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders .cmonth.srange:hover,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth.srange.erange
{
	background: var(--colorTextBrand);
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.startDate .irange
{
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange
{
	background: #828282;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.srange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .calenders.endDate .cmonth.irange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .cmonth.erange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .csdkDatePickerDOW
{
	font-weight:bold;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .today
{
	font-weight:bold;
	color: var(--main-color3);
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .left div,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv > div .right div
{
	flex-basis: 30px;
	padding:6px 0;
	text-align:center;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .pmonth,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .nmonth,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .cmonth.outofbounds
{
	opacity:0.6;
	pointer-events: none;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .past
{
	 background: #d1d1d1;
	 border-radius: 50%;
}

#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .cmonth.nottopickdate
{
	background: #d1d1d1;
	border-radius: 50%;
	opacity:0.6;
	pointer-events: none;
}
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .srange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .irange,
#coral7 .csdkDatePickerPopOut .csdkPopOutBoxContent .topDiv .erange
{
	opacity:1 !important;
}
#coral7 .csdkRow.csdkDatePickerRow .csdkCell > div {
	position: relative;
}

#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow select
{
	display: none;
	padding: 2px 12px 2px 2px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-position: 23px;
	background-size: 7px 18px;
}

#coral7 .csdkRow.csdkDatePickerRow .csdkCell {
	max-width: 43px; 
}

#coral7 .csdkRow.csdkDatePickerRow .csdkCell:first-child {
        max-width: 57px; 
}

#coral7 .csdkRow.csdkDatePickerRow .csdkCell > div span {
	padding: 4px 10px;
	display: block;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
}

#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerYear:hover select,
#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerMonth:hover select,
#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerDay:hover select
{
	display: block;
	position: absolute;
	left: 1px;
	top: -2px;
	border: 0 !important;
	background-image: url(../images/c7/icon_arrowDownG.svg);
	background-color: var(--mainBackground);
	background-repeat: no-repeat;
	background-position: calc(100% - 3px) center;
	font-size: 12px;
	padding: 4px 11px 4px 7px;
}
#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerHours:hover select,
#coral7 .csdkDatePickerWrapper .csdkRow.csdkDatePickerRow .csdkDatePickerMinutes:hover select
{
	background-position: 17px;
	background-size: 7px 18px;
	z-index: 100;
}

/* TIME PICKER  **/
#coral7 .csdkTimePickerWrapper .csdkTimePickerIcon {
	background: url(../images/c7/time.svg) no-repeat;
	width: 15px;
	height: 15px;
	display: inline-block;
}

#coral7 .csdkTimePickerWrapper
{
	color: #424143;
	font-family: arial;
	position: relative;
	font-size: 12px;
	transition: all 0.7s ease;
	flex-basis:120px;
}

#coral7 .csdkTimePickerWrapper:last-child {margin-left: 28px;}

#coral7 .timePickerDiv .csdkTimePickerIcon::before
{
	content: "Start";
	position: absolute;
	width: 50px;
	height: 10px;
	top: -21px;
	left: 50px;
	color: #919292;
	font-family: roboto;
}
#coral7 .timePickerDiv .csdkTimePickerWrapper:last-child .csdkTimePickerIcon::before
{
	content: "To";
	left: 59px;
}
#coral7 .singleTimePicker + .timePickerDiv .csdkTimePickerIcon::before
{
	content:"";
}
#coral7 .csdkFilter
{
	position:relative;
}
#coral7 .csdkFiltersWrapper .csdkFilterRemoveBtn
{
	display:none;
}
#coral7 .csdkFiltersWrapper:hover .csdkFilterRemoveBtn
{
	display:block;
	position: absolute;
	width: 12px;
	height: 12px;
	top: 3px;
	right: 4px;
	background: url(/images/c7/iconB_cancel.svg) no-repeat center, #fff;
	border-radius: 100%;
	background-size: 6px, 100%;
	border: 1px solid lightgray;
}
#coral7 .csdkFilterPopOutBoxContent .csdkFilterGenerator div,
#coral7 .csdkFilterPopOutBoxContent .csdkFilterGenerator select,
#coral7 .csdkFilterPopOutBoxContent .csdkFilterGenerator input {margin-right:2px;}
#coral7 .csdkFilterPopOutBoxContent .csdkFilterGenerator
{
	padding:3px;
}
#coral7 .csdkFilterGenerator {
	display: flex;
	align-items: center;
}

#coral7 .filterGenResultsDiv pre:empty {display:none;}
#coral7 .filterGenResultsDiv pre {
	display:block;
	border: var(--border-lightgray);
	background: var(--main-background-lightgray);
	padding: 5px;
	width: calc(100% - 10px);
}

#coral7 .csdkFilterGeneratorWrapper {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#coral7 .csdkFilterGenGetAttention
{
	background: linear-gradient(45deg, #c24725 25%, #d24a27 25%, #d24a27 50%, #c24725 50%, #c24725 75%, #d24a27 75%, #d24a27 100%);
	background-size: 12px;
}

#coral7 .csdkDatePickerLTimePicker.csdkFilterGenTimer:before,
#coral7 .singleTimePicker + .timePickerDiv .csdkDatePickerLTimePicker:before
{
	display:none;
}
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow {
	display: flex;
	position: absolute;
	width: 90px;
	border: 1px solid var(--colorBorder);
	overflow: hidden;
	height: 20px;
	margin-left: 5px;
	padding: 1px 2px ;
	top: -4px;
	width: 95px;
	opacity: 1;
	overflow: visible;
}

#coral7 .csdkTimePickerWrapper .csdkTimePickerIcon + .csdkRow.csdkTimePickerRow {
	margin-left: 20px;
}
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow select
{
	display: none;
	padding: 2px 12px 2px 2px;
	position: absolute;
	left: 0px;
	top: 0px;
	background-position: 23px;
	background-size: 7px 18px;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMeridiem
{
	position: relative;
	align-self: center;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:after {
	content: ' : ';
	position: absolute;
	display: inline-block;
	top: -1px;
	width: 3px;
	height: 20px;
	margin-left: 5px;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkCell
{
	justify-content: center;	
	overflow: visible;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkCell:last-child
{
	justify-content: left;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:hover select,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes:hover select,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds:hover select,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMeridiem:hover select
{
	display: block;
	position: absolute;
	left: -2px;
	top: -6px;
	border: 0;
	background-color: #eee;
}

#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerHours:hover select,
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerMinutes:hover select
#coral7 .csdkTimePickerWrapper .csdkRow.csdkTimePickerRow .csdkTimePickerSeconds:hover select
{
	background-position: 17px;
	background-size: 7px 18px;
	z-index: 100;
}

/***Coral Tabs***/


#coral7 .CoralTabs ul
{
	list-style: none;
	padding: 0px;
}



/****************************************************************************/
/* widget Notification                                                   */
/****************************************************************************/
#coral7 #standardHeading #leftNotify.notification
{
	font-size: 12px;
	font-family: var(--main-font-Bold);
	color: var(--mainBackground);
	background: var(--main-color-pink);
	width: 18px;
	height: 18px;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 100%;
	top: 2px;
	left: 34px;
}


/**Pagination***/
#coral7 ul.pagination {
	list-style: none;
	display: flex;
	width: 100%;
	padding: 15px;
	margin: 0;
	justify-content: center;
}
#coral7 ul.pagination li:empty {display:none;}
#coral7 ul.pagination li button {
	float: left;
	border-radius: 0;
	padding: 5px 7px 6px 7px;
	text-decoration: none;
	border-top: var(--border-lightgray);
	border-bottom: var(--border-lightgray);
	border-right: var(--border-lightgray);
	background: var(--mainBackground);
	border-width: 1px;
	border-left: none;
	margin: 0;
	height: 23px;
	font-size: 11px;
	line-height: 12px;
	color: var(--color-text-link);
	text-shadow: none;
	cursor: pointer;
}
#coral7 ul.pagination li button:hover
{
	background-color: var(--main-button-hover);
}
#coral7 ul.pagination li button.selected
{
	background: var(--main-background-selected);
}
#coral7 ul.pagination li:first-child button,
#coral7 ul.pagination li:nth-child(2) button,
#coral7 ul.pagination li:nth-last-child(2) button,
#coral7 ul.pagination li:nth-last-child(1) button
{
	width: 20px;
	color: transparent;
	background-repeat: no-repeat;
	background-size: 5px;
	background-position: center;
}
#coral7 ul.pagination li:first-child button {
	border-left: var(--border-lightgray);
	border-radius: var(--borderRadiusMedium) 0 0 var(--borderRadiusMedium);
	background-image: url(/images/c7/iconB_doubleLeftArrow.svg);
	background-size: 9px;
}
#coral7 ul.pagination li:last-child button {
	border-radius: 0 var(--borderRadiusMedium) var(--borderRadiusMedium) 0;
	background-image: url(/images/c7/iconB_doubleRightArrow.svg);
	background-size: 9px;
}
#coral7 ul.pagination li:nth-child(2) button
{
	background-image: url(/images/c7/iconB_leftArrow.svg);
}
#coral7 ul.pagination li:nth-last-child(2) button
{
	background-image: url(/images/c7/iconB_RightArrow.svg);
}
#coral7 ul.pagination li:first-child button:disabled,
#coral7 ul.pagination li:nth-child(2) button:disabled,
#coral7 ul.pagination li:nth-last-child(2) button:disabled,
#coral7 ul.pagination li:nth-last-child(1) button:disabled
{
	background-color: var(--colorBackground);
	pointer-events: none;
	filter: grayscale(1);
	opacity: 0.8;
}


/***Buttons***/

#coral7 button.normalBtn,
#coral7 button.normalBtnNI,
#coral7 button.normalBtnSm
{
	background-image: url(/images/c7/iconB_authenticate.svg);
	background-repeat: no-repeat;
	background-position: 12px center;
	background-size: 13px ;
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	padding: 10px 15px;
	padding-left: 35px;
}
#coral7 button.normalBtn.noTxt,
#coral7 button.normalBtnSm.noTxt
{
	color: transparent;
	max-width: 25px;
	width: 25px;
	padding: 0;
	height: 25px;
	background-position: center;
}
#coral7 button.normalBtnNI
{
	background-image:none;
	padding: 10px 15px;
}
#coral7 button.normalBtn:hover,
#coral7 button.normalBtnNI:hover,
#coral7 button.normalBtnSm:hover
{
	opacity: 1;
	background-color: var(--main-button-hover);
}
#coral7 button.normalBtn:active,
#coral7 button.normalBtnNI:active,
#coral7 button.normalBtnSm:active
{
	opacity: 0.5;
}
#coral7 button.colorBtn
{
	width: 200px;
	background: var(--colorTextBrand);
	color: var(--mainBackground);
	font-family: var(--main-font-Bold);
	border-radius: var(--borderRadiusMedium);
	padding: 10px;
	border: none;
	cursor: pointer;
}
#coral7 button.normalBtn.normalBtnSm {
	background-size: 12px;
	font-size: 12px;
	padding: 5px 10px 5px 30px;
	background-position: 10px center;
}
#coral7 button.normalBtnSm.noTxt {
	padding: 0;
	width: 20px;
	background-position: center;
	height: 20px;
	background-size: 10px;
}
#coral7 .buttonGWrapper {
	border: 1px solid var(--colorBorder);
	display: inline-flex;
	border-radius: var(--borderRadiusMedium);
}
#coral7 .buttonGWrapper button {
	margin: 0;
	border: 0 !important;
	border-right: 1px solid var(--colorBorder) !important;
	border-radius: 0px;
}
#coral7 .buttonGWrapper button:first-child
{
	border-radius: var(--borderRadiusMedium) 0 0 var(--borderRadiusMedium);
}
#coral7 .buttonGWrapper button:last-child
{
	border-right: 0px solid var(--colorBorder) !important;
	    border-radius: 0 var(--borderRadiusMedium) var(--borderRadiusMedium) 0;
}

#coral7 .loader.loader01
{
	background-image: url(/images/c7/Loader01.gif);
	background-repeat: no-repeat;
	background-position: center;
}

#coral7 .loader.loader02
{
	background-image: url(/images/c7/Loader02.gif) ;
	background-repeat: no-repeat;
	background-position: center;
}

#coral7 .loader.loader03
{
	background-image: url(/images/c7/Loader03.gif) ;
	background-repeat: no-repeat;
	background-position: center;
}


/** TOOL KIT***/

#coral7 input.csdkSearchBox {
	padding: 4px 8px;
	width: auto;
	background-image: url(/images/c7/iconB_search.svg);
	background-repeat: no-repeat;
	background-position: calc(100% - 8px) center;
	background-size: 12px;
	border: 1px solid var(--colorBorder);
}

#coral7 input.csdkBorderlessInput
{
	padding: 4px 8px;
	width: auto;
	border: 1px solid var(--colorBorder);
}

#coral7 #csdkToolkit_tabSet .csdkTab {
	border: 0px !important;
	padding: 0px;
	background-color: var(--mainBackground);
}

#coral7 #csdkToolkit_tabSet .csdkTab .csdkTabLabel {
	font-size: 13px;
	padding: 10px 15px;
	cursor: pointer;
	color: var(--colorTextBasic);
}

#coral7 #csdkToolkit_tabSet .csdkTab.selected
{
	border-bottom: 3px solid var(--colorTextBrand) !important;
	background-color: var(--main-button-hover);
}

#coral7 .csdkTabContent .csdkWrapperWrapper .csdkTabSet {
	display: flex;
	flex-direction: row;
	flex-grow: 1;
}

#coral7 #csdkToolkit_tabSet .csdkWrapperWrapper .csdkTabSetHeader {
	display: flex;
	flex-direction: column;
}

#coral7 #csdkToolkit_tabSet .csdkWrapperWrapper .csdkTabSetHeader .csdkTab.selected
{
	border-left: 3px var(--colorTextBrand) solid !important;
	background-color: var(--main-button-hover);
}





/***USER MENU SELECTOR***/

#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent
{
	filter: none;
	box-shadow: rgba(50, 50, 50, 0.3) 0px 4px 10px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu
{
	display: block; 
	position: absolute;
	background: var(--mainBackground) !important;
	overflow: visible;
	    overflow-y: unset !important;
}

#coral7 .csdkDirBrowser.UMS_Menu 
{
	border-radius: 0.35rem;
	overflow-y: auto;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox.Mode_accordion
{
	width: auto !important;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox .csdkDirBrowser.hierarchical.UMS_Menu{
	display: none;
	box-shadow: 0px 0px 10px #3333332e;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox .csdkDirBrowser.hierarchical.UMS_Menu.active{                                           
	display: block;                                                                                                 
	margin-left: 20px;
	z-index: 1000;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTableBody {
	padding: 5px 0;
	background: white;
	border-radius: 0.25rem;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .disclosureContent {
	min-width: 200px;
	left: 100%;
	top: 0px;
	padding: 5px 0;
	position: absolute;
	border-radius: 0.25rem;
	width: calc(100% - 40px);
	border-color: var(--colorBorder) !important;
	z-index: 10;
	resize: both;
	height: auto !important;
}


#coral7 .UMS_MenuWrapper .hierarchical.UMS_Menu .csdkDirBrowser .csdkRow > .csdkCell:first-child
{                                  
	background: url(../images/c7/folderClose.svg) no-repeat 3px top;
	background-size: 15px;
	background-color: red;
	height: 22px;
	width: 22px;
	border-radius: 0.25rem;
	flex-basis: 22px;
	margin-right: 5px;
}

#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child 
{
	margin-right: 5px;
	height: 22px;
	width: 22px;
	border-radius: 0.25rem;
	flex-basis: 22px;
}
#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.item > .csdkCell:first-child,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.item > .csdkCell:first-child,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.item > .csdkCell:first-child
{
	background-image: url(/images/c7/iconW_item.svg);
	background-size: 11px;
	background-position: center;
	background-color: #9acc00;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child
{
	display: none;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child + .csdkCell,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child  + .csdkCell,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child  + .csdkCell
{
	padding-left: 27px;
	position: relative;
	overflow: inherit;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child + .csdkCell:before,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder > .csdkCell:first-child  + .csdkCell:before,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child  + .csdkCell:before
{
	background-image: url(/images/c7/iconW_folder.svg);
	background-size: 12px;
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 0.25rem;
	background-color: #6582d4;
	content: ' ';
	display: inline-block;
	width: 22px;
	height: 22px;
	position:absolute;
	left: 0px;
	top: -3px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu  .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder.open > .csdkCell:first-child  + .csdkCell:before
{
	background-image: url(/images/c7/iconW_folderOpen.svg);
	background-size: 13px;
	background-position: 5px 6px;
	background-color: #6582d4;
}

#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.open {
	background: rgb(238 249 255);
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable
{
	margin: 0px;
	background: white;
	border-radius: 0.25rem;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTableBody .csdkCell:first-child {
	margin-right: 5px;
	background-color: red;
	width: 25px;
	height: 25px;
	border-radius: 0.25rem;
	flex-basis: 25px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkRow.csdkHeader
{
	width: calc(100% - 20px);
	padding: 10px 10px 5px 10px;
}

#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkRow.csdkHeader
{
	width: 100%;
	padding: 0;
}

#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .disclosureLabel
{
	text-align: left;
	font-weight: normal;
	font-size: 12px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow,
#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow
{
	padding: 5px 10px;
	width: calc(100% - 20px);
	cursor: pointer;
}

#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow
{
	padding: 5px 0px;
	width: 100%;
	cursor: pointer;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow:hover,
#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow:hover,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow:hover
{
	background-color: #f4f6f9;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow.separator,
#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow.separator,
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.separator
{
	padding: 0 7px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow .csdkCell:nth-child(2),
#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow .csdkCell:nth-child(2),
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow .csdkCell:nth-child(2)
{
	    margin-top: 2px;
}

#coral7 .csdkDirBrowser .csdkRow.item .csdkCell .disclosureWrapper.separator
{
	border-bottom: 2px solid var(--colorBorder);
}

#coral7 .csdkRow.item.separator .csdkCell:first-child {
	display: none;
}

#coral7 .UMS_DialogBox .UMS_MenuWrapper .csdkCell > div
{
	display: block;
	width: 100%;
}

#coral7 .UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn {
	background-size: 20px;
	padding: 5px 10px;
	text-transform: capitalize;
	    background: var(--brandAccessible) !important;
	border-radius: var(--borderRadiusMedium);
	cursor: pointer;
	height:35px;
	width: calc(100% - 40px);
	color: #fff;
	font-size: 13px;
   	margin: 10px auto 5px;
	border: 0px;
}

#coral7 .UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn:hover
{
	background: var(--brandAccessibleActive) !important;
}


#coral7 .UMS_DialogBox .showQueryTableCellTextTextSpan
{
	font-size: 14px !important;
	text-align: center !important;
	padding: 20px 20px 5px !important;
	min-height: 20px !important;
}

#coral7 .csdkPopOutBoxContent.UMS_PopOutBoxContent {
	padding: 0;
	border-radius: 0.5rem;
}

#coral7 #USERMENUSELECTOR
{
	background-color: var(--mainBackground);
}

#coral7 #USERMENUSELECTOR .csdkDWindTitleBar
{
	border-bottom: 1px solid #D1D2D4;
}

#coral7 .UMS_PopOutBoxContent .UMS_MenuWrapper .csdkCell > div input.UMS_ShowMenuBtn
{
	width: 100%;
	margin: 0;
}

#coral7 div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div  button {
	border: 1px solid var(--colorBorder);
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	cursor: pointer;
	background-color: var(--mainBackground);
	background-size: 12px;
	font-size: 12px;
	padding: 10px;
	background-position: 5px center;
	margin-right: 3px;
}

#coral7 div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div  button:hover
{
	background-color: #f4f6f9;
}


#coral7 .UMS_PopOutBoxContent .UMS_MenuWrapper {
	min-width: 200px;
}

#coral7 .csdkDirBrowser.hierarchical.UMS_Menu .csdkHeader .csdkCell div
{
	display: contents;
}


#coral7 div#USERMENUSELECTOR .csdkDWindContentWindow .csdkDWindSettingsWindow + div {
        background: white;
	margin: 10px;
}
#coral7 .UMS_PopOutBoxContent .UMS_MenuWrapper .csdkDirBrowser.hierarchical.UMS_Menu.active .disclosureContent
{
	left: 100px;
	min-width: 200px;
}

#coral7 div#USERMENUSELECTOR .csdkDWindContentWindow {
	padding: 0;
	background: white;
}

#coral7 .UMS_MenuWrapper input[placeholder="Search"] {
	background: var(--mainBackground) !important;
	width: 100%;
	text-transform: capitalize !important;
	border: 1px solid lightgray !important;
	font-size: 13px !important;
	margin-bottom: 5px !important;
	background-image: url(../images/c7/iconB_search.svg) !important;
	background-repeat: no-repeat !important;
	background-position: calc(100% - 8px) center !important;
	background-size: 13px !important;
	text-transform: capitalize !important;
	font-size: 12px !important;
	font-family: SalesforceSans-Regular, arial !important;
	padding: 0.2rem 0.5rem;
	border: 1px solid !important;
	border-color: var(--colorBorder) !important;
	border-radius: var(--borderRadiusMedium) !important;
	height: 20px;}

#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu {
	border: 0;
	resize: none;
	width: 100%;
	overflow-y: auto;
}

#coral7 .csdkDirBrowser.UMS_Menu .csdkRow.open > .csdkCell > .disclosureWrapper > .disclosureContent {
	display: block;
	margin-top: 5px;
}

#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkHeader .csdkCell > div {
	width: calc(100% - 20px);
}

#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkHeader .csdkCell > div input[placeholder="Search"]
{
	width: calc(100% - 15px);
}

#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkHeader .csdkCell
{
	justify-content: left;
}

#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkHeader .csdkCell > div
{
         width: calc(100% - 20px);                                                                                   
}
#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox button[disabled="true"],
#coral7 div.csdkPopOutBoxContent.UMS_PopOutBoxContent button[disabled="true"]{
	background: var(--disabled-button-background-color) !important;
	filter: grayscale(1);
	pointer-events: none;
}

#coral7 .USM_ToolTip
{
	z-index:9999999999 !important;
}

#coral7 .showQuery_Table span.showQueryTableCellTextTextSpan:empty, 
#coral7 div#coral_AlertPopUpDiv.stepUpAuth .showQuery_Expansion:empty
{
	display:none !Important;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTextSpan
{
	color: #999 !important;
	display: block;
	max-width: 100%;
	text-align: left !important;
	font-size: 12px !important;
	border-bottom: 1px solid var(--colorBorder) !important;
	min-height: 10px !important;
	padding: 10px !important;
	margin: 0;
	width: calc(100% - 20px);
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox .showQueryTableCellTextTextSpan span.itemSelected
{
	color: var(--brandAccessible) !important;
}


/***SALESFORCE**/

#coral7 .salesforce .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child, div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow > .csdkCell:first-child {
	height: 20px;
	width: 20px;
	border-radius: 0.2rem;
	flex-basis: 20px;
	margin-right: 5px;
}

#coral7 .salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkTable .csdkTableBody .csdkRow, 
#coral7 .salesforce .UMS_DialogBox .UMS_MenuWrapper .csdkDirBrowser.UMS_Menu .csdkTableBody .csdkRow {
	padding: 3px 7px;
}

#coral7 .salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder > .csdkCell:first-child, 
#coral7 .salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.folder > .csdkCell:first-child, 
#coral7 .salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder > .csdkCell:first-child 
{
        background-size: 11px;
	    background-position: center;
}

#coral7 .salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child, 
#coral7 .salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.folder.open > .csdkCell:first-child, 
#coral7 .salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.folder.open > .csdkCell:first-child 
{
	background-size: 12px;
	background-position: center;
}

#coral7 .salesforce .csdkDirBrowser.hierarchical.UMS_Menu .csdkRow.item > .csdkCell:first-child, 
#coral7 .salesforce .UMS_DialogBox .csdkDirBrowser.UMS_Menu .csdkRow.item > .csdkCell:first-child, 
#coral7 .salesforce div.csdkPopOutBoxContent.UMS_PopOutBoxContent .UMS_Menu .csdkTableBody .csdkRow.item > .csdkCell:first-child 
{
        background-size: 9px;
}

#coral7 .salesforce div#coral_AlertPopUpDiv.csdkDialog {
	position: absolute;
	left: 50px !important;
	top: 50px !important;
}

#coral7 .salesforce .UMS_DialogBox .showQuery_Expansion
{
	margin: 0;	
}

#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion,
#coral7 .UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion 
{
	border: 0;
	resize: none;
	width: 600px;
	display: flex;
	flex-direction: row;
	max-width: 600px;
	overflow: auto;
}


#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable,
#coral7 .UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable
{
	display: none;
}

#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable.open,
#coral7 .UMS_DialogBox .csdkDirBrowser.UMS_Menu.accordion .csdkTable.Root,
#coral7 .UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable.open,
#coral7 .UMS_PopOutBoxContent .csdkDirBrowser.UMS_Menu.accordion .csdkTable.Root
{
        display: block;
}


#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox.Mode_hierarchical {
	width: 300px !important;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox.Mode_hierarchical input.UMS_ShowMenuBtn {
	margin-left: 20px;
}

#coral7 div#coral_AlertPopUpDiv.UMS_DialogBox .csdkDirBrowser.hierarchical.UMS_Menu.active {
	display: block;
	margin-left: 20px;
	z-index: 1000;
	position: absolute;
	top: 40px;
	width: 100%;
}

#coral7 .showQuery_Expansion span {
	font-size: 13px;
	text-align: center;
	display: block;
	margin-bottom: 5px;
}
/****************************************************************************/
/* ComboSelect                                                              */
/****************************************************************************/
#coral7 .csdkDirBrowser.comboselect
{
        border: none;
        resize: none;
        width: 100%;
        position: relative;
        overflow: visible;
}
#coral7 .csdkDirBrowser.comboselect .csdkRow.item > .csdkCell:first-child
{
        background: url(../images/green_doubletick.svg) no-repeat center;
        background-size: 20px;
        height: 20px;
        margin-right: 5px;
}
#coral7 .csdkDirBrowser.comboselect .csdkTableBody {display:none; } 
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody {display:flex; } 
#coral7 .csdkDirBrowser.comboselect.active.picked .csdkTableBody {display:none; } 

#coral7 .csdkDirBrowser.comboselect.picked .csdkHeader input 
{
        background: url(../images/callRecord_positive.svg) no-repeat 97% center;
        background-size: 15px;
}

#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow .disclosureWrapper .disclosureLabel
{
        line-height: 20px;
} 
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow 
{
        padding: 8px 10px;
        border: 1px solid lightgray;
        border-width: 0 1px 0 1px;
        background: #ffffffe6;
        width: calc(100% - 22px);
}
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:first-child
{
        border-width: 1px 1px 0px 1px;
        padding-top:15px;
}
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:last-child
{
        padding-bottom:15px;
}
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody .csdkRow:hover
{
        background: #f3f3f3;
}
#coral7 .csdkDirBrowser.comboselect.active .csdkTableBody
{
        border-bottom: 1px solid lightgray;
        width: 100% ;
        box-shadow: 3px 3px 4px #d3d3d357;
        position: absolute;
        top: 45px;
        z-index: 10000;
        left: 0px;
        max-height: 172px;
        overflow-y: auto;
}
#coral7 .csdkDirBrowser.comboselect .csdkHeader .csdkCell input
{
        padding: 5px;
        border: 1px solid ;
        border-color: #dddbda ;
        border-radius: 0.25rem ;
        margin-top: 5px;
        font-size: 12px;
}
#coral7 .csdkDirBrowser.comboselect .csdkHeader .csdkCell > div
{
        display: flex;
        flex-direction: column;
        width: 100% ;
}
#coral7 .csdkComboSelect
{
        position: relative;
}
#coral7 .csdkDirBrowser.comboselect .csdkRow.item.is_selected
{
            background-color: #e7f7ff;
}
/********  Enhanced Combo Select   **********/

#coral7 .csdkDirBrowser.enhancedComboSelect
{
    border: 0px;
    resize:none;
    /* min-height: 25px; */
    /* display: inline-flex; */
    padding: 0;
    margin: 0;
    overflow: visible;
}


#coral7 .csdkDirBrowser.enhancedComboSelect .Root .csdkRow.csdkHeader
{
    width:100%;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkHeader .csdkCell
{
    justify-content: flex-start;
}

#coral7 .csdkDirBrowser.enhancedComboSelect input[placeholder="Search"],
#coral7 .csdkDirBrowser.enhancedComboSelect input[type="text"]
{
    border: var(--border-lightgray);
    border-radius: var(--borderRadiusMedium) !important;
    padding: 5px 30px 5px 8px;
    width: calc(100% - 33px);
    background-image:url(../images/searchIcon.svg);
    margin-top: 0px;
    background-size: 12px;
    background-repeat:no-repeat;
    background-position: calc(100% - 8px) 6px;
    background-color: var(--mainBackground);
    padding-right: 22px;
    text-overflow: ellipsis;
}

#coral7 .csdkDirBrowser.enhancedComboSelect input[type="text"]
{
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 9.1 6.2' style='enable-background:new 0 0 9.1 6.2;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%234082C3;%7D%0A%3C/style%3E%3Cg%3E%3Cg id='Layer_1-2'%3E%3Cpolygon class='st0' points='4.5,6.2 9.1,0 0,0 '/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
        background-size: 9px;
        background-repeat:no-repeat;
        background-position: calc(100% - 8px) center;
}

#coral7 .csdkDirBrowser.enhancedComboSelect input[type="text"]:disabled
{
        pointer-events: none;
        filter: grayscale(1);
        background-color: #d7d7d7;
        opacity: 0.7;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root
{
    margin: 0;
    position: relative;
    z-index: 1;
    /* top: 0; */
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody
{
    max-height: 170px;
    border: var(--border-lightgray);
    margin: 0 5px 5px;
    position: relative;
    top: -1px;
    display:none;


    overflow-y: auto;
    box-shadow: rgb(202, 199, 197) 0px 0px 3px;
    resize: none;
    border-radius: var(--borderRadiusMedium) !important;
    height: auto !important;
    background-color: var(--mainBackground);
}

#coral7 .csdkDirBrowser.enhancedComboSelect.active .csdkTable.Root .csdkTableBody
{
        display: block;
        position: absolute;
        top: 26px;
        width: calc(100% - 8px);
        margin-left: 0px;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody .csdkRow
{
    padding: 7px 10px;
    cursor:pointer;
    flex-direction:row-reverse;
    border-bottom: 1px solid rgb(230, 230, 235);
    transition:0.2s background;
    width: calc(100% - 20px);
    min-width: 170px;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkTableBody .csdkRow:hover
{
    background-color: rgb(230 231 232 / 54%);
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkRow.csdkHeader
{
    padding: 0;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkRow.item > .csdkCell:first-child
{
    background-image:url(../images/tickGreen.svg);
    background-size: 11px;
    background-repeat:no-repeat;
    background-position: right 2px;
    display:none;
}


#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root .disclosureLabel 
{
   
    cursor: pointer;
    color: var(--color-text-link) !important;
}


#coral7 .csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar {
     width: 8px; 
}       
        
#coral7 .csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-track 
{
     background: #f6f6f6;
}

#coral7 .csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-thumb 
{
     background: #dbd9d9; 
     border-radius:0.5rem;
}       
#coral7 .csdkDirBrowser.enhancedComboSelect ::-webkit-scrollbar-thumb:hover
{
     background: #c5c5c5;
     cursor:pointer;
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkRow.item.is_selected
{
    background: var(--color-background-selection);
}

#coral7 .csdkDirBrowser.enhancedComboSelect .csdkTable.Root .csdkRow.csdkHeader .csdkCell > div
{
    width: calc(100% - 4px);
}



/*** enhanced combo select end here  ***/



/** toolkt box  **/

#coral7 .csdkBoxesContentWrapper.source.phantom {
	padding: 10px;
	background: var(--color-background-selection);
}

#coral7 .csdkBoxesContentInsideWrapper {
	border-bottom: 1px dashed var(--colorBorder);
	padding: 5px;
}






/********  HTML EDITOR  **********/

#coral7  .csdkHTMLEditor input[type=radio]:checked, 
#coral7  .csdkHTMLEditor input[type=radio]:hover, 
#coral7 .csdkHTMLEditor input[type=radio],
#coral7  .csdkHTMLEditor input[type=checkbox]
{
	margin: 0 1px;
}




#coral7 .csdkEmailInputs
{
	padding: 13px 18px;
	border-bottom: var(--border-lightgray);
	width: calc(100% - 36px);
	position: sticky;
	margin-bottom: 5px;
}

#coral7 .csdkEmailInputs .csdkCell
{
	align-items:center;
}

#coral7 .csdkEmailInputs .csdkCell.input 
{
	padding: 5px;
	width: calc(100% - 120px);
	align-items: center;
	font-size: 13px !important;
}

#coral7 .csdkEmailInputs .csdkCell.label 
{
    max-width: 50px;
}

#coral7 .csdkEmailInputs .csdkCell.input input
{
	border: var(--border-lightgray);
	padding: 4px 8px;
	border-radius: 0.25rem;
	width: 100%;
	font-size: 12px;
}

#coral7 .csdkEmailInputs .csdkCell.input input.toInput 
{
        padding-right: 60px;
        text-overflow: ellipsis;
        width: calc(100% - 60px);
}

#coral7 .csdkEmailInputs .csdkCell.input input.invalid 
{
	border: 1px solid #c4351e !important;
	background: url(/images/warningIcon.svg) no-repeat calc(100% - 60px) center;
	background-size: 10px;
	width: calc(100% - 15px);
}

#coral7 .csdkEmailInputs .csdkCell.input input.ccInput.invalid, 
#coral7 .csdkEmailInputs .csdkCell.input input.bccInput.invalid 
{
	background-position: calc(100% - 10px);
}


#coral7 .csdkRow.interactionContentEmailFormaterRibbonBar.show .csdkHTMLEditor .csdkPopOutBox.emojiPopout,
#coral7 .csdkRow.interactionContentEmailFormaterRibbonBar .csdkHTMLEditor .csdkPopOutBox.emojiPopout  
{
	margin-right: 20px!important;
}

#coral7 .interactionContentEmailFormaterRibbonBar {
	border: var(--border-lightgray);
	width: calc(100% - 2px);
	display: flex;
	justify-content: flex-start;
	border-bottom: 0;
	min-height: 50px;
}

 #coral7 button.PostButton {
	background-image: url(/images/iconW_send.svg);
	right: auto;
	position: absolute;
	right: 25px;
	min-width: 100px;
	text-indent: initial;
	color: white;
	background-position: 80%;
	padding: 0 50px 0 15px;
	text-align: left;
	height: 50px;
	bottom: 15px;
	top: auto;
	border-radius: 0.25rem;
}

 #coral7 button.PostButton.invalidPB
{
	filter: grayscale(1);
	pointer-events:none;
}

 #coral7 .csdkEmailInputs div.csdkRow
{
	position: relative; 
}

#coral7 .csdkEmailInputs .ccClose,
#coral7 .csdkEmailInputs .bccClose,
#coral7 .csdkEmailInputs .cc,
#coral7 .csdkEmailInputs .bcc
{
	border: 0px;
	background: none;
	color: var(--color-text-link);
	position: absolute;
	right: 28px;
	top: 23px;
	font-size: 12px;
}

#coral7 .csdkEmailInputs .cc
{
	right: 55px;
}

 #coral7 .csdkEmailInputs .ccClose, 
#coral7 .csdkEmailInputs .bccClose
{
	border: 1px solid var(--colorBorder);
	width: 25px;
	height: 25px;
	border-radius: 0.25rem;
	top: 5px;
	right: 5px; 
	background: url(/images/iconB_cancel.svg) center / 8px no-repeat, var(--mainBackground);
	color: transparent;
}




#coral7 .csdkEmailInputs button.bccClose,
#coral7 .csdkEmailInputs button.ccClose
{
	
	background-size:11px;
	background-repeat:no-repeat;
	background-position:center;
	background-size:11px;
	color:transparent;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.8.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16.3 16.3' style='enable-background:new 0 0 16.3 16.3;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%234082C3;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;%7D%0A%3C/style%3E%3Cg id='Layer_2_00000093170681872265159410000017588644055716373694_'%3E%3Cg id='Layer_1-2'%3E%3Cline class='st0' x1='3.4' y1='3.4' x2='12.9' y2='12.9'/%3E%3Cline class='st0' x1='3.4' y1='12.9' x2='12.9' y2='3.4'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}

#coral7 .csdkPopOutBox.colourPopout {
    /* width: 20px; */
}

#coral7 .csdkPopOutBox.backgroundPopout {
    width: 30px;
}

#coral7 .csdkHTMLEditor {
    display: flex;
}


#coral7 .csdkHTMLEditor input[type="radio"].centre,
#coral7 .csdkHTMLEditor input[type="radio"].right,
#coral7 .csdkHTMLEditor input[type="radio"].left
{
	width: 34px;
	height: 24px;
	margin-right: -28px;
	opacity: 0;
}
#coral7 input[type="checkbox"].boldToggle,
#coral7 input[type="checkbox"].italicToggle,
#coral7 input[type="checkbox"].underlineToggle,
#coral7 input[type="checkbox"].strikeToggle
{
	width: 35px;
	height: 30px;
	opacity: 0;
	padding:18px 20px;
	margin:0;
}

#coral7 .csdkPopOutBox.colourPopout input.colourPopout {
    width: 15px;
}


#coral7 #csdkHTMLEditorRemoteTools
{
	
}

#coral7 .csdkRemoteEditorWrapper .csdkHTMLEditorDiv
{
	position: relative;
	top: 42px;
	font-family: unset;
}
#coral7 .csdkHTMLEditorDiv
{
	border: 0px solid var(--colorBorder);
	padding: 10px;
	margin: 10px;
	font-family: arial;
	text-decoration: unset;
	font-style: unset;
	font-size: 10px;
	width: calc( 100% - 40px );
	min-height: 200px;
	display: inline-block;
	font-size: 12px;
}
/*DO NOT CHANGE HERE*/
#coral7 .csdkHTMLEditorDiv p:not(DIV[signature="true"] p)
{
/*	margin-top:0;
	margin-bottom:0; */
}
#coral7 .csdkHTMLEditorDiv li
{
	display:list-item !important;
}
/*DO NOT CHANGE HERE END*/

#coral7 #editor div,
#coral7 #editor span
{
	color: unset;
	font-family: unset;
}
#coral7 #editor ul
{
	padding:revert;
	margin:unset;
}
#coral7 #editor h1,
#coral7 #editor h2
{
	text-shadow: none;
	font-size:unset;
}

/* Email Jun13 get rid of important for DKB Email issue  font-family: unset !important;
text-decoration: unset !important; font-style: unset !important;*/

#coral7 .csdkHTMLEditor SPAN.boldToggle.selected,
#coral7 .csdkHTMLEditor SPAN.italicToggle.selected,
#coral7 .csdkHTMLEditor SPAN.underlineToggle.selected,
#coral7 .csdkHTMLEditor SPAN.strikeToggle.selected
{
	border: 1px solid red;
}

#coral7 .csdkHTMLEditor
{
	display: flex;
	align-items: center;
	transform: scale(0.8);
	/* position: absolute; */
	/* left: -59px; */
	opacity:1;
	z-index:500;
	justify-content: space-around;
	/* border-bottom: var(--border-lightgray); */
}
#coral7 .inactive .csdkHTMLEditor
{
	opacity: 0.5;
}

#coral7 .csdkHTMLEditor > select
{
	margin-right:5px;
	 padding:10px 15px;
}

#coral7 .csdkHTMLEditor > select.fontSize
{
	width:60px;
}
#coral7 .csdkHTMLEditor .csdkPopOutBox input
{
	width: 25px;
	border: none;
	height: 24px;
	cursor:pointer;
}
#coral7 .csdkHTMLEditor span.italicToggle
{
	background: url(/images/htmlEditorItalic.svg) no-repeat center;
	background-size:  8px;
	padding:5px 18px;
	margin-left:-42px;
}
#coral7 .csdkHTMLEditor span.underlineToggle
{
	background: url(/images/htmlEditorUnderline.svg) no-repeat center ;
	background-size:  13px;
	padding:5px 18px;
	margin-left:-42px;
}
#coral7 .csdkHTMLEditor span.strikeToggle
{
	background: url(/images/htmlEditorCross.svg) no-repeat center;
	background-size:  14px;
	padding:5px 18px;
	margin-left:-42px;
}
#coral7 .csdkHTMLEditor span.boldToggle
{
	background: url(/images/htmlEditorBold.svg) no-repeat center;
	background-size:  11px;
	padding: 5px 18px;
	margin-left:-42px;
	display: block;
	/* width: 30px; */
}
#coral7 .csdkHTMLEditor .csdkPopOutBox.emojiPopout {margin: 0 24px !important;} 
#coral7 .csdkHTMLEditor .csdkPopOutBox.emojiPopout input
{
	background: url(/images/htmlEditorEmoji.svg) no-repeat center;
	background-size:  22px;
}
#coral7 .csdkHTMLEditor .csdkPopOutBox.backgroundPopout input
{
	background: url(/images/htmlEditorBg.svg) no-repeat center;
	background-size: 25px 24px;
}
#coral7 .csdkHTMLEditor .emojiSelectorContent button
{
	border: none;
	background: white;
	margin: 2px 2px 0 0;
	font-size:20px;
}
#coral7 .csdkPopOutBoxContent .colorSelectorContent
{
	width: 164px;
	border: none;
	height: -webkit-fill-available;
	display: flex;
	flex-wrap: wrap;
	padding: 4px 10px;
}
#coral7 .csdkPopOutBoxContent .colorSelectorContent button
{
	width: 26px;
	height: 20px;
	border: none;
	margin: 1px 0 0 1px; 
}
#coral7 .csdkPopOutBoxContent .colorSelectorContent button.white,
#coral7 .csdkPopOutBoxContent .colorSelectorContent button.transparent
{
	border:1px solid lightgray;
	background:transparent;
	position:relative;
}
#coral7 .csdkPopOutBoxContent .colorSelectorContent button.transparent::after
{
	position:absolute;
	content:'';
	border-bottom: 1px solid red;
	-webkit-transform: translateY(-19px) translateX(4px) rotate(37deg);
	width: 30px;
	height:20px;
	left: -1px;
}
#coral7 .csdkHTMLEditor #redoButton,
#coral7 .csdkHTMLEditor #undoButton,
#coral7 .csdkHTMLEditor > span,
#coral7 .csdkHTMLEditor > div
{
	border: 1px solid lightgray;
	border-radius: 4px;
	padding:5px 7px;
	margin-top: 3px;
	width:25px;
	height: 25px;
	margin-right: 5px;
}
#coral7 .csdkHTMLEditor .undoRedoSet
{
	display:none;
}
#coral7 .csdkHTMLEditor .undoRedoSet.active
{
	display: grid;
	border: none;
	width: fit-content;
	margin-left: 9px;
	padding: 0;
	margin-top: -17px;
	grid-template-columns: 50% 50%;
	height: 20px;
}
#coral7 .csdkHTMLEditor #redoButton, 
#coral7 .csdkHTMLEditor #undoButton
{
	background: url(/images/undoEmail.svg) center 45% no-repeat, #fff !important;
	background-size: 14px !important;
	color: transparent;
	font-size: 0;
	width: 40px;
	height: 36px !important;
	margin-right: 0;
}
#coral7 .csdkHTMLEditor #redoButton
{
	background: url(/images/redoEmail.svg) center 45% no-repeat, #fff !important;
	background-size: 14px !important;
	margin-left:5px;
}

#coral7 .csdkHTMLEditor #redoButton:disabled,
#coral7 .csdkHTMLEditor #undoButton:disabled
{
	background-color: #c3c3c3 !important;
	opacity: 0.3;
	border: 1px solid #767676;
}

#coral7 .csdkHTMLEditor .justifyRadioSet
{
	width:90px;
	display:flex;
	padding: 5px 10px 5px 2px;
	margin-top:0;
	cursor:pointer;
}
#coral7 .csdkHTMLEditor .justifyRadioSet span.right
{
        background: url(/images/htmlEditorRight.svg) no-repeat center;
        background-size:  22px;
}
#coral7 .csdkHTMLEditor .justifyRadioSet span.centre
{
        background: url(/images/htmlEditorCenter.svg) no-repeat center;
        background-size:  22px;
}
#coral7 .csdkHTMLEditor .justifyRadioSet span.left
{
        background: url(/images/htmlEditorLeft.svg) no-repeat center;
        background-size:  22px;
}
#coral7 .csdkHTMLEditor .justifyRadioSet span
{
        width: 25px;
        border: none;
        height: 24px;
}
#coral7 .csdkHTMLEditor input[type="radio"].centre,
#coral7 .csdkHTMLEditor input[type="radio"].right,
#coral7 .csdkHTMLEditor input[type="radio"].left
{
	width: 34px;
	height: 24px;
	margin-right: -28px;
	opacity: 0;
}

#coral7 .csdkEmailInputs {order: 1;}

#coral7 .csdkHTMLEditorDiv {order: 3;}


#coral7 .csdkHTMLEditor {order: 2;/* width: 100%; */}

#coral7 .emojiSelectorContent
{
	width: 210px;
	max-height:200px;
	overflow:auto;
			     
}

#coral7 .emojiSelectorContent button {
	border: 0 !important;
	background: white;
	cursor: pointer;
}


#coral7 .emojiSelectorContent::-webkit-scrollbar {
	width: 0.665em;
}
					    
#coral7 .emojiSelectorContent:-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
					       
#coral7 .emojiSelectorContent::-webkit-scrollbar-thumb 
{
	background-color: #d0d0d0;
	border-radius:0.25rem;
	outline: 3px solid transparent;
}

#coral7 .csdkInputLabel
{
text-align:left;
}



/*csdkNotificationCentre*/
.csdkNotificationCentre.open
{
	display:block;
}
.csdkNotificationCentre
{
	position: fixed;
	right: 0px;
	top:0;
	display:none;
	z-index:10000;
	margin:15px;
}
.csdkNotificationCentre.alerts
{
	padding-bottom:10px;
	transition: height 0.2s ease-out;
}
.csdkNotificationCentre.banners
{
	transition: height 0.2s ease-out;
}

.csdkNotificationCentre_BannerWrapper .icon
{
	margin-right: 10px;
	background: url(/images/alertTriangleRed.svg) no-repeat center, rgba(0,0,0,0);
	background-size: 27px;
}
.csdkNotificationCentre_BannerWrapper > .csdkRow > .csdkCell.icon,
.csdkNotificationCentre_BannerWrapper > .csdkRow > .csdkCell.rightCell
{
	flex-grow:0 !important;
	min-width:50px !important;
}
.csdkNotificationCentre_BannerWrapper > .csdkRow > .csdkCell.rightCell {width: fit-content; justify-content: flex-end;}
.csdkNotificationCentre_BannerWrapper.banner:hover BUTTON.close
{
	display:initial;
}
.csdkNotificationCentre_BannerWrapper.banner BUTTON.close
{
	display:none
}
.csdkNotificationCentre_BannerWrapper .content
{
	font-size:11px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	align-self: center;
}
.csdkNotificationCentre_BannerWrapper .heading,
.csdkNotificationCentre_BannerWrapper .title,
.csdkNotificationCentre_BannerWrapper .text
{
	flex-grow:1;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}
.csdkNotificationCentre_BannerWrapper button:not(.stdButton), 
.csdkNotificationCentre_BannerWrapper button:not(.close) 
{
	opacity: 100;
	position: relative;
	margin-left: 56px;
	bottom: unset;
	box-shadow: none;
	margin-top: 5px;
	border: var(--border-lightgray);
	padding: 5px 15px;
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	background: var(--main-background-white);
}
#coral7 .csdkNotificationCentre_BannerWrapper button.stdButton,
.csdkNotificationCentre_BannerWrapper button.stdButton
{
	opacity:0;
	border: var(--border-lightgray);
	padding: 5px 7px;
	border-radius: var(--borderRadiusMedium);
	color: var(--color-text-link);
	background: var(--main-background-white);
	font-size: 12px;
	padding: 4px 20px;
	position: absolute;
	bottom: 8px;
	box-shadow: -6px -6px 4px var(--mainBackground);
	right: 10px;
}
#coral7 .csdkNotificationCentre_BannerWrapper:hover button.stdButton,
.csdkNotificationCentre_BannerWrapper:hover button.stdButton
{
	opacity:100;
        transition: opacity 0.2s ease-in;
}
 
.csdkNotificationCentre_BannerWrapper .text
{
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	white-space: pre-wrap;
}
.csdkNotificationCentre_BannerWrapper .heading
{
	font-weight: bold;
	font-size: 14px;
	padding: 0px 0 4px 0;
}
.csdkNotificationCentre_BannerWrapper .csdkCell > .rightCell
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.csdkNotificationCentre_BannerWrapper .recievedTime
{
	color: #595959;
	text-align:right;
	font-size:10px;
	line-height:24px;
	flex-basis:24px;
	padding-right:5px;
}
.csdkNotificationCentre_BannerWrapper img
{
	width: 40px;
	flex-grow:1;
}
.csdkNotificationCentre_BannerWrapper .heading + img
{
	right:55px;
	bottom: 10px;
}
#coral7 .csdkNotificationCentre_BannerWrapper button.close,
.csdkNotificationCentre_BannerWrapper button.close
{
	opacity:0;
	position: absolute;
	top: -8px;
	left: -5px;
	background: url(/images/close.svg) no-repeat center,var(--mainBackground);
	background-size: 10px;
	width: 25px;
	height: 25px;
	border: var(--border-lightgray);
	border-radius: 100%;
	box-shadow: 2px 2px 3px #0000001a;
	margin-left:unset;
	padding:unset;
}
#coral7 .csdkNotificationCentre_BannerWrapper:hover button.close,
.csdkNotificationCentre_BannerWrapper:hover button.close
{
	opacity:100;
	transition: opacity 0.2s ease-in;
}
.csdkNotificationCentre_BannerWrapper .title
{
	font-weight: bold;
}

.csdkNotificationCentre_BannerWrapper.closed
{
	max-height: 0px;
	overflow: hidden;
}
.csdkNotificationCentre_BannerWrapper.closing
{
	translate: 420px;
}
.csdkNotificationCentre_BannerWrapper .extra
{
	font-size: 12px;
	white-space: pre-wrap;
	margin-top: 5px;
	padding: 5px 7px;
}
.csdkNotificationCentre_BannerWrapper select.extra,
.csdkNotificationCentre_BannerWrapper button.extra
{
	width: auto;
}
.csdkNotificationCentre_BannerWrapper div.extra
{
        width:calc(100% - 14px);                                                                                                                                            
        text-align:left;
}
.csdkNotificationCentre_BannerWrapper
{
	position:relative;
	color: #000;
	background-color: #fff;
	transition: translate 0.3s ease-in,max-height 0.2s ease-out;
	z-index: 10000;
	padding: 12px;
	border-radius: 5px;
	max-height: 500px;
	box-shadow: 4px 4px 4px #0000002e;
	margin-top:6px;
	width:380px;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
#coral7 .csdkNotificationCentre_BannerWrapper
{
	color: var(--colorTextDefault);
	background-color: var(--mainBackground);
	box-shadow: 4px 4px 4px #00070d42;
	border: var(--border-lightgray);
}
#coral7 .csdkNotificationCentre_BannerWrapper select
{
	width: fit-content;
	min-width: 80px;
}
#coral7 .csdkNotificationCentre_BannerWrapper .recievedTime
{
	color: var(--colorTextSubBasic);
}


/** Dirbrowser Toggle under search **/

 .csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div.toggledFilters
{
    display: flex;
    margin-left: 20px;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div.toggledFilters .csdkInput
{
    margin: 0;
    display: flex;
    background: no-repeat;
    border: 0;
    width: auto;
    align-items: center;
    margin-right: 10px;
}

.csdkDirBrowser.hasToggledFilters > .csdkTable.Root .csdkHeader 
{
    flex-direction: column;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div input[type="checkbox"]
{
     margin:0px;
     width: 35px;
     background-color: var(--color-text-link) !important;
     background-image: none !important;
     border-radius: 2rem;
     border: 0px !important;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div input[type="checkbox"].off
{
    background-color: rgb(204, 204, 204) !important;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div.toggledFilters
{
    display: flex;
    justify-content: flex-end;
    margin-right: 10px;
}


.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div.toggledFilters .csdkInputLabel, 
{
    display: inline-flex;
    background: none;
    color: var(--colorTextDefault) !important;
    width: auto;
    border: 0;
    margin: auto;
    align-items: center;
    margin-right: 5px;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div input[type="checkbox"]::before 
{
    content: ' ';
    width: 13px;
    background: white;
    height: 13px;
    left:18px;
    transition: 0.1s all;
    top:2px;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div input[type="checkbox"]:checked::before 
{
    left:3px;
}

.csdkDirBrowser.hasToggledFilters .csdkHeader .csdkCell div input[name="Search"] {
    margin-bottom: 2px;
}

.csdkSlider
{
	position: relative;
	background-color: #ddd;
	border-radius: 4px;
	margin: 12px;
	cursor: pointer;
}

.csdkSlider.horizontal
{
	max-width: calc(100% - 24px);
	height: 8px;
	border-left: 2px solid #ddd;
    border-right: 2px solid #ddd;
}

.csdkSlider.vertical
{
	max-height: calc(100% - 24px);
	width: 8px;
	border-top: 2px solid #ddd;
    border-bottom: 2px solid #ddd;
}

.csdkSlider.horizontal.hasTicks
{
	margin-bottom: 30px;
}

.csdkSlider.vertical.hasTicks
{
	margin-right: 30px;
}

.csdkSlider .csdkSliderTrack
{
	position: absolute;
	background-color: #007bff;
	border-radius: 4px;
}

.csdkSlider.horizontal .csdkSliderTrack
{
	height: 100%;
	left: -2px;
	padding-right: 2px;
}

.csdkSlider.vertical .csdkSliderTrack
{
	width: 100%;
	bottom: -2px;
	padding-top: 2px;
}

.csdkSlider .csdkSliderThumb
{
	width: 16px;
	height: 16px;
	position: absolute;
	background-color: #007bff;
	border-radius: 50%;
}

.csdkSlider.horizontal .csdkSliderThumb
{
	top: 50%;
	transform: translateY(-50%);
}

.csdkSlider.vertical .csdkSliderThumb
{
	left: 50%;
	transform: translateX(-50%);
}

.csdkSlider .csdkSliderTick
{
	position: absolute;
	background-color: #ccc;
}

.csdkSlider.horizontal .csdkSliderTick
{
	width: 2px;
	height: 8px;
	top: 25px;
	left: 10px;
	transform: translateY(-50%);
}

.csdkSlider.vertical .csdkSliderTick
{
	height: 2px;
	width: 8px;
	left: 25px;
	transform: translateX(-50%);
}


/**** Right Click Menu  ****/

.csdkContextMenu {
        position: absolute;
        display: none;
        background-color: #fff;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
        border-radius: 4px;
        padding: 1px;
        z-index: 1000;
}       
        
.csdkContextMenu.visible {
        display: block;
        border: 1px solid #33333326;
}       
        
.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuItem {
        padding: 1px 8px;
        cursor: pointer;
        transition: background-color 0.3s;
        background-color: transparent;
        font-size: 0.82rem;
        margin: 5px;
        border-radius: 0.25rem;
}

.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuItem:hover {
        background-color: #f0f0f0;
}       

.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuGroup {
        /* padding: 1px 7px; */
        cursor: pointer;
        transition: background-color 0.3s;
        font-size: 0.82rem;
        margin: 5px;
        border-top: 1px solid #e4e4e4;
}
        
.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuGroup .csdkContextMenuItem {
        display: none;
        position: absolute;
        padding: 1px 5px;
}

.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuGroup:hover .csdkContextMenuItem {
        display: block;
        position: relative;
}

.csdkContextMenu .csdkContextMenuRoot .csdkContextMenuGroup label {
    margin-top: 2px;
    padding: 4px 18px 0px 8px;
    background-size: 8px;
    background-position: calc(100% - 7px) 1px;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.8.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 8 28.7' style='enable-background:new 0 0 8 28.7;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23A7A9AC;%7D%0A%3C/style%3E%3Cg id='Layer_2_00000056423579281917925100000006529858739238952868_'%3E%3Cg id='Layer_1-2'%3E%3Cpolygon class='st0' points='3.8,15 7.8,10.5 -0.2,10.5 '/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
    display: block;
    font-size: 0.7rem;
    font-weight: bold;
    line-height: 1.2rem;
    color: #bbb;
}


/**** Right Click Menu END ****/


/*****************************/
/**** alert PopUp Overlay ****/
/*****************************/
.coralModalOverlay
{
	position: absolute;
	width: 100vw;
	height: 100vh;
	z-index: 10000;
	top: 0;
	left: 0;
	justify-content: center;
	align-items: center;
	font-size: 14px;
	display: flex;
	background: rgba(0, 0, 0, 0.4);
}
.coralModalOverlay .coralModalWindow
{
	background: var(--mainBackground);
	box-shadow: var(--boxShadowLight);
	border: var(--border-lightgray);
	border-radius: var(--borderRadiusLarge);
	margin-top: -30px;
	padding: 24px 32px;
}


/** JSON EDITOR  ***/


.csdkCell.ValueInput button.button.jsonEditableBtn,
button.button.jsonEditableBtn,
button.button.jsonEditableBtn
{
   border: 0;
   font-size: 0;
   min-width: 25px;
   height: 25px;
   background-repeat: no-repeat;
   background-position: center;
   background-size: 55%;
   border-radius: 0.25rem;
   opacity:0;
   transition:0.5s all;
   display:none;
   background-image: url(/images/editW.svg);
   background-color: var(--color-text-link);
   position: relative;
   left: -4px;
   border-radius: 50%;
   background-size: 12px;
}

.csdkCell.ValueInput:hover button.button.jsonEditableBtn,
.csdkCell:hover button.button.jsonEditableBtn
{
	display:block;
}

.csdkCell.ValueInput.invalidJson button.button.jsonEditableBtn,
button.button.jsonEditableBtn, button.button.jsonEditableBtn
{
    opacity:1;
}

.csdkCell.ValueInput.invalidJson button.button.jsonEditableBtn
{
	/* filter: hue-rotate(167deg) brightness(1.8); */
}

.csdkCell.ValueInput.validJson button.button.jsonEditableBtn,
button.button.jsonEditableBtn
{
    opacity:1;
    pointer-events:all;
}

.csdkCell.ValueInput.validJson button.button.jsonEditableBtn:hover,
button.button.jsonEditableBtn:hover
{
    opacity:0.7;
}




/**** jsonEditor Modal ****/

div#coral_AlertPopUpDiv.jsonEditorModal {
    height: 600px;
    width: 800px;
}

div#coral_AlertPopUpDiv.jsonEditorModal iframe
{
    border: 0;
    height: 750px;
}

div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_Expansion
{
    padding: 0 !important;
    height: 5;
    !i;!;
    margin: 0;
    border: 0;
    width: 100% !important;!I;!;
}

div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_ButtonRow
{
    border:0;
    position: absolute;
    right: 0px;
    top: 2px;
    width: 75px;
    padding: 0;
}

div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_ButtonRow button.exitButton
{
    border-radius: 50% !important;
    font-size: 0 !important;
    width: 20px;
    height: 20px;
    padding: 0 !important;
    min-width: 15px;
    border: 0 !important;
    filter: grayscale(1);
    opacity: 0.7;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' class='fa-icon svelte-1mc5hvj' width='12' height='16' aria-label='' role='presentation' viewBox='0 0 384 512' style=''%3E%3Cpath d='M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z'%3E%3C/path%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
}

.csdkDialog.jsonEditorModal .showQuery_ButtonRow button.fullScreenButton {
    position: absolute;
    right: 20px;
    top: 0;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.8.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_2_00000163064529737831871080000010813691818607052680_' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 13.5 13' style='enable-background:new 0 0 13.5 13;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23434244;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;%7D%0A%3C/style%3E%3Cg id='Layer_1-2_00000092419429153460521360000005358778599523130770_'%3E%3Cg id='Layer_2-2_00000072965160327376973490000006888329293086765719_'%3E%3Cg id='Layer_1-2'%3E%3Cg id='Layer_2-2'%3E%3Cg id='Layer_1-2-2'%3E%3Cline class='st0' x1='6.6' y1='6.6' x2='11.7' y2='1.5'/%3E%3Cpolyline class='st0' points='11.7,5 11.7,1.5 8.2,1.5 '/%3E%3C/g%3E%3C/g%3E%3Cpath class='st0' d='M4.5,1.5H3.8c-1.2,0-2.2,1-2.2,2.2l0,0v5.8c0,1.2,1,2.2,2.2,2.2h5.8c1.2,0,2.2-1,2.2-2.2V8.6'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A") !important;
    background-repeat: no-repeat !important;
    filter: grayscale(1) contrast(12.8);
    font-size: 0 !important;
    width: 20px;
    height: 17px;
    padding: 0 !important;
    min-width: 0;
    background-size: 16px !important;
}

div#coral_AlertPopUpDiv div.jse-navigation-bar 
{
    height: 35px;
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper .jse-menu,
.jse-header.svelte-1y24war.svelte-1y24war,
.jse-main .jse-menu
{
    padding: 1px 8px;
	border: 1px solid #d7d7d7;
}

button.jse-button.jse-group-button.jse-selected.svelte-pf7s2l 
{
    color: var(--colorTextBrand);
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper button.jse-button.jse-group-button.svelte-pf7s2l:last-child 
{
    border-radius: 0.15rem;
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper .jse-menu.svelte-pf7s2l .jse-button.jse-group-button.svelte-pf7s2l:not(.jse-last),
.jse-menu.svelte-pf7s2l .jse-button.jse-group-button:not(.jse-last)
{
    margin-left: 0;
    font-size: 12px;
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper .jse-menu button,
.jse-menu button
{
    cursor: pointer;
    transition:0.2s all;
    cursor:pointer;
    border: 0;
    margin-left: 0;
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper  .jse-menu.svelte-pf7s2l .jse-button.jse-group-button.jse-selected.svelte-pf7s2l,
.jse-menu .jse-button.jse-group-button
{
     border-radius: 0.25rem !important;
}

div#coral_AlertPopUpDiv div.jsonEditorWrapper  .jse-contents {
    border-bottom: 0;
}

div#coral_AlertPopUpDiv.jsonEditorModal .jse-main {
    width: 100%;
    height: 100%;
}

div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_Expansion .jsonEditorWrapper ,
div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_Expansion
{
    height: 560px;
    width: 800px;
}

div#coral_AlertPopUpDiv.EditWarningModal .showQueryTableCellTextTitle {
    border: 0;
}

div#coral_AlertPopUpDiv.EditWarningModal .showQuery_Expansion
{
    border: 0 !important;
    padding: 0 !important;
    text-align: center;
    width: 80% !important;
}

div#coral_AlertPopUpDiv.EditWarningModal span.showQueryTableCellTextTitleSpan 
{
	padding-top: 80px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.9 4.9'%3E%3Cdefs%3E%3Cstyle%3E.cls-1,.cls-2%7Bfill:%23be1e2d;%7D.cls-2%7Bstroke:%23be1e2d;stroke-miterlimit:10;stroke-width:0.13px;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3EAsset 4%3C/title%3E%3Cg id='Layer_2' data-name='Layer 2'%3E%3Cg id='Layer_1-2' data-name='Layer 1'%3E%3Cpath class='cls-1' d='M2.45.3A2.15,2.15,0,1,1,.3,2.45,2.15,2.15,0,0,1,2.45.3m0-.3A2.45,2.45,0,1,0,4.9,2.45,2.45,2.45,0,0,0,2.45,0Z'/%3E%3Cpath class='cls-2' d='M2.29,3.6a.06.06,0,0,1,0-.06l.09,0H2.5l.09,0a.14.14,0,0,1,0,.09v.09a.19.19,0,0,1,0,.08.06.06,0,0,1-.06,0H2.36a0,0,0,0,1,0,0,.19.19,0,0,1,0-.08Zm0-2.45a.07.07,0,0,1,.08-.08h.13s.07,0,.07.08V3s0,.08-.07.08H2.39c-.06,0-.08,0-.08-.08Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-size: 35px !important;
	background-position: center 30px !important;	
}

div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow
{
    text-align: center;
}

div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow button
{
    width:30%;
}

div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow button.jsonButton,
div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow button.textButton,
div#coral_AlertPopUpDiv.TextEditorModal button.saveAndExitButton
{
    background: var(--color-text-link) !important;
    color: white !important;
    border-color: var(--color-text-link) !important;
}

div#coral_AlertPopUpDiv.TextEditorModal span..showQueryTableCellTextTitleSpan
{
    border: 0;
}

div#coral_AlertPopUpDiv.TextEditorModal .showQuery_Expansion
{
    border: 0 !important;
    padding-bottom: 0px !important;

}

div#coral_AlertPopUpDiv.TextEditorModal .showQuery_Expansion textarea.bareTextEditor
{
    width: calc(100% - 20px);
    height: 80px;
    resize: vertical;
    white-space: break-spaces;
    font-family: monospace;
    font-size: 12px;
    line-height: 1rem;
    background: #f2f2f2;
    padding: 10px;
}

div#coral_AlertPopUpDiv.TextEditorModal
{
    width: 500px;
}

div#coral_AlertPopUpDiv.TextEditorModal .showQueryTableCellText span.showQueryTableCellTextTitleSpan
{
    justify-content: flex-start;
    display: flex;
    padding: 12px 0 0 25px;
    font-size: 13px;
    width: calc(100% - 40px);
    height: fit-content;
    color: #999999 !important;
}

div#coral_AlertPopUpDiv.jsonEditorModal.fullScreenModal {
    position: fixed !important;
    left: -1px !important;
    top:  -1px !important;
    width: calc(100vw - 22px) !important;
    height: calc(100vh - 7px) !important;
    border-radius:0;
    overflow:hidden ;
      
}

div#coral_AlertPopUpDiv.jsonEditorModal.fullScreenModal .showQuery_Expansion .jsonEditorWrapper, 
div#coral_AlertPopUpDiv.jsonEditorModal.fullScreenModal .showQuery_Expansion {
    width: calc(100vw - 22px) !important;
    height: calc(100vh - 7px) !important;
}

div#coral_AlertPopUpDiv.jsonEditorModal.fullScreenModal  .showQuery_ButtonRow button.fullScreenButton
{
   transform: rotate(180deg);
}


/** JSON EDITOR Variable ***/

.jsonEditorWrapper,
.jse-main,
.jse-absolute-popup-content
{
	--jse-theme-color: #f3f3f3;    
	--jse-theme-color-highlight: #545454;
	--jse-font-size: 12px;    
	--jse-font-size-mono: 12px;
	--jse-context-menu-background: #ffffff;
	--jse-context-menu-separator-color:#d3d3d3;
	--jse-context-menu-tip-background:#eef5fc;
	--context-menu-tip-color:#545454;
	--jse-context-menu-color:#545454;
	--jse-text-color-inverse:#545454;
	--jse-context-menu-background-highlight:#eef5fc;
	--jse-edit-outline: 1px solid #d7d7d7;
	--jse-theme-color-highlight:#eef5fc;

	--colorTextBrand: #1589ee;
	--color-text-link: #006dcc;
	--colorBorder: #dddbda;
	--toolTip: #16325c;
	--colorBackground: #f3f2f2;
	--color-background-selection: #d8edff;
	--jse-context-menu-pointer-background:white;
	--jse-selection-background-inactive-color:white;
	--jse-context-menu-pointer-hover-background:#d0cfcf;
	--jse-context-menu-background:white;
	--jse-button-primary-background:#006dcc;
	--jse-button-primary-background-highlight: #005fb2;
	--message-success-background:#efffdc;
		--jse-message-success-color:#2ead2e;
}

.jsonEditorWrapper button:disabled,
.jse-main button:disabled,
.jse-absolute-popup-content button:disabled
{
	pointer-events: none;
}


.jse-actions button {
    display: flex;
    align-items: center;
    gap: 10px;
}


div#coral_AlertPopUpDiv button:disabled
{
	background:#96969614;
}

div#coral_AlertPopUpDiv button:disabled svg.fa-icon.svelte-1mc5hvj path
{
	color:#888;
}

svg.fa-icon.svelte-1mc5hvj path {
    color: #656565;
}

button.jse-context-menu-button.svelte-1idfykj {
    display: flex;
    align-items: center;
}

button.jse-context-menu-button.svelte-1idfykj svg
{
    width: 12px;
    margin-right:10px;
}

.jse-menu.svelte-pf7s2l button svg {
    width: 14px;
    height: 14px;
}
.jsonEditorWrapper {
    border-top: 1px solid #ddd8d8;
}

button.jse-context-menu-button svg {
    width: 12px;
    height: 12px;
    margin-right:3px;
}

button.jse-expand svg.fa-icon.svelte-1mc5hvj path, button.jse-collapse svg.fa-icon.svelte-1mc5hvj path {
    color: #cecece;
}

.jse-tip svg.fa-icon.svelte-1mc5hvj path 
{
	color:var(--colorTextBrand);
}


.jse-menu.svelte-pf7s2l .jse-button.jse-group-button.svelte-pf7s2l {
    border: 0;
}

div#coral_AlertPopUpDiv .jse-modal-inner .jse-header .jse-title {
    font-size: 20px;
    padding: 20px 0 0px 15px;
}

.jse-modal-inner .jse-header {
    height: 50px;
}

div#coral_AlertPopUpDiv .jse-modal-inner.svelte-1s9c2ql, .jse-header.svelte-1y24war.svelte-1y24war {
    background: white;
}

.svelte-select.svelte-82qwg8.svelte-82qwg8.svelte-82qwg8 {
    height: 32px;
}

div#coral_AlertPopUpDiv.jsonEditorModal  dialog.jse-modal .jse-header,
dialog.jse-modal .jse-header
{
    background: white;
    border: 0;
}

.jse-key {
    color: #575757 !important;}

.jse-group-button {
    border: 0 !important;
    margin-left: 0 !important;
}


/** JSON EDITOR END ***/

/*** CORAL7 CSDK  ***/


#coral7 div#coral_AlertPopUpDiv.jsonEditorModal 
{
    min-width: 802px;
    padding: 0;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .showQueryTableCellTextTitle 
{
    height: 35px;
    display: flex;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal span.showQueryTableCellTextTitleSpan 
{
    margin-left: 15px;
    width: 100px;
    margin-top: 7px;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_ButtonRow {
    background-color:transparent;
    padding: 0;
    width: 50px;
    display: flex;
    align-items: center;
    height: 32px;
    flex-direction: row-reverse;
    margin-right: 5px;
    justify-content: space-around;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_ButtonRow button
{
    border:0;
    padding: 0;
    min-width: 15px;
    width: auto;
    display: block;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button {
    margin: 0 0 0 0;
    background-color: transparent;
    display: flex;
    align-items: center;
    /* justify-content: center; */
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button:hover
{
    background-color:transparent!important;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal div.jsonEditorWrapper .jse-menu, 
#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-header.svelte-1y24war.svelte-1y24war, 
#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-main .jse-menu
{
    border:0;
    display: flex;
    align-items: center;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button.fullScreenButton {
    position:relative;
    border-radius: 0;
    right: auto;
    left: auto;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button.exitButton {
    background-position:center;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal div.jsonEditorWrapper .jse-menu button,
#coral7 div#coral_AlertPopUpDiv.jsonEditorModal div.jsonEditorWrapper .jse-menu button:hover
{
    color:#333;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal div.jsonEditorWrapper .jse-menu button.jse-selected,
#coral7 div#coral_AlertPopUpDiv.jsonEditorModal div.jsonEditorWrapper .jse-menu button.jse-selected:hover
{
    background: #696969 !important;
    color:white;
}

div#coral_AlertPopUpDiv.jsonEditorModal .showQuery_Expansion .jsonEditorWrapper {
    width: auto;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button svg {
    /* width: 55px; */
    display: flex;
    align-items: center;
    justify-content: center;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal button.jse-context-menu-pointer {
    padding:0;
    justify-content: center;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-contextmenu[role="menu"] button {
    border: 0;
    box-shadow: unset;
    padding: 10px;
    color: #333;
}


#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-contextmenu[role="menu"] button:disabled
{
    background:#efefef;
    opacity:0.5
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-contextmenu[role="menu"] button.jse-open-dropdown {
    padding: 5px;
}

#coral7 div#coral_AlertPopUpDiv.jsonEditorModal .jse-dropdown-items svg
{
    width:12px;
    height:12px;
    margin-right:10px;
}

/** popup for json editor  ***/

#coral7 div#coral_AlertPopUpDiv.EditWarningModal {
    padding: 0 !important;
}

#coral7  div#coral_AlertPopUpDiv.EditWarningModal span.showQueryTableCellTextTitleSpan {
    padding-top: 80px;
}

#coral7  div#coral_AlertPopUpDiv.EditWarningModal .showQuery_Expansion  .editContent {
     text-align:center;
     width:100%;
     padding-bottom: 20px;
     font-family: sans-serif;
     font-weight: normal;
}

#coral7  div#coral_AlertPopUpDiv.EditWarningModal  .showQuery_Expansion {
    text-align:center;
    width:100%;
    display: unset;
    margin-bottom: 10px;
}

#coral7 div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow button {
    width: calc(33% - 20px);
    display: inline-flex;
    text-align:center;
    justify-content:center;
    margin-top: 0;
}

#coral7 div#coral_AlertPopUpDiv.EditWarningModal .showQuery_ButtonRow {
    text-align:center;
}


/**** CORAL7 CSDK ends here  ****/





/*** bubbles ***/

li.csdkBubble {
    list-style: none;
    position: relative;
    margin: 20px 0;
}

li.csdkBubble .LeftSpeechBubble,
li.csdkBubble .RightSpeechBubble
{
    max-width: 90%;
    display: inline-flex;
    flex-direction: column-reverse;
    justify-content: flex-end;
}

li.csdkBubble .commandSpeechBubble .Icon
{
    background-image: url(/images/CSDKIMAGES/icon_CalendarCheck_W.svg);
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    position: absolute;
    top: 22px;
    left: 20px;
    background-color: #f1cc41;
    background-size: 18px;
    width: 25px;
    height: 25px;
    display: none;
}

li.csdkBubble .LeftSpeechBubble
{
    padding-left: 40px;
}

li.csdkBubble .systemSpeechBubble 
{
    display:flex;
    align-items:center;
    justify-content: center;
}

li.csdkBubble .systemSpeechBubble .Bubble,
li.csdkBubble .systemSpeechBubble .Header span
{
 padding:0;
    font-size:11px;
    background-color:transparent;
    line-height:normal;
    border:0px;
    margin:0;
    font-size:13px;
    /* opacity: 1; */
    color: #6e6a6d;
}

li.csdkBubble .systemSpeechBubble .Bubble
{
    margin-left: 10px;
    /* color: #6e6a6d; */
}

li.csdkBubble .systemSpeechBubble .Icon
{
    color: transparent;
    background-image: url(/images/CSDKIMAGES/icon_NotificationBell_W.svg);
    background-position: center center;
    width: 23px;
    position: relative;
    right: -5px;
    font-size: 0;
    background-repeat:no-repeat;
    background-size: 13px;
    margin-right: 8px;
    transform: rotate(20deg);
    background-color: #b8b8b8;
    height: 23px;
}

li.csdkBubble .RightSpeechBubble
{
    padding-right: 40px;
    float: right;
}

li.csdkBubble .Icon
{
    position:absolute;
    left:0;
    width: 34px;
    height: 34px;
    background: #e7f2f8;
    border-radius: 50%;
    text-align: center;
    text-align: center;
    line-height: 34px;
    font-weight: bold;
    color: #006dcc;
    font-family: sans-serif;
    font-size: 13px;
}

li.csdkBubble .RightSpeechBubble .Icon
{
    left:auto;
    right:0;
}

li.csdkBubble .Bubble
 {
    padding: 7px 14px;
    background: #efefef73;
    border-radius: 0.5rem;
    display: inline;
    font-size: 14px;
    line-height: 1.1rem;
    border: 1px solid #efefef;
}

li.csdkBubble .RightSpeechBubble .Bubble
{
    background:#e7f2f8;

}

li.csdkBubble .RightSpeechBubble .Icon
{
    background: #006dcc;
    color:white;
}

li.csdkBubble .RightSpeechBubble .Header {
    text-align: right;
}

li.csdkBubble .Header span 
{
    font-family: sans-serif;
    font-weight: bold;
    opacity: 0.5;
    margin-top: 3px;
    display: inline-block;
}

li.csdkBubble .Header span.ChatDate
{
    margin-left: 5px;
}

li.csdkBubble .commandSpeechBubble {
    background: #ffffff;
    padding: 15px 20px;
    border-radius: 10px;
    border: 1px dashed #cdb1ffcf;
    filter: drop-shadow(3px 3px 4px #efe6ff);
}

li.csdkBubble .commandSpeechBubble .Header
{
    background-color: #ba94ff;
    background-repeat:no-repeat;
    padding: 0 10px 2px 30px;
    opacity: 1;
    top: 5px;
    margin-bottom: 20px;
    border-radius: 0.25rem;
    display: inline-block;
    margin-top: 3px;
    background-image: url(/images/CSDKIMAGES/icon_CalendarCheck_W.svg);
    background-size: 16px;
    background-position: 7px 3px;
    display: inline-flex;
    align-items: center;
}

li.csdkBubble .commandSpeechBubble input
{
    border:0;
    padding: 8px 13px;
    border-radius: 0.25rem;
    width: calc(100% - 26px);
    margin-bottom: 5px;
    background: #d4d4d41c;
}

li.csdkBubble .commandSpeechBubble .Bubble
{
    background: no-repeat;
    border:none;
}

li.csdkBubble .commandSpeechBubble .Header span.UserName 
{
    color: red;
}

li.csdkBubble .commandSpeechBubble .Header span.UserName 
{
    color: white!important;
    opacity: 1;
    font-size: 13px;
    line-height: 1.1rem;
    align-items: center;
    display: inline-flex;
}

li.csdkBubble .commandSpeechBubble .Header span.ChatDate {
    color: white !important;
    opacity: 1;
}

li.csdkBubble .commandSpeechBubble .Bubble .csdkInput.nameInput {
    display: inline-block;
    width: 100%;
}

li.csdkBubble .commandSpeechBubble .Bubble  .csdkInputLabel {
    font-size: 12px;
    opacity: 0.5;
}

li.csdkBubble .commandSpeechBubble .Bubble .csdkRow {
    gap: 20px;
}

li.csdkBubble button.closeScript 
{
    background-image: url(/images/CSDKIMAGES/icon_Close_G.svg);
    background-color: transparent;
    background-size: 15px;
    background-repeat: no-repeat;
    border:0;
    font-size: 0;
    width: 25px;
    height: 25px;
    background-color: white;
    border-radius: 50%;
    background-position: center;
    border: 1px solid #cbcbcb;
    display: none;
    position: absolute;
    right: 0;
    top: 5px;
}

li.csdkBubble button.closeScript:hover
{
    opacity:0.5;
}

li.csdkBubble .commandSpeechBubble + button.closeScript {
    position: absolute;
    top: -8px;
    right: -8px;
    z-index: 1000;
}

li.csdkBubble:hover button.closeScript
{
    display:block;
}

li.csdkBubble .RightSpeechBubble + button.closeScript 
{
    left: 0;
    right: auto;
}

li.csdkBubble .RightSpeechBubble + button.closeScript 
{
    left: 0;
    right: auto;
}
/************************************************/
/**************CSDKPOPOUTMENU style**************/
/************************************************/
.csdkPopOutMenu div.csdkPopOutBoxContent 
{
	width:100px;
}
.csdkPopOutMenu div.csdkPopOutBoxContent .addCondition .csdkDirBrowser .csdkTableBody .csdkCell:first-child
{
	display:none;
}
.csdkPopOutMenu div.csdkPopOutBoxContent .csdkDirBrowser .csdkTableBody .csdkRow 
{
	padding:4px 16px;
	width:calc(100% - 32px);
	cursor:pointer;
}
.csdkPopOutMenu div.csdkPopOutBoxContent .addItem .csdkDirBrowser .csdkTableBody .csdkRow 
{
	padding:8px 8px;
}
.csdkPopOutMenu div.csdkPopOutBoxContent .csdkDirBrowser .csdkTableBody .csdkRow:hover 
{
	background-color: var(--color-background-selection);
}
.csdkPopOutMenu div.csdkPopOutBoxContent .csdkDirBrowser > .csdkTable .csdkTableBody
{
} 
.csdkPopOutMenu div.csdkPopOutBoxContent .csdkDirBrowser > .csdkTable
{
	margin:0;
}
.csdkPopOutMenu div.csdkPopOutBoxContent .csdkDirBrowser
{
	resize:none;
	border:none;
	width:100%;
	font-size:12px;
	color: var(--brandAccessibleActive);
}
.csdkPopOutMenu div.csdkPopOutBoxContent button.close
{
	position:absolute;
	top: -7px;
	right: -7px;
	color: transparent;
	border: var(--border-lightgray);
	background: url(/images/csdkimages/icon_Close_B.svg) center no-repeat, var(--main-background-white);
	border-radius: 50%;
	background-size: 13px;
}
.csdkPopOutMenu div.csdkPopOutBoxContent 
{
	margin-left:-15px;
	margin-top:-3px;
	padding:0;
	border-radius: 4px;
}
.csdkPopOutMenu div.csdkPopOutBoxContent:before
{
	display:none;
}
.csdkPopOutMenu div.csdkPopOutBoxContent > .content
{
	position:relative;
}
.csdkPopOutMenu
{

}


/****************************************************************************************************\
	MATT WAS HERE
\****************************************************************************************************/
/* Wrapper */
.csdkFilterListWrapper
{
	position: relative;
	display: inline-block;
	min-width: 220px;
	padding: 6px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
}

.csdkFilterListWrapper.active
{
	border-color: #999;
	background: #fff;
}

/* Input */
.csdkFilterListWrapper .inputText
{
	width: 100%;
	box-sizing: border-box;
	padding: 6px 28px 6px 8px;
	border: 1px solid #ccc;
	border-radius: 4px;
	outline: none;
	font-size: 14px;
}

.csdkFilterListWrapper .inputText.invalid {
	border-color: red;
}

/* Add button */
.csdkFilterListWrapper .addBtn {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 20px;
	height: 20px;
	line-height: 18px;
	text-align: center;
	border: 1px solid #999;
	border-radius: 50%;
	background: white;
	cursor: pointer;
	display: none;
	font-weight: bold;
}


/* Menu row */
.csdkFilterListPopout .csdkPopOutBoxContent {
	background: transparent !important;
	padding: 0;
	min-width: 200px;
	margin-top: -1px !important;
	filter: none;
}
.csdkFilterListPopout .csdkPopOutBoxContent:before {
	display:none;
}
.csdkFilterListPopout .csdkRow.row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 6px 8px;
	border-radius: 4px;
	cursor: pointer;
	transition: background 0.2s ease;
}

.csdkFilterListPopout .csdkRow.row:hover {
	background: #f5f5f5;
}

/* Row label */
.csdkFilterListPopout .csdkRow .rowLabel {
	flex: 1;
	user-select: none;
}

/* Remove button */
.csdkFilterListPopout .csdkRow .removeBtn 
{
	cursor: pointer;
	width: 20px;
	height: 20px;
	visibility: hidden;
	background: url(/images/CSDKIMAGES/icon_TrashBin_B.svg) no-repeat center, transparent;
	background-size: 15px;
	border:none;
	color:transparent;
}

.csdkFilterListPopout .csdkRow.row:hover .removeBtn {
	visibility: visible;
}

/* PopOutBox container (optional hook) */
.csdkFilterListPopout {}

/* Menu inside popout (no absolute positioning needed now) */
.csdkFilterListPopout .menu {
	max-height: 220px;
	overflow-y: auto;
	border: 1px solid #ddd;
	border-radius: 6px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
	background: white;
	padding: 4px;
	display: block; /* popout controls visibility; this is just base style */
}

/* Hide rows on filter */
.csdkFilterListPopout .csdkRow.row.hidden { display: none; }
.csdkFilterListPopout .csdkRow 
{
	width:calc(100% - 16px);
	font-size:13px;
}

.csdkFilterListPopout .csdkRow .csdkCell:last-child
{
	position:absolute;
	right:10px;
}
/* Active row highlight (keyboard/mouse) */
.csdkFilterListPopout .csdkRow.row.active {
	background: #e9f3ff;
	outline: 1px solid #bcdcff;
}

/* Red border when no exact match */
.csdkFilterListWrapper .inputText.invalid,
.csdkFilterListWrapper .inputText[aria-invalid="true"] {
	border-color: #e11900 ;
	box-shadow: 0 0 0 2px rgba(225, 25, 0, 0.08);
}