﻿@charset "utf-8";
/* CSS Document */

/* ORDER MATTERS!
  Put the more generic classes first, and the most specific ones last
  Unless you want a generic class at the end because it should override the previous ones.
*/



/* this makes the webdatagrid lose too much space on the right in small devices 
tr,th,td {
	padding-right:10px;
}
		*/

/* These styles affect all element-specific styles throughout the site */

a {
	color: #3d5b8a; /*CSB4 Change all links to dark blue*/
}


i {
	/* If we force a color here then we cannot go back to the default behavior that changes it based on the default button color and the hover effect.
		Customers should put this rule in their custom.css file
		You might need to set the color for this class as well: wi_loginview_welcomeuser_dropdown
	*/
	/*color: #3d5b8a;*/ /*CSB4 Change all icons to dark blue*/
}

h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #ff7c00;
	/*
		padding-bottom: 20px;
		*/
}

h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #ff7c00;
	padding-top: 10px;
	padding-bottom: 10px;
}

h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #ff7c00;
	padding-top: 3px;
	padding-bottom: 3px;
}

li {
	margin-bottom: -3px;
}

/* USING MORE SPECIFIC CLASS NAMES FOR LISTS AND ITEMS */


/* Without this there was no space between each form control, they were stacking. */
/* This seems to be fixed in new bootstrap version 
.row {
	padding: 5px 0px 5px 0px;
}
*/

/* input groups were stacking on top of each other without this */
.input-group {
	/* Had to remove it because AccountUpdates.aspx otherwise has a white space at the bottom of each control on the row
		If you need to add it back, please qualify it so it does not break AccountUpdates.aspx
		padding-bottom: 10px;
		*/
}

/* dynamic drop down menu. make dropdown same size as form. */
.dropdown-menu.show {
	width: 100%;
}

ol, ul {
	list-style: none;
}

/*background color for menu items*/
.static .selected {
	background-color: #3d5b8a;
	color: white;
}

/*Must use important to overwrite inline styles of width: auto*/
#Master_L1_LeftMenuPanelCell {
	width: 100% !important;
}

.captcha_showhide {
	display: none;
}

/* BEGIN HYPERLINK STYLES */
/* Default link style: Affects all links (<a href>) that do not have a class assigned */
/*a:link {	text-decoration: underline;	color: #3d5b8a;	}*/
a:any-link {
	text-decoration: none !important;
}

a:visited {
	text-decoration: none !important;
	color: #3d5b8a;
}

a:hover {
	text-decoration: none !important;
}

a:active {
	text-decoration: none !important;
}

/*a.buttonmenuitem:hover {	text-decoration: none !important;	 }
a.buttonmenuitem:active {	text-decoration: none !important;	 } 
a.buttonmenuitem:link {	text-decoration: none !important;	 }
a.buttonmenuitem:visited {	text-decoration: none !important;	 } 

a.buttonhovermenuitem:hover {	text-decoration: none !important;	 }
a.buttonhovermenuitem:active {	text-decoration: none !important;	 } 
a.buttonhovermenuitem:link {	text-decoration: none !important;	 }
a.buttonhovermenuitem:visited {	text-decoration: none !important;	 }*/


/* Footer link styles: This is used within the footer.html file */
/*a:link.FooterLink {		text-decoration: none;	color: #fff; }
a:visited.FooterLink {	text-decoration: none;	color: #fff; }
a:hover.FooterLink {	text-decoration: underline;	color: #fff; }
a:active.FooterLink {	text-decoration: underline;	color: #fff; }*/

/* button link styles */
/*a:link.btn {		text-decoration: initial;	color: initial; border: 1px solid; border-color: initial;}
a:visited.btn {	text-decoration: initial;	color: initial; border: 1px solid; border-color: initial;}
a:hover.btn {	text-decoration: initial;	color: initial; border: 1px solid; border-color: initial;}
a:active.btn {	text-decoration: initial;	color: initial; border: 1px solid; border-color: initial;}*/


/* END HYPERLINK STYLES */

/* This is to align currency and other types in the DynamicGridWithSQL */
.RIGHTALIGN {
	text-align: right !important;
}

.LEFTALIGN {
	text-align: left !important;
}

.CENTERALIGN {
	text-align: center !important;
}

tbody > tr > td.RAlign {
	text-align: right !important;
}

tbody > tr > td.LAlign {
	text-align: left !important;
}

tbody > tr > td.CAlign {
	text-align: center !important;
}


.btn:disabled,
.btn[disabled] {
	border: 1px solid #999999;
	background-color: #e0e0e0;
	opacity: 0.5 !important;
}

.checkbox {
	width: 100%;
	margin: 0px;
	font-weight: 500;
}

.dropdown-menu .active a label {
	color: white;
	width: 100%;
}


.form-group {
	/*float: left;*/
	margin: 0px;
}

#example_keypad {
	width: 100px;
	margin-bottom: 20px;
}

/* ****************** WI SPECIFIC CLASSES BELOW ******************** */
.wi_help_button {
	border: 2px white solid;
	float: right;
}

.wi_help_button_div {
	/* With this the help div is shorter than the context div when the context needs two lines
		margin: auto;
		*/
}

.wi_help_button i {
	color: white;
}

.wi_criteria_date_picker tbody tr td[id*="CellLabel"] {
	float: right;
	padding-top: 10px;
	padding-right: 10px;
}

.wi_chatsignedin {
	background-color: green;
	color: white;
}


/*Only options my profile and log out dont require that much space*/
#LoginViewText div ul {
	width: 100px;
}



/*CHAT APPLICATION STYLES*/
.wi_closechatsession {
	border-radius: 5px;
	background-color: firebrick;
	color: white;
}

.wi_downloadchatsession {
	border-radius: 5px;
}

.wi_register_button {
	color: #fff !important;
}

#wi_button_queues {
	text-align: center;
}

#wi_questions {
	vertical-align: top;
}

.wi_chat_queue_online {
	background-color: #008000;
	color: white;
	margin: 20px;
	padding: 10px;
	border: solid white 2px;
	border-radius: 10px;
}

.wi_chat_queue_offline {
	background-color: #B22222;
	color: white;
	margin: 20px;
	padding: 10px;
	border: solid white 2px;
	border-radius: 10px;
}

#wi_companyName {
	display: none;
}

#wi_send-container {
	display: flex;
	padding: 0px;
}

#wi_textInput {
	width: 85%;
	height: 40px;
}

#wi_btnSend {
	height: 40px;
	border-radius: 0 .25rem .25rem 0;
	display: block;
}

.wi_btn_disabled {
	border: 1px solid #999999;
	background-color: #cccccc;
	color: #666666;
}

.wi_messagesent {
	position: relative;
	background-color: cornflowerblue;
	height: auto !important;
	max-width: 80%;
	color: white;
	font: message-box;
	float: right;
	margin-bottom: 10px !important;
	margin-left: auto;
	width: auto;
	overflow-wrap: break-word;
}

	.wi_messagesent:after {
		content: '';
		position: absolute;
		border-style: solid;
		border-width: 18px 0 0px 14px;
		border-color: transparent cornflowerblue;
		display: block;
		width: 0;
		z-index: 0;
		right: -12px;
		top: 26px;
	}

.wi_messagereceived {
	position: relative;
	width: auto;
	background-color: dimgray;
	height: auto !important;
	max-width: 80%;
	color: white;
	font: message-box;
	float: left;
	margin-left: 25px;
	margin-bottom: 10px !important;
	margin-right: auto;
	overflow-wrap: break-word;
}

	.wi_messagereceived:after {
		content: '';
		position: absolute;
		border-style: solid;
		border-width: 0px 14px 18px 0px;
		border-color: transparent dimgray;
		display: block;
		width: 0;
		z-index: 0;
		left: -12px;
		top: 8px;
	}

.wi_typing-indicator {
	margin-top: 10px;
	background-color: #E6E7ED;
	width: auto;
	height: 30px;
	border-radius: 50px;
	padding: 10px;
	display: none;
	position: absolute;
	-webkit-animation: 2s bulge infinite ease-out;
	animation: 2s bulge infinite ease-out;
	bottom: 60px;
	left: 10px;
}

	.wi_typing-indicator:before, .wi_typing-indicator:after {
		content: '';
		position: absolute;
		bottom: -2px;
		left: -2px;
		height: 20px;
		width: 20px;
		border-radius: 50%;
		background-color: #E6E7ED;
	}

	.wi_typing-indicator:after {
		height: 10px;
		width: 10px;
		left: -10px;
		bottom: -10px;
	}

	.wi_typing-indicator span {
		height: 10px;
		width: 10px;
		float: left;
		margin: 0 1px;
		background-color: #9E9EA1;
		display: block;
		border-radius: 50%;
		opacity: 0.4;
	}

		.wi_typing-indicator span:nth-of-type(1) {
			-webkit-animation: 1s blink infinite 0.3333s;
			animation: 1s blink infinite 0.3333s;
		}

		.wi_typing-indicator span:nth-of-type(2) {
			-webkit-animation: 1s blink infinite 0.6666s;
			animation: 1s blink infinite 0.6666s;
		}

		.wi_typing-indicator span:nth-of-type(3) {
			-webkit-animation: 1s blink infinite 0.9999s;
			animation: 1s blink infinite 0.9999s;
		}

@-webkit-keyframes blink {
	50% {
		opacity: 1;
	}
}

@keyframes blink {
	50% {
		opacity: 1;
	}
}

@-webkit-keyframes bulge {
	50% {
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
	}
}

@keyframes bulge {
	50% {
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
	}
}

/* to make more compact the chat button inside the panel */
.wi_chat_button > span {
	padding-right: 5px;
	cursor: pointer;
}

/* to make chat buttons the same size, 130px to support spanish */
.wi_chat_queue_online, .wi_chat_queue_offline {
	flex: 0 0 130px;
}

/* to restore chat center join/end session buttons' border */
.wi_chat_end, .wi_chat_join, .wi_chat_view {
	border: 2px solid;
	border-radius: 5px;
	padding: 3px;
	display: inline-block;
}

.wi_chat_end {
	border-color: firebrick;
	color: firebrick;
}

.wi_chat_join {
	border-color: green;
	color: green;
}

.wi_chat_view {
	border-color: darkblue;
	color: darkblue;
}

.wi_chat_messenger {
	height: 100%;
}

	.wi_chat_messenger body {
		height: 100%;
		min-width: 356px;
		background: #fff;
		font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
		padding: 8px;
	}

	.wi_chat_messenger #header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		column-gap: 10px;
		height: 44px;
		width: 100%;
		border-bottom: 1px solid rgb(206, 212, 218);
		padding-bottom: 1px;
	}

		.wi_chat_messenger #header button {
			border-width: 1px;
			white-space: nowrap;
			height: 30px;
		}

	.wi_chat_messenger #wi_message-container {
		height: calc(100% - 87px); /* 100$ - (header + input-group height) */
		width: 100%;
		overflow-y: auto;
	}

	.wi_chat_messenger .input-group {
		padding-top: 3px;
	}

	.wi_chat_messenger .wi_chat_row {
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
	}

	.wi_chat_messenger .wi_buttons {
		display: flex;
		column-gap: 3px;
	}

	.wi_chat_messenger #welcome {
		height: 100%;
		overflow-y: hidden;
	}

/* Hides command buttons' column titles */
.wi_chat_grid_available_sessions th[key="CSCommand1"], .wi_chat_grid_available_sessions th[key="CSCommand2"], .wi_chat_grid_available_sessions th[key="CSCommand3"],
.wi_chat_grid_sessions_inprogress th[key="CSCommand1"], .wi_chat_grid_sessions_inprogress th[key="CSCommand2"], .wi_chat_grid_sessions_inprogress th[key="CSCommand3"] {
	font-size: 0;
}

/* chat auth dialog */
#authDlg .modal-body .wi_chat_input_row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	gap: 0.5em;
}

.wi_chat_errmsg {
	color: darkred;
}

.wi_chat_msgtext {
	font-weight: bold;
}

/*END OF CHAT APPLICATION STYLES*/
.wi_enroll_signup_header:after {
	content: 'Sign Up for Your New Account';
}


.wi_boxeditable-zip {
	width: 110px;
}

.wi_boxeditable-state {
	width: 90px;
}

.wi_boxeditable-city {
	width: 100px;
	margin-left: 15px;
}

.wi_boxeditable-first {
	width: 130px;
}

.wi_boxeditable-last {
	width: 140px;
}

.wi_monthresize {
	width: 175px !important;
}

.wi_yearresize {
	margin-left: -10px;
}

.wi_phoneresize {
	width: 100% !important;
	margin-bottom: 5px;
}

.wi_filepadding input {
	padding: 3px;
	width: 300px;
}

.wi_errorlist {
	color: #a94442 !important;
	font-weight: bold;
	list-style-type: none;
	text-align: left;
	padding: 5px;
}

	.wi_errorlist li {
		/*
		background: none;
		*/
		background-image: none !important;
	}

.wi_mobileradio {
	display: none;
}

.wi_bankaccinfo {
	display: flex;
}



/* NEW STYLES*/
.wi_footermargin {
	margin-top: 25px;
	margin-bottom: 25px;
	margin-right: 25px;
}
/*CSB4 Repositions the footer*/

.wi_menuname, .wi_prevlogin {
	color: #3d5b8a;
	font-size: 14px;
	margin-right: 10px; /*welcome, user label */
	display: inline-block;
}

.wi_prevlogin {
	font-size: 10px;
	margin-right: 0px;
}

.btn.dropdown-toggle.wi_loginview_welcomeuser_dropdown {
	padding-left: 2px;
	padding-right: 2px;
}


/*CSB4 Fixes size and color of user's name in navbar*/
#wi_envelope {
	color: #3d5b8a;
	margin: 5px;
}
/*CSB4 Sets icon color and position*/

.wi_grid {
	/* on large devices, which are usually not touchscreen, limit the height of dynamic grids to 1000px so the horizontal scrollbar does not end up miles below */
	max-height: 700px;
}

/* 992px and more causes the menu to be on the left instead of up*/
@media only screen and (max-width: 991px) {
	/* override height of dynamic grid for medium devices since those are touchscreen and can be scrolled horizontally (so the horizontal scrollbar can be miles below and it doesn't matter) */
	.wi_grid {
		max-height: 100000px;
	}
}

/* Small Devices And Tablets */
@media only screen and (max-width: 360px) {
	/* override height of dynamic grid for very small devices since those are touchscreen and can be scrolled horizontally (so the horizontal scrollbar can be miles below and it doesn't matter) */
	.wi_grid {
		max-height: 100000px;
	}
}

p {
	padding-top: 10px;
	padding-bottom: 10px;
}

/* End Element-specific styles */


/* BEGIN FORM INPUT STYLES */
/* These styles affect the form elements, such as text fields, checkboxes, radio buttons, etc.  */
input {
	border: 1px solid #bfd2fb;
	background-color: #f6f6f6;
}

	input[type=checkbox] {
		border: none;
		background-color: #f6f6f6;
	}

	input[type=radio] {
		border: none;
		/*Issue # 28633 - Remove gray background from Radio Button choices.  In some browsers the radio buttons show a gray background around which does not look very nice.
	This background color draws a box around the radio button and does not look very nice.  Removing */
		/*background-color: #f6f6f6;*/
		background-color: Transparent;
		margin-right: 10px; /*CSB4 Position radio buttons in "make a payment tab" */
	}

select {
	border: 1px solid #bfd2fb;
	background-color: #f6f6f6;
}

textfield {
	border: 1px solid #bfd2fb;
	background-color: #f6f6f6;
}

/* END FORM INPUT STYLES */


/* Other CreditSoft CSS Styles */

/* BEGIN INPUT BUTTON STYLES (form buttons) */

/* Shortcut class so that we can style the div outside the button when using a DQ button and setting the DQ Question Answer CSS Class */
.wi_button_div input {
	background: /*orange*/ #F8983B; /*url(imagesV2/button_normal_new.png) 0 0 no-repeat*/
	color: #fff;
	padding: 5px;
	border: none !important;
	border-radius: 5px;
	margin: 5px;
	/* deleted width, so larger text would not get truncated */
	min-width: 95px;
}

/* All of the Buttons displayed in the application inherit this class. When the caption of a button needs to be too long the ButtonMedium or ButtonLong classes can be used */
.wi_button {
	background: /*orange - ADA compliance, made the orange darker for increased contrast*/ #f37700; /*url(imagesV2/button_normal_new.png) 0 0 no-repeat*/
	color: #fff;
	padding: 5px;
	border: none !important;
	border-radius: 5px;
	margin: 5px;
	/* deleted width, so larger text would not get truncated */
	min-width: 95px;
}

/*Use this class when using large modals with multiple form fields and title */
.wi_modal-header {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: start;
	align-items: center;
	-ms-flex-pack: justify;
	padding: 1rem 1rem;
	border-bottom: 1px solid #dee2e6;
	border-top-left-radius: 0.3rem;
	border-top-right-radius: 0.3rem;
}

.wi_modal-header .close {
	padding: 1rem 1rem;
}

/* Same as .wi_button but very long */
.wi_buttonlong {
	background: /*orange*/ #F8983B; 
	color: #fff;
	padding: 5px;
	border: none !important;
	border-radius: 5px;
	margin: 5px;
	/* deleted width, so larger text would not get truncated */
	min-width: 250px;
}

/* Same as .wi_button but longer */
.wi_buttonmedium {
	background: /*orange*/ #F8983B; 
	color: #fff;
	padding: 5px;
	border: none !important;
	border-radius: 5px;
	margin: 5px;
	/* deleted width, so larger text would not get truncated */
	min-width: 140px;
	margin-bottom: 15px;
}

/* Div that encloses the navigation buttons.  By default taking 100% width of its parent element */
.wi_navigationbuttons {
	background-color: #FFF ;
	/*lightestblue #eef3fb */
	/*position:relative;
    height:auto;*/
	padding: 10px 10px 10px 10px;
	width: 100%;
}

/* END INPUT BUTTON STYLES (form buttons) */


/* --- BEGIN NAVIGATION MENU FORMAT AND STYLES --- */

.wi_menunamedisplayhtml {
}

/* This is the optional icon to the right of the menu item text */
.wi_menunamedisplayhtml_right {
	display: flex;
	justify-content: flex-end;
}

	.wi_menunamedisplayhtml_right .fas {
		padding-left: 5px; /* So an icon on the right of the text has a little space before it */
		/* These are to center the icon vertically */
		margin-top: auto;
		margin-bottom: auto;
	}

.wi_top_orange .wi_menunamedisplayhtml {
	display: inline-flex; /* This tries to keep the text and icon in one line. Good for the top. */
	color: white;
	font-weight: bold;
	padding-left: 10px;
}

	.wi_top_orange .wi_menunamedisplayhtml .fas {
		padding-right: 10px;
		color: white;
	}


.wi_header_progressbox_row .col {
	border-style: none;
	padding: 10px;
	text-align: center;
	background-color: #ffefeb;
	z-index: 10;
	border-radius: 10px;
	margin: 5px;
	cursor: pointer;
}

	.wi_header_progressbox_row .col .completed_icon {
		/* Using position absolute so we can also put it at the bottom (not just on the right)
			float: right;*/
		font-size: x-large;
		color: seagreen;
		position: absolute;
		bottom: 5px;
		right: 5px;
	}

	.wi_header_progressbox_row .col .completed_div {
		display: inline;
		float: right;
	}

	.wi_header_progressbox_row .col .completed_text {
		/*
			display:none;
			display: inline;
			*/
		display: initial; /* This reserves the space so the title of the progress box does not overlap the green checkmark */
		color: seagreen;
		font-weight: bold;
		padding: 4px;
	}

	.wi_header_progressbox_row .col.arrow {
		padding: 0px;
		margin: -20px;
		margin-top: auto;
		margin-bottom: auto;
		z-index: 0;
		cursor: default;
	}


	.wi_header_progressbox_row .col.selected {
		background-color: white;
		border: #3d5b8a;
		border-style: solid;
		border-radius: 5px;
		border-width: 2px;
	}

	.wi_header_progressbox_row .col.completed, .wi_header_progressbox_row .col.arrow.completed.selected {
		background-color: #b8ffb8;
	}

	.wi_header_progressbox_row .col.arrow.selected {
		background-color: white;
		border: none;
	}

	.wi_motivationalmessage {
		display: block;
		text-align: center;
	}

/* END MENU NAVIGATION FORMAT AND STYLES */
/*.btn {
font-weight: normal;
}
 
.btn:focus, .btn:active:focus, .btn.active:focus {
    font-weight: bold;
}
 
.btn-primary {
    font-weight: normal;
}
 
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    font-weight: bold;
}
 
.btn-primary:active, .btn-primary.active {
	font-weight: bold;
}*/

.wi_center_content {
	position: relative;
	
}


/* Orange Rounded Corners */

.wi_top_orange {
	/* If you actually specify width 100% it will not cover the whole width.
	width:100%;
		*/
	/*
		height:30px;
		*/
	display: flex; /*makes continue signing button and label display in a straight line */
	padding: 5px;
	background: /*orange*/ #F8983B ;
}

.wi_top_orange_left {
	/* make it a bit more compact by removing display block
		display:block;
		*/
	/*
		position:absolute;
		*/
	margin-left: 0px;
	/*
		height:20px;
		*/
	background: /*orange*/ #F8983B ;
	/* The remaining properties position and style the text that resides on the orange header bar */
	/*
		padding-top: 10px;
	padding-left: 20px;
		*/
	/*
			font-size: 10px; 
		*/
	font-weight: bold;
	color: #fff;
}

.wi_top_orange_right {
	display: block;
	background-color: /*orange*/ #F8983B;
	padding: 5px;
	/*
	float: right;
	position: relative;
	text-align:right;
	width: 100px; 
	height: 30px;
	padding-top:11px;
	padding-right:11px;
	*/
}

.wi_top_orange_help {
	margin-top: 5px;
	float: right;
	position: relative;
	text-align: right;
	padding-top: 29px;
	padding-right: 38px;
	z-index: 1;
	background: url(imagesV2/Help.png) no-repeat top right;
}
/* Orange Rounded Corners */


.wi_boxeditable {
	/*border: solid 1px #bfd2fb;*/
	/* this prevents dynamic screen fields from becoming huge on large displays
		if you need a comments multiline field use a different class
	*/
	min-width: 90px;
	max-width: 300px;
	/*width: 300px;*/
}

.wi_boxeditable_small {
	/*a version used for small numbers such as number of months or monthly payment amount
	*/
	max-width: 100px;
}

.wi_textbox {
	min-width: 150px; /* this is so it looks good on custom DQ page layouts when there are multiple columns per dq, so the field does not get completely squished. You can overwrite it if you want in the custom.css */
}

.wi_fg_csd {
	display: inline-flex; /* this is so that the asterisk error shows to the right of the control instead of on a new line below */
	min-width: 150px;
}

.wi_fg_csdt {
	display: inline-flex; /* this is so that the asterisk error shows to the right of the control instead of on a new line below */
}

.wi_fg_csc {
	min-width: 150px; /* this is so it looks good on custom DQ page layouts when there are multiple columns per dq, so the field does not get completely squished. You can overwrite it if you want in the custom.css */
}

.wi_fg_csc_textbox {
	border-radius: 0px 5px 5px 0px !important;
}

/* UserControls_Percentage - Validator error message below control */
.wi_display_next {
	clear: both;
	display: flex;
	float: left;
	align-content: center;
	flex-wrap: wrap;
	flex-direction: row;
	margin-left: 3px;
}

/* UserControls_Percentage */
.wi_percent_append_right {
	border-radius: 0px 5px 5px 0px !important;
	width: 35px;
	padding-left: 10px;
	padding-right: 10px;
	clear:right;
}

/* UserControls_Percentage */
.wi_fg_csc_textbox_right {
	border-radius: 5px 0px 0px 5px !important;
}

/* Currency Form Control */
.wi_fc_currency {
	min-width: 100px;
	/* this one is inside a form group so the radius is determined by the position in the group 
		border-radius: 0px;*/
}
/* Percentage Form Control */
.wi_fc_percent {
	min-width: 75px;
}
/* Date Form Control */
.wi_fc_date {
	min-width: 97px;
	height: auto;
}
/* CS Date Input Group*/
.wi_ig_csd {
	max-width: 155px;
	margin-bottom: 0px !important;
}
/* CS Currency Input Group*/
.wi_ig_csc {
	max-width: 150px;
}

/* CS SSN Input Group*/
.wi_ig_ssn {
	max-width: 170px; /* needs 20 extra pixels (150+20) for the overwrite/undo button when encrypted */
}

/* CS DateTime Input Group*/
.wi_ig_csdt {
	max-width: 300px;
	margin-bottom: 0px !important;
	display: inline-flex;
}

/* bank account dropdown */
.wi_dropdown_ba {
	max-width: 350px;
}
/* credit card dropdown */
.wi_dropdown_cc {
	max-width: 350px;
}

/* BEGIN TEXT STYLES */
.wi_errormessagesmall {
	font-size: 11px;
	color: #a94442 !important;
	font-weight: bold;
}

.wi_errormessagebutton {
	font-size: 11px;
	color: #a94442 !important;
	font-weight: bold;
	padding-top: 15px;
	padding-left: 10px;
}

@media only screen and (max-width:750px) {
	.wi_errormessagebutton {
		font-size: 11px;
		color: #a94442 !important;
		font-weight: bold;
		padding-top: 0px;
		padding-left: 15px;
	}
}

.wi_errormessage {
	color: #a94442 !important;
}


.wi_errorasterisk {
	font-size: 25px;
	color: #a94442 !important;
}

.wi_justtext {
	font-size: 12px
}

.wi_justboldtextsmall {
	font-weight: bold;
	font-size: 10px
}

.wi_justboldtext {
	font-weight: bold;
}


a.wi_justboldtextsmall {
	font-weight: bold;
	font-size: 10px
}

.wi_notification {
	/*font-size: 12px;*/
	color: orange;
	font-weight: bold;
}

.wi_mobilebuttonsummary {
	font-weight: bold;
	/*font-size: 11px;*/
}

.wi_mobilebuttonrowcount {
	font-weight: bold;
	font-size: 16px;
}

.wi_mobilebuttondescription {
	font-style: italic;
	font-size: 11px;
}


/* END TEXT STYLES */


.wi_pager {
	text-align: right;
	border: 0px;
	margin: 2px;
	padding: 2px;
}

	.wi_pager span {
		padding-left: 5px;
		padding-right: 5px;
		font-weight: bold;
		/* font-size: large; */
		border: 1px solid;
		border-radius: 5px;
		text-align: center;
	}

	.wi_pager a {
		padding-left: 5px;
		padding-right: 5px;
	}

	.wi_pager td table {
		/*width: 100%;
    max-width: 500px;*/
	}

		.wi_pager td table tbody tr td {
			min-width: 30px;
			max-width: 60px;
		}

.wi_pagetitles {
	font-weight: bold;
	color: #FF7C00;
	font-size: 13px;
	text-align: left;
	background-color: #fff;
	line-height: 35px;
}

/* Tables and other lists layout */
/* wi_ig_ are infragistics webdatagrid */

.wi_body_savedsearch_savedsearch .table-striped tbody tr:nth-of-type(odd),
.wi_body_savedsearch_savedsearch_advanced .wi_ig_tablerowalt > td:not(.igg_SelectedCell),
.wi_body_savedsearch_savedsearch_advanced tbody.igg_Item > tr > td,
.wi_body_dynamicdata_dynamicmastergrid tbody.igg_Item > tr > td,
.wi_body_dynamicdata_dynamicmastergrid .wi_ig_tablerowalt > td:not(.igg_SelectedCell)
.wi_body_dynamicdata_dynamicmastergrid_advanced .wi_ig_tablerowalt > td:not(.igg_SelectedCell),
.wi_body_dynamicdata_dynamicmastergrid_advanced tbody.igg_Item > tr > td,
.wi_body_client_dynamicaccounts .table-striped tbody tr:nth-of-type(odd) {
	background-color: transparent !important; /*Avoid infragistics styles overwriting wi_ig_tablerow*/
}

	/* wi_ are datagridview */
	.wi_ig_table {
	font: Verdana, Arial, Helvetica, sans-serif 10px normal;
	background-color: #FFFFFF;
	text-align: center;
	vertical-align: top;
	/*border:solid 1px #DEE4EF;*/
}

.wi_ig_tablerow {
	font: Verdana, Arial, Helvetica, sans-serif 10px normal;
	color: #000000;
	background-color: #FFFFFF !important; 
	text-align: left;
	vertical-align: middle;
	/* cleaner this way
		border: 1px solid #eaeaea;
		*/
	/*height: 22px;*/
}


.wi_ig_tablerowalt {
	font: Verdana, Arial, Helvetica, sans-serif 10px normal;
	background-color: #EFEFEF !important;
	text-align: left;
	vertical-align: middle;
	/* cleaner this way
	border: 1px solid #E3e3e3;
		*/
	height: 22px;
}

.wi_ig_tablerow > td:not(.igg_SelectedCell) {
	background-color: #FFFFFF !important; /*Need to bump up priority because ig_datagrid.css gets loaded by infragistics at runtime as the last*/
}

	.wi_ig_tablerowalt > td:not(.igg_SelectedCell) {
		background-color: #EFEFEF !important; /*Need to bump up priority because ig_datagrid.css gets loaded by infragistics at runtime as the last*/
	}

.wi_ig_tableheader {
	font: Verdana, Arial, Helvetica, sans-serif bolder 10px;
	color: #000;
	/*	background: #B0B0B0 center top;*/
	background: #e8e8e8 center top;
	/*
this can be used if you don't want a background
    border-bottom: black;
    border-bottom-style: solid;
    border-bottom-width: 1px;
*/
	text-align: center;
	vertical-align: middle;
	/* this looks ugly text-transform: uppercase ;*/
	padding: 2px;
}

.wi_ig_tablesubheader {
	font: Verdana, Arial, Helvetica, sans-serif bolder 10px;
	color: #000;
	background: #CECECE center top;
	text-align: left;
	vertical-align: middle;
	text-transform: none;
	padding: 2px
}

.wi_ig_tablerowselected {
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	background-color: #ABC0E7;
}

/*.wi_ig_tablerow:hover {
	border: 1px solid red !important;
}*/

.wi_hide_gridCell {
	display: none;
}

.wi_table {
	font: Verdana, Arial, Helvetica, sans-serif 10px normal;
	background-color: #FFFFFF;
	/*text-align: center;*/
	vertical-align: top;
	/*border:solid 1px #DEE4EF;*/
}


.wi_tableheader {
	/* so the header is slightly darker than the alternate rows*/
	background-color: #e8e8e8 !important;
}

.wi_tablesubheader {
	color: #000;
	background: #CECECE center top;
	text-align: left;
	vertical-align: middle;
}

.wi_tablerowselected {
	font-weight: bold;
}

/* BEGIN FOOTER STYLES AND FORMATTING */

.wi_ig_tablefooter {
	margin-top: 0px;
	margin-left: 11px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000;
	text-align: right;
	text-transform: uppercase;
	width: 100%;
	height: 31px;
	/*	background-color:#C4C4C4;*/
	background-color: #d1d1d1;
}

.wi_tablefooter {
	font-weight: bold;
}

/* BEGIN FOOTER STYLES AND FORMATTING */



.RowEditTemplate {
	font-size: 12px;
	border: solid 2px #6684B3;
	background-color: White;
	position: fixed;
	top: 40%;
	left: 40%;
}

#dialogueChooseCreditor.wi_dialogue {
	position: fixed !important;
	top: 20%;
	left: 40%;
	width: 500px;
	height: 600px;
}

/* Div element that encloses the Navigation Menus. Font size and font color for the title of the menus. */
.wi_menupanel {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	vertical-align: middle;
	width: 100%;
	color: #91A7CA;
}

/* BEGIN FORM STYLES */

@media only screen and (max-width:750px) {

	.wi_mobileradio_inline {
		display: inline-block;
		float: left;
	}

	.wi_mobileradio_width {
		width: 188px;
	}
}

.wi_formtableheader {
	font-weight: bold;
	color: #FF7C00;
	padding-left: 5px;

}


	.wi_formtableheader label {
		padding-right: 5px; /*for the Activate checkbox*/
	}

.wi_radiobuttonlist tbody tr td input {
	margin-left: 20px;
}

.wi_radiobuttonlistalt tbody tr td input {
	margin-left: 15px;
	font-size: 10px;
	font-weight: normal;
}

/* Affects style for the entire table that contains form labels and fields */
.wi_formtable {
	padding: 3px !important;
}

/* Affects style for left column on form that contains labels (i.e. First Name, Last Name, etc.) -   */
.wi_formcolumn {
	font-size: 11px;
	font-weight: bold;
	text-align: right;
	color: #7A95BF;
	padding: 2px !important;
	width: 200px;
}

/* Affects styles for form fiels column (cells that contain input fields on right) */
.wi_formcolumnalt {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-align: left;
	vertical-align: middle;
	padding: 2px !important;
}


/* This is for the DQ form control. ADA compliance rules will use it as the control associated to the label with class wi_formcontrollabel in wi_dq_questionwrapper */
.wi_formcontrol {
	/* No styles defined, but needed for ADA */
}


/* This is for the DQ form control labels. ADA compliance rules will use it as the label of the control with class wi_formcontrol in wi_dq_questionwrapper */
.wi_formcontrollabel {
	/* font-size: 11px; */
	font-weight: bold;
	color: #2e6da4; /* Increasing contrast for ADA compliance. Made it a darker blue. */
	min-width: 120px; /* prevent the label from being too narrow and hard to read */
	/* text-align: left; this is the default, no need to override */
}

.wi_formcontrollabelcheckbox {
	vertical-align: top;
}

.wi_formcontrollabelrequired {
	/* font-size: 11px; */
	font-weight: bold;
	color: #3d5b8a;
	text-align: left;
}

.wi_formcontrolcheckbox {
	/* make the checkbox a little big bigger (too small by default) */
	height: 16px;
	width: 16px;
	margin-left: 10px;
	/*fixes overlap of label and radio buttons in mobile view*/
	position: relative !important;
	margin-top: 0px;
}


.wi_password_show_hide {
	position:relative  
}

	.wi_password_show_hide .input-control{
		padding: 6px 12px;
	}

	.wi_password_show_hide .input-control:focus {
		border: 1px solid;
	}

.wi_password_show_hide .wi_password_show{
	position: absolute;
	top:12px;
	right:18px;
	cursor:pointer;
	padding-right:4px;
}


/* month day year dropdowns*/
.wi_month_dd {
	max-width: 170px;
}

.wi_day_dd {
	max-width: 90px;
}

.wi_year_dd {
	max-width: 85px;
}

/* END FORM STYLES */

.wi_issueButtons {
	float: left;
}

.DetailsView {
	width: 100%;
	padding: 10px !important;
}

.wi_detailsview_table {
	/* this adds too much spacing. but without it the fields shrink too much */
	/* to fix once I am back at the office 
		width:100%;	 
	 */
	/* after removing the tr padding which affected all the tables, I am adding this to just space out controls in the details view */
	border-collapse: separate;
	border-spacing: 3px 3px;
	width: 100%; /*Client information on bankaccountschedules is */
}
/* to fix once I am back at the office 
.wi_detailsview_table tbody tr td {
	display: inline-flex;
}
	*/
.wi_formview_table {
	margin-top: 20px;
}

/* Encloses the content of the _Message.ascx control.  This control is used to provide some warning messages in the application. */
div.wi_message {
	font: Verdana, Arial, Helvetica, sans-serif 10px bold;
	color: #D56D08;
	text-align: left;
	vertical-align: middle;
	height: 38px;
	position: relative;
	padding: 2px 1px 10px 42px;
	background: url(imagesV2/warning.png) no-repeat;
	display: table-cell;
}

/* Affects the style of some of the warning message displayed in the application.  For Example: Duplicates found. */
.wi_warning {
	font: Verdana, Arial, Helvetica, sans-serif 10px bold;
	padding: 2px 1px 1px 5px;
	color: #D56D08;
	text-align: left;
	vertical-align: middle;
}

.wi_warning_form {
	font-size: 14px;
	/*font-weight: bold;*/
	color: white;
	text-align: center;
	vertical-align: middle;
	background-color: lightgrey;
	border-radius: 4px;
	padding: 5px;
}

.wi_message {
	font-size: 14px;
	/*font-weight: bold;*/
	color: white;
	text-align: center;
	vertical-align: middle;
	background-color: lightgrey;
	border-radius: 4px;
	padding: 5px;
}

.wi_body_error_default .wi_message {
	font-size: 18px;
	background-color: grey;
}

.wi_return_home_btn a {
	color: white !important;
	padding: 5px;
	text-align: center;
}

/* Used in _DynamicLayout.ascx at the top to warn about required fields */
.wi_dq_errors {
	background-color: red;
	color: white;
	font-weight: bold;
	border-radius: 7px;
}

/* Sets the look of the "welcome back" label for a uncompleted/saved DQForm on the web */
.wi_dq_welcome_back {
	font-size: 14px;
	/*font-weight: bold;*/
	color: white;
	text-align: center;
	vertical-align: middle;
	background-color: gray;
	border-radius: 4px;
	padding: 5px;
}

/* Sets background color for required questions that have not been answered. Used in the DQForm on the web for unanswered questions that are required */
.wi_unanswered_required,
.wi_ctrl_generic_search.wi_unanswered_required .wi_ctrl_generic_search_input,
.wi_ctrl_read_only_async.wi_unanswered_required .wi_ctrl_read_only_async_content_container,
.wi_ctrl_dob.wi_unanswered_required select {
	background-color: lightsalmon;
}

.wi_dq_checkbox_alignleft span .wi_unanswered_required {
	position: relative;
	top: -6px;
	left: -1px;
}

.wi_unanswered_required tbody tr td {
	padding-right: 10px;
}

.wi_radiobuttonlist.wi_unanswered_required, .wi_formcontrolcheckbox.wi_unanswered_required {
	border-radius: 5px;
	padding: 3px;
}

/*.wi_dq_required_question {
	background-color: lightsalmon;
}*/

/* Sets CSS properties for controls for required questions. Used in the DQForm on the web for questions that are required */
.wi_dq_required_question::after {
}

/* Sets CSS properties for labels for required questions. Used in the DQForm on the web for questions that are required */
.wi_dq_required_question_label::after {
	content: " *";
	color: red;
}

.wi_formview_row {
	display: flex;
}

div.wi_viewduplicates {
	text-align: right !important;
}

.wi_dayofmonth {
	display: inline-flex;
	max-width: 30px;
	/*font-size: 10px; 
  background-color: #FFF;
  border: thin solid black;
    */
	margin-left: 5px;
	padding: 3px;
}

.wi_overlay {
	position: fixed;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: Gray;
	filter: alpha(opacity=40);
	opacity: 0.4;

	left: 0px;
	top: 0px;
	
	/* Set both opacity and filter, for MSIE and firefox compatability */
	/*
		opacity: .7;
	filter: alpha(opacity=70);
	*/
	/* z-index sets the layer order, so that the overlay rests on top.
	Bear in mind that the popup dialogue needs to be even higher! */
	z-index: 1000 !important;
}

.wi_dialogue {
	padding: 5px;
	border: solid 2px #6684B3;
	background-color: #FFF;
	z-index: 2000;
	text-align: center;
	position: fixed !important;
}

.wi_collapsiblepanel {
	height: 0px;
	overflow: hidden;
	/*
	min-width:460px;
		*/
}

.wi_processingpopup {
	position: fixed;
	top: 40%;
	left: 30%;
	right: 30%;
	/*
    width:300px;
    height:50px;
    text-align:center;
    background-color:White;
    border:solid 3px black;
			*/
	/*
	padding: 20px;

	position:absolute;
		*/
	/*
	top: expression(((ignoreMe = document.documentElement.scrollTop? document.documentElement.scrollTop : document.body.scrollTop) + 200) + 'px');
	left: expression(((ignoreMe2 = document.documentElement.scrollLeft? document.documentElement.scrollLeft : document.body.scrollLeft) + 200) + 'px');
	*/
	/*	width: 300px; 
	
	height: 60px;
		*/
	/*
		border:solid 2px #6684B3;
		*/
	border-radius: 5px;
	background-color: #FFFFFF;
	text-align: center;
	z-index: 2000;
}

.wi_processingpopupimage {
	width: 100%;
	padding: 10px;
	max-width: 400px; /*Otherwise it looks weird and grainy on very big screens*/
}

.wi_processingpopuplabel {
}




.wi_togglebuttongroup {
	padding-bottom: 5px;
}

.wi_navtabs {
	margin-bottom: 10px;
	width: 100%;
}
/*
	Not used anymore - Using bootstrap tooltip instead
	.Popup {
	position:absolute; left:100; top:-80; 
    border-style:solid;
    border-width:4;
    border-color:blue;
	background-color:white;
	padding: 5px;
	color: red;
	font: Verdana, Arial, Helvetica, sans-serif 10pt bold;
	z-index:2;
	visibility:hidden;
	width: 200px;
	text-align: left; 
	vertical-align: middle; 
	float:left;
	}*/

.wi_labelwithtooltip {
	border-bottom: 1px dotted #000;
	cursor: pointer;
}

.wi_savingmessage {
	font: Verdana, Arial, Helvetica, sans-serif bold 10px;
	padding: 2px 1px 1px 5px;
	background-color: #DEE4EF;
	border: solid 1px lightgrey;
	text-align: left;
	vertical-align: middle;
}

.wi_paymentschedulereport {
	/* removing width so that the report is responsive 
	width: 600px; 
		*/
	/* leaving height because it's ok to make the web page longer */
	height: 450px;
	/* if we put this it breaks the csdatechooser because it goes OVER the button and the java click does not reach it
		position: relative; 
		*/
	vertical-align: top;
}

.wi_paymentcalculatorreport {
	/* removing width so that the report is responsive 
	width: 600px; 
		*/
	height: 530px;
	position: relative;
	vertical-align: top;
}

div.wi_chatlive {
	background: url(imagesv2/chat_live.png) no-repeat;
	height: 90px;
	width: 181px;
}

a.wi_chatlive {
	height: 90px;
	width: 181px;
}

div.reminder-postit {
	background: url(imagesv2/reminder_post-it.png) no-repeat top left;
	height: 98px;
	padding-left: 110px;
	display: flex;
}

.reminder-postit span {
	font-style: italic;
	font-family: Segoe Print;
	font-size: 16px;
}

/*
#divLeadSearchWrapper
{
	Width: 85%;
	min-width:460px;
}
*/

/*
.pnlLeadSearch
{
	width:100%;
}

.pnlLeadSearchTable
{
	width:100%;
}

	*/

/*This is the CSS that is added for the closed accounts in the DynamicAccounts.aspx page when both open and closed accounts are showing*/
.wi_dynamic_accounts_closed_accounts {
	background-color: lightgray !important;
}

/*This is the CSS that is added for the opened accounts in the DynamicAccounts.aspx page when both open and closed accounts are showing*/
.wi_dynamic_accounts_open_accounts {
	background-color: white !important;
}

/*This is the CSS that is added when the save button on the DynamicBankAccountClient.aspx page is disabled*/
.wi_bank_account_save_button:disabled {
	opacity: 0.5;
}


#dhtmltooltip {
	position: absolute;
	left: 300px;
	width: 150px;
	border: 1px solid black;
	padding: 2px;
	background-color: lightyellow;
	visibility: hidden;
	z-index: 13000;
	/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
	filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);
	float: left !important;
}


#dhtmlpointer {
	position: absolute;
	left: -300px;
	z-index: 13100;
	visibility: hidden;
}

.wi_informationimage {
	background: url(imagesV2/yellowtrianglewarning.png) 0 0 no-repeat;
	border: none;
	vertical-align: middle;
	width: 18px;
	column-width: 18px;
}

.wi_recurringimage {
	background: url(imagesV2/061redogreen.png) 0 0 no-repeat;
	border: none;
	vertical-align: middle;
	width: 18px;
	column-width: 18px;
}

.wi_onetimedraftimage {
	background: url(imagesV2/400left16x16.png) 0 0 no-repeat;
	border: none;
	vertical-align: middle;
	width: 18px;
	column-width: 18px;
}

.wi_checkimage {
	background: url(imagesV2/Checks16x16.png) 0 0 no-repeat;
	border: none;
	vertical-align: middle;
	width: 18px;
	column-width: 18px;
}

.wi_bigicon {
	font-size: 22px;
}

/* icons next to the file name in the issue note, to indicate signed/approved/rejected */
.wi_img_signed {
	color: dimgray;
}

.wi_img_rejected {
	color: indianred;
}

.wi_img_approved {
	color: mediumseagreen;
}

/* HERE WE START GETTING INTO MORE SPECIFIC STYLES. SOMETIMES AFFECTING JUST ONE PAGE OR FIELD */


.wi_signaturelink_button {
	background-color: #2e6da4;
	border: 2px solid white;
	border-radius: 5px;
	color: white;
	float: right;
	/*position: absolute;*/
	right: 100px;
	top: 10px;
	margin-left: 50px;
}

.wi_iccosigndocument_editfields_button {
	border-radius: 5px;
	border: 2px solid white;
	background-color: #F8983B;
	color: white;
	padding-left: 15px;
	padding-right: 15px;
}


.wi_signature_completion_message {
	text-align: center;
}

.wi_signaturewarning {
	color: #a94442 !important;
	font-weight: bold;
}


.wi_signaturefullname_div {
	margin-bottom: 10px;
}

.wi_initialswarning_div .wi_signaturewarning {
	margin-top:20px;
}

.wi_signaturewarning_div .wi_signaturewarning {
	margin-top: 20px;
}

.wi_signaturefullnamewarning_div .wi_signaturewarning {
	margin-top: 20px;
}

.wi_signaturelegalwarning_div .wi_signaturelegalwarning {
	margin-top: 20px;
}


.wi_signaturesavebutton {
	margin-top: 20px;
}


.wi_signaturesetupinfo_div .wi_notification {
	margin-bottom: 20px;
}

.wi_signature_canvas_invalid {
	border-width: 2px !important;
	border-color: #a94442 !important;
	border-style: solid;
}

/* This is the canvas that displays the page of the document being signed in ICCOSignDocumentM.aspx */
.wi_iccosigncanvas {
	/*height: 100%; if you do both width 100% and height 100% then the proportions are not retained and the text looks squished */
	
	width: 100%;
	overflow: hidden;

	/*display: block; */
	margin: 0; /*this is to prevent the padding that bootstrap adds to the row*/
}


.wi_browserwarning_header_row {
	text-align: center;
	font-weight: bold;
	color: #FFF;
	background-color: #ff7c00;
	margin-top: -5px;
}

.wi_browserwarning_signature {
	text-align: center;
	font-weight: bold;
	color: #B33A3A;
	border: 2px #B33A3A solid;
}


/* special color for sign/approve/reject buttons */
.wi_button_sign {
}

.wi_button_approve {
}

.wi_button_reject {
}

.wi_button_signandapprove {
}

.wi_button_pay {
}

.wi_row_approvedsignedrejected {
	display: none;
}
/* Issue # 21918 - Client Web: The length of the Category and Account fields on the New Inquiry Screen are too short in IE but they resize correctly in Mozilla */
select.AutoExpand {
	max-width: 100%;
	min-width: 60%;
}

.wi_multiline {
	min-width: 60%;
	/*width:80%;*/ /* This settings its overwritting bootstrap*/
}

.wi_completionlist {
	background-image: none !important;
}

.wi_completionlisthighlighted {
	background-image: none !important;
	color: highlighttext;
	background-color: highlight;
}

/* used to put two glyphs together like in the message center New Message button */
.wi_two_glyphs_black {
	background-color: #3d5b8a;
	/*background-color: black;
    */
	border-radius: 5px;
	padding-top: 2px;
	padding-bottom: 4px;
	padding-left: 5px;
	padding-right: 0px;
	margin-right: 5px;
}

/* to separate the glyph from the text in the MessageCenterDetails */
.wi_glyph_in_span_black {
	padding-right: 5px;
	color: white; /*This makes it work with wi_two_glyphs_black*/
}

.wi_glyph_in_span {
	color: #3d5b8a;
	padding-right: 5px;
}

.wi_paynow_issue {
	text-align: center; /* center the Pay Now button on the Issue Details screen */
}

/* password meter */
.wi_meter {
	/* Reset the default appearance */
	/*-webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;*/
	/*
    margin: 0 auto 1em;
  */
	width: inherit;
	/*
  height: 0.5em;
    */
	/* Applicable only to Firefox */
	/*background: none;
  background-color: rgba(0, 0, 0, 0.1);
    */
}

	.wi_meter::-webkit-meter-bar {
		/*background: none;
    background-color: rgba(0, 0, 0, 0.1);
      */
	}

	/* Webkit based browsers */
	.wi_meter[value="1"]::-webkit-meter-optimum-value {
		background: red;
	}

	.wi_meter[value="2"]::-webkit-meter-optimum-value {
		background: red;
	}

	.wi_meter[value="3"]::-webkit-meter-optimum-value {
		background: red;
	}

	.wi_meter[value="4"]::-webkit-meter-optimum-value {
		background: red;
	}

	.wi_meter[value="5"]::-webkit-meter-optimum-value {
		background: orange;
	}

	.wi_meter[value="6"]::-webkit-meter-optimum-value {
		background: orange;
	}

	.wi_meter[value="7"]::-webkit-meter-optimum-value {
		background: yellow;
	}

	.wi_meter[value="8"]::-webkit-meter-optimum-value {
		background: yellow;
	}

	.wi_meter[value="9"]::-webkit-meter-optimum-value {
		background: green;
	}

	.wi_meter[value="10"]::-webkit-meter-optimum-value {
		background: green;
	}


	/* Gecko based browsers */

	.wi_meter[value="1"]::-moz-meter-bar {
		background: red;
	}

	.wi_meter[value="2"]::-moz-meter-bar {
		background: red;
	}

	.wi_meter[value="3"]::-moz-meter-bar {
		background: red;
	}

	.wi_meter[value="4"]::-moz-meter-bar {
		background: red;
	}

	.wi_meter[value="5"]::-moz-meter-bar {
		background: orange;
	}

	.wi_meter[value="6"]::-moz-meter-bar {
		background: orange;
	}

	.wi_meter[value="7"]::-moz-meter-bar {
		background: yellow;
	}

	.wi_meter[value="8"]::-moz-meter-bar {
		background: yellow;
	}

	.wi_meter[value="9"]::-moz-meter-bar {
		background: green;
	}

	.wi_meter[value="10"]::-moz-meter-bar {
		background: green;
	}



.wi_bolt {
	width: 12px;
	height: 12px;
	vertical-align: middle;
}

a.ImageButton {
	display: inline-block;
}

a.DeleteButton {
	background-image: url(imagesV2/Delete_16x16.png);
	width: 16px;
	height: 16px;
}

a.RefreshButton {
	background-image: url(imagesV2/Refresh-16x16.png);
	width: 16px;
	height: 16px;
}

.wi_row_no_padding {
	margin-left: 0;
	!important;
	margin-right: 0;
	!important;
}

	.wi_row_no_padding > [class*="col-"] {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

.wi_messages_badge {
	margin: 7px 2px;
	background-color: darkorange !important;
	color: #fff;
	padding: 4px 5px;
	border-radius: 25px;
}
/*CSB4 Position the message notification badge*/

.wi_messages_envelope {
	color: #3d5b8a;
	font-size: 1.2em;
}

.wi_new_messages_label {
	margin: 6px 5px; /*CSB4 Position the "new" notification*/
	color: darkorange;
	background-color: transparent;
	border: 2px solid darkorange;
	font-size: x-small;
	font-weight: bold;
	color: darkorange;
	padding: 2px;
	padding-left: 4px;
	padding-right: 4px;
}

.wi_messages_button {
	margin: 5px;
}

.wi_loginview_messagecenter {
	border: none;
	box-shadow: none;
	background-color: transparent;
	/* CSB4 this makes the button transparent*/
	display: contents;
}

.wi_loginview_welcomeuser_dropdown {
	border: none;
	background-color: transparent;
}

.wi_messagecenter_new_label {
	font-size: 10px;
	font-weight: bold;
	color: orange;
	vertical-align: middle;
	width: 15px;
	column-width: 15px;
}

.wi_body_chat_chatcenter a[id*=lnkJoin] {
	border: 2px solid;
	border-radius: 5px;
	padding: 5px;
	color: green;
	display: inline-block;
}

.wi_body_chat_chatcenter a[id*=lnkEnd] {
	border: 2px solid;
	border-radius: 5px;
	padding: 5px;
	color: red;
	margin-left: 5px;
	display: inline-block;
}

/* the toolbar at the top of a message */
.wi_messagecenterdetails_btngroup {
	margin-bottom: 10px;
}

.wi_dq_dropdown {
	width: auto;
	min-width: 180px;
	max-width: 300px;
}

.wi_dq_checkbox_alignleft {
	margin: auto;
}

	.wi_dq_checkbox_alignleft span {
		float: right;
	}


/*.wi_unanswered_required changes the div and input background color. This class makes the div background always white */
.wi_ig_csd, .input-group {
	background-color: white !important;
}

.wi_dq_dropdown_editable {
	border: none;
	background-color: white !important;
}

.wi_dq_dropdown_editable select {
	/*margin-bottom: 5px; This should not be needed, adds extra 5px on the control in the DQ which makes it look different from the rest of the controls */
	width: auto;
}

/* center drop downs to match other inputs in mobile view*/
@media only screen and (max-width:750px) {
	.wi_dq_dropdown {
		margin-right: auto;
	}

	.wi_dq_checkbox_alignleft span {
		float: none;
	}
}

.wi_dq_singleselection label {
	padding-left: 10px;
}

.wi_dq_singleselection input {
	margin-top: 10px;
}

.wi_dq_form .wi_dq_dropdown_div {
	padding-top: 10px;
}

.wi_dq_form .wi_dq_singleselection_div {
	padding-top: 10px;
}

.wi_dq_form .wi_dq_checkbox_div {
	padding-top: 10px;
}

.wi_dq_form .wi_dq_searchbox_div {
	padding-top: 10px;
}

.wi_dq_form .wi_dq_readonly_div {
	padding-top: 10px;
}

.wi_dq_form .wi_dq_open_div {
	padding-top: 10px;
}

.wi_dq_submit {
	margin-top: 10px;
}

/* this is to make the readonly textboxes (which are like labels) look like label text without border or background */
input.wi_dq_readonly {
	border-style: none;
	background-color: transparent !important;
}

.wi_hidden {
	display: none;
}


@media only screen and (min-width: 400px) and (max-width:699px) {
	
}

@media only screen and (min-width: 700px) {
	
}




/* For something other than big screens */
@media only screen and (max-width: 699px) {

	.center-content {
		padding: 0px 0px 0px 0px;
	}

	/* if we do this to try to get rid of padding on smaller screens, we end up with a scrollbar at the bottom 
	.wi_master_l1_centerpanel {
		padding: 0px 0px 0px 0px;
	}
		*/

}
/* For big screens */
@media only screen and (min-width: 700px) {

	.center-content {
		padding: 5px 5px 5px 10px;
	}
}

/* For medium screens */
@media only screen and (max-width: 765px) {
	.wi_mobileradio {
		display: inline-flex;
		float: left;
		color: #7A95BF;
		font-weight: bold;
		margin-left: 25px;
	}

	/* We shouldn't hide this because things like Enroll.aspx won't show the title at the top	
		.wi_formtableheader {
		display: none;
	}
	*/

	.wi_formcontrollabel {
		/* width: 100%; only needed when aligning right */
	}

	.form-control {
		/* when the viewpoint is too small, the form control gets separated from the prepend if you add this: margin-left: 25px;*/
		/* You cannot add this because it makes the control have less height in AccountUpdates.aspx when displayed in a row with other controls
			If you need to add it back please qualify it better so it does not break AccountUpdates.aspx
			padding: 3px;
		*/
	}

	#mainContentDivWrapper {
		/*text-align:center;*/
		display: block;
	}

	input[type=radio] {
		margin-left: 40px; /* This is excessive on small screens. Using another rule to bring them down on small screens.*/
	}
}

/* Small screens */
@media only screen and (max-width: 400px) {

	input[type=radio] {
		margin-left: 10px; /* This is excessive on small screens. Using another rule to bring them down on small screens.*/
	}

}


	/* For very big screens */
	@media only screen and (min-width: 992px) {

		.wi_formcontrollabel {
			/* We want to make sure that the label stays next to the field on very big screens, otherwise it becomes hard for the user to know which label corresponds to which textbox */
			text-align: right;
			width: 100%;
		}
		/*CSB4 Keeps field names and inputs responsive*/

		.wi_formcontrollabelrequired {
			text-align: right;
		}
	}

	/*PANEL WITH TABS - USED ON BANK ACCOUNT TRANSACTIONS*/
	.nav-tabs .nav-link {
		border-color: #ddd;
	}

	.panel with-nav-tabs .nav-tabs {
		border-bottom: none;
	}

	.panel with-nav-tabs .nav-justified {
		margin-bottom: -1px;
	}

	.with-nav-tabs .nav-tabs > li > a,
	.with-nav-tabs .nav-tabs > li > a:hover,
	.with-nav-tabs .nav-tabs > li > a:focus {
		color: #777;
	}

		.with-nav-tabs .nav-tabs > .open > a,
		.with-nav-tabs .nav-tabs > .open > a:hover,
		.with-nav-tabs .nav-tabs > .open > a:focus,
		.with-nav-tabs .nav-tabs > li > a:hover,
		.with-nav-tabs .nav-tabs > li > a:focus {
			color: #777;
			background-color: #ddd;
			border-color: transparent;
		}

	.with-nav-tabs .nav-tabs > li.active > a,
	.with-nav-tabs .nav-tabs > li.active > a:hover,
	.with-nav-tabs .nav-tabs > li.active > a:focus {
		color: #555;
		background-color: #fff;
		border-color: #ddd;
		border-bottom-color: transparent;
	}

	.wi_indicator {
		float: right;
		text-align: center;
		display: inline-block;
		vertical-align: baseline;
	}

	.wi_multiselect {
		/*height: 0px;*/
		visibility: hidden;
		display: none
	}

	.multiselect-container {
		width: max-content; /* increases the width of the options area so large text options don't wrap. important for the DMP reasons to look good. */
	}


	.wi_topalert_textmessage {
		font-size: 11px;
		color: steelblue;
		vertical-align: middle;
		margin-left: 3px;
		/*margin-bottom: 10px;*/
		text-align: left;
		/*padding-right: 350px;*/
		padding-left: 12px;
		padding-bottom: 6px;
		padding-top: 10px;
	}

	/*bug in bootstrap https://stackoverflow.com/questions/50349017/how-can-i-change-cursor-for-disabled-button-or-a-in-bootstrap-4 */
	button:disabled {
		cursor: not-allowed;
		pointer-events: all !important;
	}

	.wi_canvassimplediv {
		cursor: wait;
	}

	.wi_canvassimple {
		border: solid 1px #333;
		cursor: pointer;
	}


	.wi_signature_canvas {
		width: 100%;
		height: 100%;
		min-width: 300px;
		min-height: 150px;
		max-width: 600px;
		max-height: 300px;
	}


	.wi_initials_canvas {
		width: 100%;
		height: 100%;
		min-width: 150px;
		min-height: 75px;
		max-width: 300px;
		max-height: 150px;
	}

	.wi_signature_select {
		font-size: 40px;
	}

	/* Used in the ICCOCallback.aspx and ICCOCallbackM.aspx */
	.wi_frame_signedpdf {
		/*background-color: #fff;
			border-color:#ddd;
			border-width: 1px;
			border-radius: 4px 4px 0 0;
			box-shadow: none;
		  border-style: solid;*/
		padding: 45px 15px 15px;
		margin: 0 -15px 15px;
		/*Makes pdf document fill the page*/
		height: 100%;
		width: 100%;
	}

	/* for the div containing the next prev page and zoom in out buttons */
	.wi_iccosigndocument_buttonrow {
		padding: 5px;
		background-color: aliceblue;
		width: 100%;
		/* the two lines below squeeze the icons together in the middle - optional */
		display: block;
		text-align: center;
	}

		.wi_iccosigndocument_buttonrow .btn {
			/*
			Rather than fixed pixels, it's better on different width screens to use the min-width with a percentage
		margin-left: 15px;
		margin-right: 15px;
			*/
			min-width: 15%;
		}

	.wi_iccosigndocument_buttonrow_bottom {
		padding: 5px;
		background-color: aliceblue;
		width: 100%;
		/* the two lines below squeeze the icons together in the middle - optional */
		display: block;
		text-align: center;
	}

		.wi_iccosigndocument_buttonrow_bottom .btn {
			/*
			Rather than fixed pixels, it's better on different width screens to use the min-width with a percentage
		margin-left: 15px;
		margin-right: 15px;
			*/
			min-width: 15%;
		}

	.wi_iccosigndocument_prevpage {
		/*font-weight: bold;
	font-size: 18px;
	width: auto;
	margin-left: auto;
	border-radius: 5px 0px 0px 5px;*/
	}

	.wi_iccosigndocument_zoomout, .wi_iccosigndocument_zoomin {
		/*font-weight: bold;
	font-size: 18px;
	width: auto;*/
	}

	.wi_iccosigndocument_reject, .wi_iccosigndocument_download {
		width: auto;
		/*margin: auto;
    This centers it but puts it too close to the Prev/Next Page buttons and the Next Signature button
    Commenting it will move it to the far left
    */
		border-radius: 5px;
	}

	/* make "Download Document" link look like "Reject" button*/
	.wi_iccosigndocument_download {
		border: 1px solid #bfd2fb;
		background-color: #f6f6f6;
		text-align: center;
		color: black;
		padding-top: 1px;
		padding-bottom: 1px;
	}

	/* Download Document is disabled by default. Customer can add it in custom.css */
	.wi_iccosigndocument_download_div {
		display: none;
	}

	.wi_iccosigndocument_bottom_buttons_container {
		align-items: center;
		grid-gap: 5px;
		padding: 5px;
	}

	.wi_iccosigndocument_download:hover {
		color: black;
	}

	.wi_iccosigndocument_nextpage {
		/*font-weight: bold;
	font-size: 18px;
	width: auto;
	margin-right: auto;
	border-radius: 0px 5px 5px 0px;*/
	}

	.wi_iccosigndocument_sigsleft {
		width: auto;
		margin: auto;
		margin-right: 0px;
	}

	.wi_iccosigndocument_nextsig {
		margin: auto;
		border-radius: 5px;
		width: auto;
		margin-left: 0px;
		background-color: cornsilk;
		color: indianred;
	}

		.wi_iccosigndocument_nextsig .fas {
			/*color: white;*/
			/*color: indianred;*/
		}

	.wi_iccosigndocument_nextsig_bottom {
		margin-left: auto;
		margin-right: auto;
		border-radius: 5px;
		width: auto;
	}

		.wi_iccosigndocument_nextsig_bottom .fas {
			color: white;
		}

	/* this one is in the row of page/zoom buttons */
	.wi_iccosigndocument_nextsig_bottom2 {
		margin-left: auto;
		margin-right: auto;
		border-radius: 5px;
		width: auto;
		background-color: cornsilk;
		color: indianred;
	}

		.wi_iccosigndocument_nextsig_bottom2 .fas {
			/*color: white;*/
		}

	/* this one is in the row of page/zoom buttons */
	.wi_iccosigndocument_nextsig_top2 {
		margin-left: auto;
		margin-right: auto;
		border-radius: 5px;
		width: auto;
		background-color: cornsilk;
		color: indianred;
	}

		.wi_iccosigndocument_nextsig_top2 .fas {
			/*color: white;*/
		}


	.wi_iccosigndocument_finish_top {
		margin: auto;
		border-radius: 5px;
		width: auto;
		margin-left: 0px;
		font-size: 28px;
		color: white;
		background-color: #4BB543;
		/* on wide screens the button looks too narrow */
		min-width: 20%;
	}

	/* this one is in the row of page/zoom buttons */
	.wi_iccosigndocument_finish_bottom2 {
		font-size: 28px;
		color: white;
		background-color: #4BB543;
		/* on wide screens the button looks too narrow */
		min-width: 20%;
	}

	/* this one is in the row of page/zoom buttons */
	.wi_iccosigndocument_finish_top2 {
		font-size: 28px;
		color: white;
		background-color: #4BB543;
		/* on wide screens the button looks too narrow */
		min-width: 20%;
	}

	.wi_banner_menu_dropdown_div {
		display: inline-flex;
		width: 100%;
	}

	.wi_banner_menu_dropdown_button {
		padding: 0px;
		background: none; /* there's a gray color otherwise*/
		border-style: none;
	}

	.wi_banner_menu_dropdown_span {
		border-radius: 5px 0px 0px 5px; /* makes the refresh button have the rounded edges on the left and flush on the right against the dropdownlist */
		display: block;
	}

	.wi_iccosign_downloadrow {
		padding-top: 20px;
	}

	.wi_iccosign_errormessagerow {
		padding-top: 20px;
	}

	/* the a href to the PDF URL */
	.wi_iccosign_downloadurl {
		margin: auto; /* to center it */
	}
	/* the a href to the Click here to continue URL */
	.wi_iccosign_continueurl {
		margin: auto; /* to center it */
	}

	.wi_iccosign_nextsignermessage {
		margin: auto; /*to center it*/
	}

	.wi_iccosign_nextsignermessagerow {
	}



	/* TOUCH DEVICES */

	/* Enable this to hide zoomin/zoomout in iccosign on touch devices (since they can pinch) */
	.wi_touch_device .wi_iccosigndocument_zoomout {
		display: none;
	}

	.wi_touch_device .wi_iccosigndocument_zoomin {
		display: none;
	}
	/* show next signature, sigs left, and finish in the button row instead of separate (to make it take less space) when the zoom buttons are hidden */
	.wi_touch_device .wi_iccosigndocument_nextsig {
		display: none;
	}

	.wi_touch_device .wi_iccosigndocument_sigsleft {
		display: none;
	}

	.wi_touch_device .wi_iccosigndocument_finish_top {
		display: none;
	}



	@media screen and (max-width: 600px) {

		/* SMALL SCREENS NO TOUCH (DESKTOP) */

		/* hide next signature (which includes sigs left on the top) and finish on the top row (since we have no space left because of the zoom buttons) */
		.wi_no_touch_device .wi_iccosigndocument_nextsig_top2 {
			display: none;
		}

		.wi_no_touch_device .wi_iccosigndocument_finish_top2 {
			display: none;
		}
	}

	@media screen and (min-width: 601px) {

		/* LARGER SCREENS NO TOUCH (DESKTOP) */

		/* hide next signature, sigs left and finish as separate buttons (we will show the ones in the page/zoom row instead) */
		.wi_no_touch_device .wi_iccosigndocument_nextsig {
			display: none;
		}

		.wi_no_touch_device .wi_iccosigndocument_sigsleft {
			display: none;
		}

		.wi_no_touch_device .wi_iccosigndocument_finish_top {
			display: none;
		}
	}


	/* Enable this to hide header and footer in iccosign on mobile (minimal view) */

	@media screen and (max-width: 600px) {

		.wi_body_Signature_ICCOSignDocumentM .wi_footermargin {
			display: none;
		}


		/* this one would also hide the Welcome and navigation menu.*/
		/*
		.wi_body_Signature_ICCOSignDocumentM .wi_master_l0_header {
			display:none;
		}

		*/

		.wi_body_Signature_ICCOSignDocumentM .Master_L1_CenterTopPanel {
			display: none;
		}
	}




	/* SIGNATURE FONTS */
	@font-face {
		font-family: ICCOSign1;
		src: url('fonts/ICCOSign01.ttf');
	}

	@font-face {
		font-family: ICCOSign2;
		src: url('fonts/ICCOSign02.ttf');
	}

	@font-face {
		font-family: ICCOSign3;
		src: url('fonts/ICCOSign03.ttf');
	}

	@font-face {
		font-family: ICCOSign4;
		src: url('fonts/ICCOSign04.ttf');
	}

	@font-face {
		font-family: ICCOSign5;
		src: url('fonts/ICCOSign05.ttf');
	}

	@font-face {
		font-family: ICCOSign6;
		src: url('fonts/ICCOSign06.ttf');
	}

	@font-face {
		font-family: ICCOSign7;
		src: url('fonts/ICCOSign07.ttf');
	}

	@font-face {
		font-family: ICCOSign8;
		src: url('fonts/ICCOSign08.ttf');
	}

	@font-face {
		font-family: ICCOSign9;
		src: url('fonts/ICCOSign09.ttf');
	}

	@font-face {
		font-family: ICCOSign10;
		src: url('fonts/ICCOSign10.ttf');
	}


	/* SIGNATURE FONTS */
	@font-face {
		font-family: CustomICCOSign1;
		src: url('CUSTOM/fonts/ICCOSign01.ttf');
	}

	@font-face {
		font-family: CustomICCOSign2;
		src: url('CUSTOM/fonts/ICCOSign02.ttf');
	}

	@font-face {
		font-family: CustomICCOSign3;
		src: url('CUSTOM/fonts/ICCOSign03.ttf');
	}

	@font-face {
		font-family: CustomICCOSign4;
		src: url('CUSTOM/fonts/ICCOSign04.ttf');
	}

	@font-face {
		font-family: CustomICCOSign5;
		src: url('CUSTOM/fonts/ICCOSign05.ttf');
	}

	@font-face {
		font-family: CustomICCOSign6;
		src: url('CUSTOM/fonts/ICCOSign06.ttf');
	}

	@font-face {
		font-family: CustomICCOSign7;
		src: url('CUSTOM/fonts/ICCOSign07.ttf');
	}

	@font-face {
		font-family: CustomICCOSign8;
		src: url('CUSTOM/fonts/ICCOSign08.ttf');
	}

	@font-face {
		font-family: CustomICCOSign9;
		src: url('CUSTOM/fonts/ICCOSign09.ttf');
	}

	@font-face {
		font-family: CustomICCOSign10;
		src: url('CUSTOM/fonts/ICCOSign10.ttf');
	}

	/* If you use custom fonts you will need to define the styles in your custom.css and point the font-family to CustomICCOSignX */

	.wi_iccosignstyle1 {
		font-family: ICCOSign1;
	}

	.wi_iccosignstyle2 {
		font-family: ICCOSign2;
	}

	.wi_iccosignstyle3 {
		font-family: ICCOSign3;
	}

	.wi_iccosignstyle4 {
		font-family: ICCOSign4;
	}

	.wi_iccosignstyle5 {
		font-family: ICCOSign5;
	}

	.wi_iccosignstyle6 {
		font-family: ICCOSign6;
	}

	.wi_iccosignstyle7 {
		font-family: ICCOSign7;
	}

	.wi_iccosignstyle8 {
		font-family: ICCOSign8;
	}

	.wi_iccosignstyle9 {
		font-family: ICCOSign9;
	}

	.wi_iccosignstyle10 {
		font-family: ICCOSign10;
	}




	.wi_div_confirmation {
		margin-top: 15px;
	}

	.wi_lbl_confirmation {
	}

	.wi_chk_confirmation {
	}

	/*This is the CSS that is added when the save button is disabled when there is a confirmation verbiage */
	.wi_confirmation_save_button:disabled {
		opacity: 0.5;
	}

	/* CS ABA Form Control */
	.wi_fc_aba {
		/*min-width: 100px;*/
	}

	/* CS ABA Input Group*/
	.wi_ig_aba {
		/*max-width: 150px;*/
		width: 200px; /* aba is 9 digits, 200px makes it fit the 9 digits plus the Validate button */
	}

	/* CAPTCHA STUFF - Used in LinkAccount.aspx and ForgotPasswordDynamic.aspx */
	.sortable {
		list-style-type: none;
		margin: 5px 0px 0px 16px;
		padding: 0;
	}

		.sortable li {
			margin: 3px 3px 3px 0;
			padding: 1px;
			float: left;
			width: 35px;
			height: 35px;
			font-size: 20px;
			text-align: center;
			line-height: 35px;
			cursor: pointer;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			-moz-box-shadow: 0 1px 1px rgba(0,0,0,0.5);
			-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.5);
			text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
			background: #2daebf url(imagesV2/overlay.png) repeat-x scroll 50% 50%;
			color: #fff;
			font-weight: normal;
		}

	.captcha_wrap {
		border: 1px solid #fff;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
		-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
		float: left;
		/*
                    height:120px;
                    */
		overflow: auto;
		width: 150px;
		overflow: hidden;
		/*margin:0px 0px 0px 210px;*/
		margin-bottom: 20px;
		background-color: #fff;
	}

	.captcha_label {
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		font-size: 12px;
		color: #BBBBBB;
		text-align: center;
		border-bottom: 1px solid #CCC;
		background-color: #fff;
	}






	/* these go at the end because they should always be enforced */
	.hidden {
		display: none;
	}

	.wi_loginview_iccosign_indicator {
		border: none;
		box-shadow: none;
		background-color: transparent;
		/* CSB4 this makes the button transparent*/
		display: contents;
	}

	.wi_iccosign_indicator {
		color: white;
		background-color: darkorange;
		border-radius: 5px;
		padding: 1px;
		padding-left: 4px;
		padding-right: 3px;
	}

		.wi_iccosign_indicator i {
			color: white;
			background-color: darkorange;
		}

	/* This keeps modals from disabling the abilty to scroll */
	.modal-open {
		overflow: inherit;
	}


	.wi_signup_paymentschedule_firstpaymentdate {
		/* Include in Custom.css if you want to hide and uncomment out display
	display: none;
		*/
	}

	/* fix for trial message showing even though version is licensed */
	/*.ui-igtrialwatermark {
	display:none !important;
	opacity: 0 !important;
}*/

	/* Shades of gray used for the Last Visited feature - From https://www.cssportal.com/html-colors/shades-of-gray.php */
	.wi_gray_1 {
		background-color: #F8F8F8 !important;
	}

	.wi_gray_2 {
		background-color: #F0F0F0 !important;
	}

	.wi_gray_3 {
		background-color: #E8E8E8 !important;
	}

	.wi_gray_4 {
		background-color: #E0E0E0 !important;
	}

	.wi_gray_5 {
		background-color: #D8D8D8 !important;
	}

	.wi_gray_6 {
		background-color: #D0D0D0 !important;
	}

	.wi_gray_7 {
		background-color: #C8C8C8 !important;
	}

	.wi_gray_8 {
		background-color: #C0C0C0 !important;
	}

	.wi_gray_9 {
		background-color: #B8B8B8 !important;
	}

	.wi_gray_10 {
		background-color: #B0B0B0 !important;
	}

	.wi_gray_11 {
		background-color: #A8A8A8 !important;
	}

	.wi_gray_12 {
		background-color: #A0A0A0 !important;
	}

	.wi_gray_13 {
		background-color: #989898 !important;
	}

	/* Used by _CSGenericSearch control */
	.wi_ctrl_generic_search_content_container {
		display: flex;
		align-items: center;
	}

	.wi_ctrl_generic_search_grid {
		display: flex;
		flex-direction: column;
	}

	.wi_ctrl_generic_search_qsearch_container {
		display: flex;
		flex-direction: row;
	}

	.wi_ctrl_generic_search_spinner_container {
		padding: 20px;
	}

	.input-group.wi_ctrl_generic_search_content_container > .input-group-append > button:last-child {
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}

	.wi_ctrl_generic_search.wi_unanswered_required,
	.wi_ctrl_read_only_async.wi_unanswered_required,
	.wi_ctrl_generic_search_qsearch_container > input.wi_unanswered_required,
	.wi_ctrl_dob.wi_unanswered_required {
		background-color: transparent;
	}

	.wi_ctrl_generic_search_grid_row {
		cursor: pointer;
	}

	.wi_button[disabled] {
		color: black;
		background-color: lightgray;
	}

	/*--- menu begin ---*/
	.wi_base_menu ul {
		margin: 0;
		padding: 0;
	}

	/* hides submenu when the menu item is marked collapsed */
	.wi_menu_collapsed > ul {
		display: none;
	}

	/* shows submenu when the menu item is marked expanded */
	.wi_menu_expanded > ul {
		display: block;
	}

	/* width reserved for arrows in leaf items */
	.wi_menu_arrow {
		width: 1em;
	}

	/* horizontal spacing for each level */
	.wi_menu_spacer {
		width: 1em;
	}

	/* vertical spacing between menu items */
	.wi_menu_row {
		padding-top: 2px;
	}

	/* clickable menu item*/
	.wi_menu_click_container {
		padding: 5px;
		cursor: pointer;
		border: 1px solid black; /*transparent*/
		border-color: transparent;
		background-color: #d7e1f1;
		overflow-x: hidden;
	}

		/* adds blue border when user hovers menu item */
		.wi_menu_click_container:hover {
			border: 1px solid #3d5b8a;
			/*gets rid of white space when border pops up*/
			background-color: #d7e1f1;
		}

		/* selected menu item */
		.wi_menu_click_container.wi_menu_item_selected {
			background-color: #3d5b8a;
			color: white;
		}

			/* if you use images in the HTML of the button, they will show white when the button is selected */
			.wi_menu_click_container.wi_menu_item_selected .wi_menu_item_title .fas {
				color: white;
			}


	li.wi_menu_row {
		margin: 0px;
	}

	/* makes the mobile icon buttons to have the minimum width (default flex values) */
	button.btn.wi_mobilemenu_toggler {
		flex: 0 1 auto;
	}

	/* forces the center mobile button to expand at the expense of the icon buttons */
	button.btn.wi_mobilemenu_current {
		flex: 1;
	}

	/* used to display the hidden menu when in mobile menu mode */
	.wi_mobilemenu_show {
		display: block; /*!important;*/
		position: absolute;
		z-index: 1050;
		border-radius: .25rem;
	}

	/* overly to function as the background of the mobile menu */
	#wi_mobileMenu_overlay {
		display: none;
		position: fixed;
		top: 0px;
		left: 0px;
		right: 0px;
		bottom: 0px;
		background-color: gray;
		opacity: 0.4;
		z-index: 1000;
	}

	/* hides mobile menu items by default. They are displayed by media queries in CSMasterStylesV2.css */
	.wi_menuclass_mobile {
		display: none;
	}

	/*--- menu end ---*/
	/* used by DateByParts control */
	.wi_ctrl_dob_order_0 {
		order: 0;
	}

	.wi_ctrl_dob_order_1 {
		order: 1;
	}

	.wi_ctrl_dob_order_2 {
		order: 2;
	}

	/* spinner module */
	.wi_spinner {
		z-index: 1000;
	}

	.wi_spinner_full_window, /* used by creditsoft.js SPINNER module */
	.wi_cs_modal_background { /* used by creditsoft.js CS_Modal module */
		position: fixed;
		width: 100%;
		height: 100%;
		left: 0px;
		top: 0px;
		background-color: rgba(0,0,0, 0.5);
		z-index: 2000; /* should be higher than the #wi_mobileMenu_overlay */
	}

	/* color picker */

	/* stripped area to represent null value */
	.wi_ctrl_color_picker_null {
		min-width: 100px;
		background-color: #ffffff;
		background-image: url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23000000' fill-opacity='0.27' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
	}

	.wi_ctrl_color_picker_input, .wi_ctrl_color_picker_null, .wi_ctrl_color_picker_rdonly {
		height: 38px;
		width: 100px;
	}

	/* to force round the left corners of the input */
	.wi_ctrl_color_picker_input {
		border-bottom-left-radius: 0.25rem;
		border-top-left-radius: 0.25rem;
	}

	.wi_ctrl_color_picker_rdonly {
		border-radius: 0.25rem;
	}

	.wi_navbtn2 {
		display: inline-grid;
	}

		.wi_navbtn2 .far {
			color: white;
			font-size: x-large;
		}

		.wi_navbtn2 .fas {
			color: white;
			font-size: x-large;
		}

	.wi_button_danger {
		background-color: antiquewhite;
		color: crimson;
	}

		.wi_button_danger .far {
			color: crimson;
		}

		.wi_button_danger .fas {
			color: crimson;
		}

	.wi_settingsgrid_isdefault {
		font-size: large;
		color: green;
	}

	.wi_savedsearch_donotuse {
		font-size: large;
		color: red;
	}


	.wi_enroll_signup_header {
		font-size: large;
		padding-bottom: 15px;
		padding-top: 10px;
	}

	/* CSDropDownColorIOS Begin */
	.wi_colordd4ios {
		display: inline-flex;
		flex-direction: column;
		position: relative;
	}

		.wi_colordd4ios .wi_colordd4ios_header {
			display: flex;
			flex-direction: row;
			align-items: center;
		}

		.wi_colordd4ios .wi_colordd4ios_header, .wi_colordd4ios .wi_colordd4ios_dropdown {
			border: 1px solid #ced4da;
			border-radius: 0.25rem;
			cursor: pointer;
		}

			.wi_colordd4ios .wi_colordd4ios_header .wi_colordd4ios_description {
				min-width: 80px;
				padding-left: 5px;
			}

			.wi_colordd4ios .wi_colordd4ios_header button {
				padding: 6px;
				border-top-left-radius: 0;
				border-bottom-left-radius: 0;
				border-width: 0px;
			}

		.wi_colordd4ios .wi_colordd4ios_dropdown {
			position: absolute;
			z-index: 1000;
			background-color: white;
		}

		.wi_colordd4ios ul {
			padding: 0;
			margin: 0;
		}

		.wi_colordd4ios .wi_colordd4ios_dropdown > ul > li {
			margin-bottom: 0px;
		}
	/* CSDropDownColorIOS End */
	/* AddUser.aspx/ViewUser.aspx duplicated messages */
	.form-control.wi_dq_web_adduser_duplicatedemail, .form-control.wi_dq_web_viewuser_duplicatedemail, .form-control.wi_dq_web_adduser_duplicatedusername {
		border: none;
		background-color: transparent;
		font-size: small;
	}

		.form-control.wi_dq_web_adduser_duplicatedemail:focus, .form-control.wi_dq_web_viewuser_duplicatedemail:focus, .form-control.wi_dq_web_adduser_duplicatedusername:focus {
			border: none;
			box-shadow: none;
		}

	/* duplicated email is an info message */
	.form-control.wi_dq_web_adduser_duplicatedemail, .form-control.wi_dq_web_viewuser_duplicatedemail {
		color: darkblue;
	}

	/* duplicated username is an error message */
	.form-control.wi_dq_web_adduser_duplicatedusername {
		color: darkred;
	}

	.wi_multiselect_status ul.dropdown-menu.show {
		padding-left: 8px;
		padding-right: 8px;
		width: max-content;
	}

	/* BEGIN draws a red border around unfulfilled required input boxes */
	div.wi_dq_questionwrapper.wi_dqwrpr_invalid input.wi_dq_required_question,
	div.wi_dq_questionwrapper.wi_dqwrpr_invalid div.wi_dq_required_question input {
		border: 1px solid red !important;
	}

		/* new required red shadow when focus */
		div.wi_dq_questionwrapper.wi_dqwrpr_invalid input:focus.wi_dq_required_question,
		div.wi_dq_questionwrapper.wi_dqwrpr_invalid div.wi_dq_required_question input:focus {
			border: none !important;
		}

		div.wi_dq_questionwrapper.wi_dqwrpr_invalid input:focus.wi_dq_required_question,
		div.wi_dq_questionwrapper.wi_dqwrpr_invalid div.wi_dq_required_question input:focus {
			box-shadow: rgba(255, 0, 0, 1) 0px 0px 0px 0.2rem !important;
		}

	.wi_required_popup .modal-body {
		color: darkred;
	}
	/* END draws a red border around unfulfilled required input boxes */

	.wi_issuenote_separator {
		margin-top: 0px !important;
		margin-bottom: 0px !important;
	}

	.wi_issuenote_notetype {
		text-align: left;
	}

	/* BudgetA */
	.wi_body_signup_budgeta tr.wi_budget_subcategory.wi_budget_subcategory_hidden {
		display: none;
	}

	.wi_body_signup_budgeta tr.wi_budget_subcategory .wi_budget_category_name {
		display: none;
	}

	.wi_body_signup_budgeta .wi_clientcomments_container {
		font-size: 0.8rem;
		padding-left: 1rem;
	}

	.wi_body_signup_budgeta .wi_budget_buttoncol {
		cursor: pointer;
	}

	.wi_rowspacedown {
		margin-bottom: 21px;
	}

	/* RATING - IssueFeedback page */


	/****** Style Star Rating Widget *****/
	.wi_rating {
		border: none;
		float: left;
		margin-top: -6px;
	}

		.wi_rating > input {
			display: none;
		}

		.wi_rating > label:before {
			margin: 5px;
			font-size: 1.25em;
			display: inline-block;
			content: "\f005";
			font-family: Font Awesome\ 5 Free !important;
			font-weight: 900;
		}

		.wi_rating > .wi_rating_half:before {
			content: "\f089";
			position: absolute;
			font-family: Font Awesome\ 5 Free !important;
			font-weight: 900;
		}

		.wi_rating > label {
			color: #ddd;
			float: right;
		}

		/***** CSS Magic to Highlight Stars on Hover *****/

		.wi_rating > input:checked ~ label, /* show gold star when clicked */
		.wi_starratinghover:not(:checked) > label:hover, /* hover current star */
		.wi_starratinghover:not(:checked) > label:hover ~ label {
			color: #FFD700;
		}
	/* hover previous stars in list */


	.wi_starratinghover > input:checked + label:hover, /* hover current star when changing rating */
	.wi_starratinghover > input:checked ~ label:hover,
	.wi_starratinghover > label:hover ~ input:checked ~ label, /* lighten current selection */
	.wi_starratinghover > input:checked ~ label:hover ~ label {
		color: #FFED85;
	}

	.wi_rating_Empty_Bad {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -75px 0px;
	}

	.wi_rating_Empty_Good {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: 0px 0px;
	}

	.wi_rating_Selected_Bad {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -100px 0px;
	}

	.wi_rating_Selected_Good {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -50px 0px;
	}


	.wi_rating_Hovered_Bad {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -100px 0px;
	}

	.wi_rating_Hovered_Good {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -25px 0px;
	}

	.wi_rating_DisabledEmpty_Bad {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -75px 0px;
	}

	.wi_rating_DisabledEmpty_Good {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -75px 0px;
	}

	.wi_rating_DisabledSelected_Bad {
		background: transparent url(imagesV2/igr_RatingSprite.png) no-repeat;
		background-position: -100px 0px;
	}

	.wi_rating_DisabledSelected_Good {
		background: transparent url(images/igr_RatingSprite.png) no-repeat;
		background-position: -50px 0px;
	}

	/* used by ContextMenuHandler */
	/* parent of the context menu should be set to position:relative */
	.wi_context_menu_parent {
		position: relative;
		left: 0px;
		top: 0px;
	}

	/* div to be displayed as a context menu, initially hidden, position: absolute */
	/* imitates static grid context menu */
	.wi_context_menu {
		display: none;
		position: absolute;
		min-width: 10rem;
		padding: 0.5rem 0;
		margin: 0.125rem 0 0;
		font-size: 1rem;
		color: #212529;
		text-align: left;
		list-style: none;
		background-color: #fff;
		background-clip: padding-box;
		border: 1px solid rgba(0,0,0,.15);
		border-radius: 0.25rem;
		box-sizing: border-box;
	}

		.wi_context_menu > ul {
			padding: 5px;
			margin: 0px;
		}

			.wi_context_menu > ul > li {
				cursor: pointer;
				font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
				padding-left: 15px;
				color: #3d5b8a;
				text-decoration: none !important;
				background-color: transparent;
			}

				.wi_context_menu > ul > li:hover {
					color: #0056b3;
				}

	/* BEGIN dynamic grid SelectedIDs checkboxes look the same as in staticgrid */
	input.wi_dq_grid_selectedid_chk[type="checkbox"]::before, input.wi_dq_grid_selectedid_chkall[type="checkbox"]::before {
		content: url("ig_res/Default/images/ig_checkbox_off.gif");
	}

	input.wi_dq_grid_selectedid_chk[type="checkbox"]:checked::before, input.wi_dq_grid_selectedid_chkall[type="checkbox"]:checked::before {
		content: url("ig_res/Default/images/ig_checkbox_on.gif");
	}

	input.wi_dq_grid_selectedid_chk[type="checkbox"], input.wi_dq_grid_selectedid_chkall[type="checkbox"] {
		-moz-appearance: none;
		-webkit-appearance: none;
		appearance: none;
		margin: 0;
		background-color: transparent;
	}

	.wi_dq_grid_selectedid_cell, .ui-iggrid th.wi_dq_grid_selectedid_header {
		text-align: center;
	}
	/* END dynamic grid SelectedIDs checkboxes look the same as in staticgrid */

	/* Used for displaying certain hints on the top of the page */
	.wi_hint_div {
		background-color: bisque;
		border-radius: 10px;
		padding: 10px;
		margin: 10px;
	}

	/*FIX for consecutive grids stacking to the right (indexing) BUT breaks other grids by being too flexible and floating left
	TODO: class called "row" is improperly indexing the tables after each other when screen is wide enough.
*/
	.row .wi_dq_grid_div {
		/*.wi_dq_questionwrapper*/ /*.wi_dq_grid_div*/ /*, .wi_dq_staticgrid_div, .wi_dq_open_div*/
		/*float: left;
		margin-left: 0px;
		padding-left: 0px;*/
	}

	.wi_iggrid_cardview table {
		cursor: text !important;
		text-decoration: none !important;
		border: none;
		width: 100% !important;
		border-collapse: collapse;
		/*float: left;*/
		/*display: flex;
		flex-wrap: wrap;
		flex-direction: column;*/
	}

	.wi_iggrid_cardview tbody td {
		cursor: text !important;
		text-decoration: none !important;
		border-bottom: none !important;
		border: none !important;
		border-left: none !important;
		border-right: none !important;
		border-top: none !important;
	}

	.wi_iggrid_cardview .ui-iggrid .ui-iggrid-scrolldiv:first-child, .ui-iggrid-responsive-vertical, .ui-iggrid > table tr:first-child td, .ui-iggrid > table tr:first-child th.ui-iggrid-rowselector-class {
		border-top: none !important;
	}


	/* Hide table headers (but not display: none;, for accessibility) */
	.wi_iggrid_cardview thead tr {
		border: none;
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	/*Show table headers as labels on each cell. Added initially via js*/
	.wi_iggrid_cardview .wi_label_cell {
		border: none;
		display: block;
		padding-right: 20px;
	}

	.wi_iggrid_cardview tr {
		Cursor: text !important;
		Text-Decoration: none !important;
		border: none;
		border-bottom: 2px solid #333;
		border-top: none !important;
		/*inline-flex on tr makes the rows stack*/
		/*display: inline-flex;*/
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		min-width: 350px;
		flex: 0 0 25%;
		font-size: 14px;
		/*width: 500px;*/ /*could set width to width of screen if it changes. pseudo-flex property for table row*/
		/*flex-wrap: wrap;*/
		/*flex-wrap seems to make it just be one column, almost like it's trying to wrap to a really narrow screen.*/
		/*width: fit-content;*/
	}

	.wi_iggrid_cardview .wi_ig_tablerow td {
		Cursor: text !important;
		Text-Decoration: None !important;
		/* Behave  like a "row" */
		border: none;
		border-bottom: none !important;
		border-top: none !important;
		/*border-bottom: 1px solid #eee;*/
		position: relative;
		padding-left: 50%;
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		min-width: 100px;
		flex: 0 0 25%;
	}

		.wi_iggrid_cardview .wi_ig_tablerow td:before {
			border: none;
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%;
			padding-right: 10px;
			white-space: nowrap;
		}

	.wi_iggrid_cardview .wi_label_cell {
		font-weight: bold;
	}

/* BEGIN Left Panel Menu*/
/* Generic toggler button */
.wi_master_l1_leftpanel .wi_leftmenupanel_toggler {
    position: absolute;
    top: 1rem;
    right: 6px;
    background-color: transparent;
    border: none;
    outline: none;
}

/* Left panel menu default setting */
.wi_master_l1_leftpanel {
    /*display: none !important;*/
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    overflow: hidden;
}
    /* Toggle menu title panel visiblity */
    .wi_master_l1_leftpanel .wi_master_l1_menu .wi_desktopMenuConcealer > div:not(.wi_menuclass_mobile) .wi_menupanel {
        display: none;
    }

    /* Set left panel menu minimum width and text wrap.*/
    .wi_master_l1_leftpanel.wi_master_l1_leftpanel_collapse {
        flex: 0 0 3rem;
        white-space: nowrap;
    }

/* Set left panel menu max width.*/
.wi_master_l1_centerpanel.wi_master_l1_centerpanel_expanded {
    flex: 1;
    max-width: none !important;
}

.wi_master_l1_leftpanel .wi_desktopMenuConcealer > div:not(.wi_menuclass_mobile) ul .wi_menu_collapsed {
    position: relative;
    cursor: pointer;
}

    .wi_master_l1_leftpanel .wi_desktopMenuConcealer > div:not(.wi_menuclass_mobile) ul .wi_menu_collapsed:hover::before {
        opacity: 1;
        visibility: unset;
    }
/* Add margin to nav link in left menu panel. */
.wi_master_l1_leftpanel .wi_menu_item_default_icon + .wi_custom_menu_item_title {
    margin-left: 0.5rem;
}

/* show logo, header menu title and nav link content title  */
.wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name,
.wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name .wi_menupanel_name,
.wi_master_l1_leftpanel .wi_menu_item_title:not(:has(span)) {
    opacity: 1;
    transition: opacity 0.2s ease;
}

/* hide logo and header menu title*/
.wi_master_l1_leftpanel.wi_master_l1_leftpanel_collapse .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name,
.wi_master_l1_leftpanel.wi_master_l1_leftpanel_collapse .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name .wi_menupanel_name {
    opacity: 0;
}
/* add margin to left panel nav link content title. */
.wi_master_l1_leftpanel .wi_menu_item_title:not(:has(span)) {
    margin-left: 1.5rem;
}

/* add border radius styling to left panel menu. */
.wi_menu_click_container {
    border-radius: 0.25rem;
}

.wi_master_l1_leftpanel .wi_leftmenupanel_toggler:active {
    outline: none;
    border: none;
}

.wi_master_l1_leftpanel .wi_leftmenupanel_toggler .wi_leftmenupanel_icon {
    font-size: 1.5rem;
    color: var(--gray);
}

    .wi_master_l1_leftpanel .wi_leftmenupanel_toggler .wi_leftmenupanel_icon:hover::before {
        font-size: 1.5rem;
        color: #3d5b8a;
    }

/* hide generic logo and toggler button */
@media only screen and (max-width: 991px) {
    .wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper,
    .wi_master_l1_leftpanel .wi_menupanel_toggler,
    .wi_master_l1_leftpanel .wi_master_l1_menu .wi_desktopMenuConcealer > div:not(.wi_menuclass_mobile) .wi_menupanel {
        display: none;
    }

    .wi_master_l1_leftpanel.wi_master_l1_leftpanel_collapse .wi_custom_menu_item_title {
        opacity: 1;
        white-space: pre-wrap;
    }

    .wi_master_l1_leftpanel, .wi_master_l1_leftpanel.wi_master_l1_leftpanel_collapse {
        transition: none;
    }

    .wi_mobilemenu_show {
        display: block;
    }
}

.wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper {
    margin-bottom: 0.5rem;
}
    /* Generic Logo */
    .wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name {
        display: flex;
        align-items: center;
        background: url(./imagesV2/light_bulb.png) 0px 0px;
        background-repeat: no-repeat;
        background-size: contain;
        height: 40px;
        cursor: pointer;
        /* padding-right: 5px; */
    }

        .wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name .wi_menupanel_name {
            margin-left: 3rem;
            display: inline-block;
        }

            .wi_master_l1_leftpanel .wi_menupanel_logo_name_wrapper .wi_menupanel_logo_name .wi_menupanel_name::before {
                content: "Smart Manager";
            }

/* Feature Item text collapse*/
/*END*/


/* workflow list dropdown */
.wi_dropdown_wfl {
	display: inline-block;
	max-width: 350px;
}

.bulkaction_button {
	display: none;
}