<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* roboto-regular - latin */
@font-face {
	font-family: "Roboto";
	font-style: normal;
	font-weight: 400;
	src: url("../font/roboto-v20-latin-regular.eot"); /* IE9 Compat Modes */
	src: local("Roboto"), local("Roboto-Regular"), url("../font/roboto-v20-latin-regular.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ url("../font/roboto-v20-latin-regular.woff2") format("woff2"), /* Super Modern Browsers */ url("../font/roboto-v20-latin-regular.woff") format("woff"), /* Modern Browsers */ url("../font/roboto-v20-latin-regular.ttf") format("truetype"), /* Safari, Android, iOS */ url("../font/roboto-v20-latin-regular.svg#Roboto") format("svg"); /* Legacy iOS */
}

html {
	height: 100%;
	font-size: 100% !important;
	margin: 0;
}
body {
	background-color: #fff;
	font-family: "Roboto", Arial, Helvetica, sans-serif !important;
	font-size: 0.85rem !important;
	color: var(--font-color) !important;
	text-align: left;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

body &gt; #page_wrapper {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	background-color: #fff;
	width: 100%;
	text-align: left;
	min-width: 800px;
}

button:focus,
a:focus,
.btn:focus,
input:focus {
	outline: none !important;
	box-shadow: none !important;
}

a, a[href], a[onclick], .link, .light_blue_link, a.light_blue_link, a.light_blue_link:link, a.light_blue_link:visited {
	text-decoration: none;
	color: var(--primary-color);
}
a:hover, a[href]:hover, a[onclick]:hover, .link:hover, a:not([href]):not([class]):hover, .light_blue_link:hover {
	color: var(--primary-color-hover);
	text-decoration: underline;
}
a.button:hover {
	text-decoration: none;
}

.link_no_underline,
a.link_no_underline,
a.link_no_underline[onclick],
a.link_no_underline[href] {
	color: var(--font-color);
	cursor: pointer;
	text-decoration: none;
}
.link.link_no_underline:hover,
a.link_no_underline:hover {
	text-decoration: none;
}
.icon_button {
	cursor: pointer;
}
a.light_bg_on_hover,
.light_bg_on_hover &gt; a {
	text-decoration: none;
}
.light_bg_on_hover:hover,
.light_bg_on_hover.active,
a[href].light_bg_on_hover:hover {
	background-color: var(--light-bgcolor-hover);
	text-decoration: none;
}

button,
.button,
a.button {
	padding: 0.6rem 0.75rem;
	font-size: 0.8rem;
	display: inline-block;
	margin: 0 2px;
	color: #fff;
	border-width: 1px;
	border-style: solid;
	border-radius: 0.15rem;
	vertical-align: middle;
	line-height: normal;
	font-weight: normal;

	/* temp added */
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}

.button.button_primary {
	color: #fff;
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}
.button.button_primary:hover {
	color: #fff;
	background-color: var(--primary-color-hover);
	border-color: var(--primary-color-hover);
}
.button.button_secondary,
a.button.button_secondary {
	color: #fff;
	background-color: var(--secondary-color);
	border-color: var(--secondary-color);
}
.button.button_secondary:hover {
	color: #fff;
	background-color: var(--secondary-color-hover);
	border-color: var(--secondary-color-hover);
}
.button.button_positive {
	color: #fff;
	background-color: #0da156;
	border-color: #0da156;
}
.button.button_positive:hover {
	color: #fff;
	background-color: #0da156e6;
	border-color: #0c9550e6;
}
.button.button_negative {
	color: #fff;
	background-color: #ff3535;
	border-color: #ff3535;
}
.button.button_negative:hover {
	color: #fff;
	background-color: #ff3535e6;
	border-color: #ff3535e6;
}
.button.button_light,
.button.button_default {
	color: #323a46;
	background-color: #f7fbff;
	border-color: #f7fbff;
}
.button.button_light:hover,
.button.button_default:hover {
	color: #323a46;
	background-color: #f7fbffe6;
	border-color: #f7fbff;
}
.button.button_warning {
	color: #fff;
	background-color: #f8bc2c;
	border-color: #f8bc2c;
}
.button.button_warning:hover {
	color: #fff;
	background-color: #f8bc2ce6;
	border-color: #f8bc2c;
}
.button.button_info {
	color: #fff;
	background-color: #20a6cf;
	border-color: #20a6cf;
}
.button.button_info:hover {
	color: #fff;
	background-color: #20a6cfe6;
	border-color: #20a6cf;
}
.button_primary.button_outlined {
	color: var(--primary-color);
	border-color: var(--primary-color);
	background-color: #fff;
}
.button_primary.button_outlined:hover {
	color: var(--primary-color);
	background-color: var(--light-primary-color);
}
.button.button_secondary.button_outlined {
	color: var(--secondary-color);
	border-color: var(--secondary-color);
	background-color: #fff;
}
.button.button_secondary.button_outlined:hover {
	color: var(--secondary-color);
	background-color: var(--light-secondary-color);
}
.button.button_sm {
	padding: 0.45rem 0.6rem;
	font-size: 0.75rem;
}
.button.button_xs {
	padding: 0.3rem 0.4rem;
	font-size: 0.7rem;
}
/* clickable icons */
a.link_primary, a.link_primary.disabled {
	text-decoration: none;
	color: var(--primary-color) !important;
}
a.link_primary:hover {
	text-decoration: none;
	color: var(--primary-color-hover) !important;
}
.link_positive, .link_positive.disabled {
	font-size: 1rem;
	color: #0da156 !important;
}
.link_positive:hover {
	color: #0da156e6 !important;
}
.link_negative, .link_negative.disabled {
	font-size: 1rem;
	color: #ff3535 !important;
}
.link_negative:hover {
	color: #ff3535e6 !important;
}
.link_primary.disabled, .link_positive.disabled, .link_negative.disabled {
	cursor: default !important;
	pointer-events: none;
	opacity: 0.5;
}
.link_primary.disabled.enable_title, .link_positive.disabled.enable_title, .link_negative.disabled.enable_title {
	pointer-events: auto;
}
/* @end */

img.logo {
	float: left;
    margin: 0;
}
div.navigation {
	width: 100%;
	min-height: 30px;
	min-width: 800px;
	margin-bottom: 20px;
}
div.navigation ul.tierone {
	padding: 1px 0;
	width: 100%;
	background: #d3cfce;
	margin: 0;
}
div.navigation ul.tierone li {
	display: inline;
	margin: 1px 0 1px 10px;
}
div.navigation ul.tierone li a {
	text-align: center;
	padding: 3px 4px;
	margin: 0;
}

div.navigation ul.tiertwo {
	margin: 0;
	background: #ccc;
	color: #000;
}
div.navigation ul.tiertwo li {
	display: inline;
	margin: 0 10px 0 0;
	padding: 0;
}
div.navigation ul.tiertwo li a:link,
div.navigation ul.tiertwo li a:visited,
div.navigation ul.tiertwo li a:hover {
	color: #000;
}
div.navigation ul.tierone li a:link,
div.navigation ul.tierone li a:hover,
div.navigation ul.tierone li a:visited {
	color: #fff;
}
div.navigation ul.tierone li a:hover,
div.navigation ul.tiertwo li a:hover {
	text-decoration: underline;
}
div.navigation ul.tierone li.tier_on {
	background: #ccc;
	margin: 0 0 0 10px;
	padding: 1px 0;
}
div.navigation ul.tierone li.tier_on a {
	color: #000;
}
ul.supernavi {
	float: right;
}
ul.supernavi li {
	color: #fff;
	display: inline;
	padding-left: 3px;
	padding-right: 3px;
}

ul.supernavi li a:link,
.supernavi li a:visited {
	text-decoration: underline;
	color: blue;
}
ul.supernavi li a:hover {
	text-decoration: none;
	color: red;
}
.design1 {
	width: 100%;
	background-color: var(--secondary-color);
	font-size: 0.9em;
	color: #fff;
	padding-left: 10px;
}

.design1 a {
	color: #fff;
}

.helpmenu a {
	color: #ffffff;
	text-decoration: none;
}

.breadcrumb a {
	color: #ffffff;
	text-decoration: none;
}

.pagetitle {
	font-size: 1rem;
	line-height: 2;
	font-weight: bold;
}

.subtitle {
	font-size: 0.9rem;
	line-height: 2;
	font-weight: bold;
}
a.subtitle {
	color: var(--font-color);
	text-decoration: none;
}
a.subtitle:hover {
	text-decoration: none;
}

.headresults {
	background-color: #eaeaea;
	color: #fff;
	font-size: 0.9em;
}

th.headresults {
	color: var(--font-color);
}
.headresultsort {
	color: #fff;
	font-size: 1em;
}

.headresults a {
	color: #fff;
	padding-bottom: 2px;
	padding-top: 2px;
}

.totals {
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 2px;
	color: #efefef;
	font-weight: bold;
}

.buttonsq {
	color: #ddd;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttonstyle a {
	color: #fff !important;
	float: left;
	text-align: center;
	text-decoration: none;
	border: 1px solid #333;
}

.buttonstyle a:hover {
	color: #fff !important;
	text-decoration: none;
	background-color: rgba(27, 31, 35, 0.3);
}
.buttonstyle a:active {
	background-color: rgba(27, 31, 35, 0.3);
	color: #fff !important;
	text-decoration: none;
}
.buttonsq a {
	color: #fff;
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.footer {
	color: #efefef;
	width: 100%;
	font-size: x-small;
}

.footermenu {
	padding-left: 5px;
	padding-right: 5px;
	color: #efefef;
	font-size: x-small;
	text-align: left;
}

.footermenu a {
	color: #ffffff;
	text-decoration: none;
}

.frontier {
	font-style: italic;
	padding-left: 5px;
	padding-right: 5px;
	color: #efefef;
	font-size: x-small;
	text-align: right;
}

.frontier a {
	color: #fff;
	text-decoration: none;
}

.results {
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	border: 1px solid #e7e7e7;
}

.buttonsq a:hover {
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.markbox {
	float: right;
	padding: 6px 10px 3px 15px;
}

span.tip_assist {
	color: #989898;
}

.alert:not(.alert-info):not(.alert-success) {
	color: #cc0000;
	font-weight: bold;
}

.description:link,
.description:visited {
	text-decoration: underline;
}

.break {
	clear: both;
	overflow: hidden;
	line-height: 0px;
	font-size: 0px;
}

.content {
	padding: 15px;
}

.pagination {
	text-align: right;
	padding-top: 5px;
	font-weight: bold;
	opacity: 1 !important;
	overflow: hidden;
}
.pagination &gt; table {
	margin-bottom: 10px;
}
.pagination &gt; table table td {
	padding: 0;
	vertical-align: middle;
}
.pagination table table td &gt; a[href] {
	display: inline-block;
	padding: 4px 8px;
	color: var(--font-color);
}
.pagination table table td &gt; a[href] &gt; i {
	padding-top: 4px;
}
.pagination table table th {
	color: #fff;
	background-color: var(--primary-color);
	border-color: var(--primary-color);
	padding: 0 8px;
	font-weight: normal;
	vertical-align: middle;
}
.pagination table table td &gt; a[href]:hover {
	text-decoration: none;
	background-color: var(--light-bgcolor-hover);
}

.info_msg {
	color: #efefef;
	font-weight: bold;
}

.description {
	font-size: 10px;
	color: var(--font-color);
}
.resultdetail {
	text-align: left;
}

.resultcontrols {
	width: 100%;
}

.infoicon {
	background-image: url(/images/info-icon.gif);
	background-repeat: no-repeat;
	height: 18px;
	width: 14px;
}

.totals a {
	color: #ffffff;
	text-decoration: none;
}

.buttonsqsla1 {
	height: 15px;
	width: 15px;
	color: #ddd;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}
.buttonsqsla1 a {
	height: 15px;
	width: 15px;
	color: #ddd;
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttonsqsla1 a:hover {
	height: 15px;
	width: 15px;
	color: #ddd;
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttonsqsla2 {
	height: 15px;
	width: 15px;
	color: #ddd;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttonsqsla2 a {
	height: 15px;
	width: 15px;
	color: #ddd;
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttonsqsla2 a:hover {
	height: 15px;
	width: 15px;
	color: #ddd;
	float: left;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
}

.buttoneach {
	float: left;
	text-align: center;
	margin-right: 5px;
}

.buttonicon {
	float: left;
	text-align: center;
}

.top {
	width: 100%;
	margin: 0;
	padding: 0;
}

noscript div {
	position: relative;
	top: 15px;
	border: 1px dotted #ff2700;
	height: 100%;
	width: 95%;
	background-color: #ffffcd;
	font-size: 1em;
	margin-left: auto;
	margin-right: auto;
	padding: 10px;
}
noscript div &gt; div {
	color: #c60c30;
	width: 98%;
	border-left: none;
	border-right: none;
	border-top: none;
	border-bottom: 1px solid #ccc;
	font-size: 1.1em;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 0;
}

img {
	border: none;
}
.helpImage {
	position: relative;
	float: right;
	text-decoration: none;
}
.helpImage a {
	text-decoration: none;
	font-size: 0.9rem;
}
.helpImage img[src="/images/helpimage.gif"] {
	display: none;
}
.helpImage &gt; a::after {
	font-size: 1.25rem;
	font-family: "Font Awesome 5 Free";
	content: "\f059";
	font-weight: 900;
	background-color: transparent;
	vertical-align: middle;
	color: var(--primary-color);
	margin-left: 4px;
}
.helpImage a,
.helpImage a:hover {
	text-decoration: none;
}
.del_pref_section,
.del_pref_confirm {
	margin-top: 10px;
	margin-bottom: 5px;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
	border-bottom: 1px solid #ccc;
}
.del_pref_section div {
	margin-top: 2px;
	margin-bottom: 2px;
}
div.email_section {
	position: relative;
	left: 50px;
}
div.email_section a.subheaders,
a.subheaders {
	font-weight: 800;
}
div.delivery_form_section {
	padding: 0;
	margin: 0;
}
div.delivery_form_section ul {
	display: block;
}
div.delivery_form_section ul li {
	float: left;
	display: inline;
	width: 200px;
}
.del_pref_section label,
.del_pref_section input.text {
	width: 150px;
	margin-bottom: 10px;
}

.del_pref_section label {
	text-align: right;
	width: 200px;
	padding-right: 5px;
	vertical-align: middle;
	top: 2px;
}

.del_pref_section br {
	clear: both;
}
.del_pref_section_email {
	border: none;
}
.reset {
	clear: both;
}
.reset input {
	float: none;
	display: inline;
}
.del_pre_section li {
	padding-right: 5px;
	padding-left: 5px;
}
.strong {
	font-size: 0.9rem;
	font-weight: bold;
}
ul.align_cc_headers {
	float: none;
}
ul.align_cc_headers span {
	margin: 0;
	padding: 0;
}
div#diff3 div {
	margin: 0;
}
div#diff3 div ul li {
	position: relative;
	float: none;
	left: 0;
	top: 10px;
	width: 250px;
	margin: 0 15px 0 0;
	padding: 0 30px 0 0;
}
div#diff3 div ul li span,
div#diff3 div ul li a {
	position: relative;
	left: -40px;
}
div#diff3 ol {
	margin: 0;
	padding: 0;
}
div#diff3 ol li input {
	width: 250px;
}
#form_submit {
	margin-left: auto;
	margin-right: auto;
	width: 400px;
}
#form_button {
	margin-left: auto;
	margin-right: auto;
	width: 300px;
}
#form_submit div div {
	margin-left: 10px;
	margin-right: 10px;
}
.clear {
	overflow: hidden;
	width: 100%;
}
#help_div {
	float: right;
	padding-right: 25px;
}
hr {
	display: none;
}
.reset_font_size {
	font-size: 1em;
}
.instruction_text {
	font-size: 0.91em;
	color: var(--font-color);
	width: 95%;
	margin-right: 5px;
}

/* @group Bulk Enrollment */

span.in_queue a {
	color: #007ac9;
	font-weight: 900;
}
div#customer_numbers_wrapper {
	width: 455px;
	margin: 0 auto;
}
div#policies_table,
div.completed_table {
	height: 150px;
	overflow: auto;
	width: 450px;
	margin: 0 auto;
	border: 1px solid #e3e3e3;
}
div#policies_table table,
div.completed_table table {
	width: 100%;
}
div#policies_table table tr td,
div.completed_table table tr td {
	height: 25px;
}
div#policies_table table tr,
div.completed_table table tr {
	border-right: 1px solid #ccc;
}
div#policies_table table tr:hover,
iv.completed_table table tr:hover {
	background: #eee;
}
div.successful_table {
	border: 1px solid #008900;
}
div.failed_table {
	border: 1px solid #8a0000;
}
div#queue_wrapper {
	position: relative;
	width: 560px;
	margin: 0 auto;
	height: 350px;
}
div#add_wrapper {
	padding: 0;
	width: 410px;
	float: none;
	margin: 0 auto;
}
div#queue_table {
	position: absolute;
	right: 10px;
}
div#queue_table div {
	margin-top: 10px;
	width: 120px;
	max-height: 300px;
	overflow: auto;
	border: 1px solid #e2e2e2;
}
div#queue_table a {
	font-size: 0.9em;
}
div.queue_set table#set_consolidation_info {
	position: absolute;
	left: 0;
	margin: 0 10px;
}
div#add_table {
	width: 120px;
	max-height: 300px;
	overflow: auto;
}
div#add_table table {
	border: 1px solid #e3e3e3;
}
div.policies_table col,
div.completed_table col {
	width: 33%;
	border-right: 1px solid #e2e2e2;
}
col.vzebra_odd {
	background: #effbfd;
}
div#add_customer_divider {
	height: 1px;
	width: 100%;
	background: #e2e2e2;
}
.booking_wrapper {
	width: 460px;
	margin: 0 auto;
}
.booking_wrapper input {
	border: 1px #fff solid;
	background: none;
}
.booking_wrapper h3 {
	font-size: 1.3em;
	font-weight: 800;
}
.verify_wrapper {
	margin: 0 auto;
	width: 600px;
	overflow: auto;
}
.verify_wrapper table {
	width: 100%;
	border: 1px solid #e3e3e3;
}
.verify_wrapper table th {
	text-align: center;
	color: #fff;
}
div.table_wrapper {
	margin: 0 auto;
	width: 600px;
}
div.table_wrapper p {
	padding: 10px 5px 10px 10px;
}
div.bookings_list {
	width: 300px;
}
div.bookings_list p {
	margin: 0;
	padding: 2px;
	float: left;
	width: 100px;
}
div.bookings_list label,
div.step1_wrapper label {
	float: right;
	padding: 0;
	margin: 0;
}
h4.success_green {
	font-weight: 800;
	color: #008900;
}
h4.failed_red {
	font-weight: 800;
	color: #8a0000;
}
.float_right {
	float: right;
}
.background_red {
	background: #8a0000;
}

/* @end */

/* @group notifications_ui */
div#notifications {
	width: 800px;
	margin: 0 auto;
}
div.note_table,
div.verify_table {
	width: 800px;
	margin: 10px auto;
}
div.note_table table,
div.verify_table table {
	width: 100%;
	border: 1px solid #e9e9e9;
	padding: 5px;
}
div.note_table table tbody tr,
div.verify_table table tbody tr {
	margin-top: 2px;
	margin-bottom: 2px;
}
div#notifications div.note_table table colgroup col.note_col_1,
div#notifications div.verify_table table colgroup col.note_col_1 {
	width: 25px;
}
div#notifications div.note_table table colgroup col.note_col_2 {
	width: 100%;
}

div#notifications div.note_table table colgroup col.note_col_3 {
	width: 100px;
}
div#notifications div.verify_table colgroup col.note_col_2 {
	width: 250px;
}
div#notifications div.verify_table colgroup col.note_col_3 {
	width: 144px;
}
div#notifications div.verify_table colgroup col.note_col_4 {
	width: 500px;
}
div#notifications form select {
	width: 125px;
}
div#notifications tr.alert_row {
	background: red;
	color: #fff;
}
div#notifications tr.alert_row td {
	border-bottom: 1px solid #fff;
}

/* @end */
div.action_bar {
	background: #f0f0f0;
	padding: 5px;
}
div.action_bar ul {
	display: inline;
}
div.action_bar ul li {
	display: inline;
	padding: 5px 10px;
	margin: 0 5px;
	border-right: 1px solid #ccc;
}
a[onclick],
.link,
.button,
a[href],
.pointer,
.btn {
	cursor: pointer;
}

button.button.disabledBtn,
.disabledBtn,
button:disabled,
a.button[disabled="disabled"],
.searchResultsTable .button:not([href]):not([onclick]) {
	background-image: none !important;
	cursor: default !important;
	pointer-events: none;
	opacity: 0.5;
}

button.button.disabledBtn:hover,
.disabledBtn:hover,
.searchResultsTable .button:not([href]):not([onclick]):hover {
	background-image: none !important;
	color: #aaa !important;
	cursor: default !important;
}

div.navigation {
	min-width: 1px;
}

input[type="text"],
input[type="password"],
input[type="number"],
input.rule_criteria_entry,
select,
textarea {
	border-radius: 4px;
	border: 1px solid #ccc;
	padding: 8px;
}
input[type="text"]:focus,
input[type="number"]:focus,
input.rule_criteria_entry:focus,
select:focus,
textarea:focus {
	outline: 0;
}

textarea {
	border-radius: 4px;
	border: 1px solid #ccc;
}
.buttonstyle .buttoneach .a {
	padding: 20px;
}
body &gt; table,
.page &gt; table {
	padding: 10px;
	background: #fff;
	border-collapse: separate;
}
.page &gt; br {
	display: none;
}
.tierone,
.tiertwo {
	display: none;
	border-bottom: 1px solid #ccc;
	background: #fff;
	box-shadow: 1px 3px 2px #d2d2d2;
}

#flex_box &gt; .page {
	border: 0;
}

.tiertwo {
	display: none;
}

.footer {
	display: none;
}

/* chosen dropdown */
.custom_chosen ~ .chosen-container-single .chosen-single {
	height: 42px;
	border-radius: 4px;
	border: 1px solid #ccc;
	background: #fff;
	font-size: 0.85rem;
}
.custom_chosen ~ .chosen-container-single .chosen-single &gt; span {
	margin: 8px 20px 8px 0;
}
.custom_chosen ~ .chosen-container-single .chosen-single &gt; div {
	margin: 8px 0;
}
.custom_chosen ~ .chosen-container-active.chosen-with-drop .chosen-single div b {
	background-position: -16px 2px;
}

div.letter_info {
	margin: 10px auto;
	width: 612px;
	padding: 15px;
	background: #f9f9f9;
	border: 1px solid #dadada;
	margin-bottom: 10px;
}

div.letter_info a {
	text-decoration: none;
}

.newSomething {
	color: green !important;
	border-radius: 4px;
	padding: 6px 20px;
	border-radius: 4px;
}
.newSomething:hover {
	color: green !important;
}
.newSomething::before {
	content: "\2A01 \0020   ";
	font-size: 1.5em;
}
div.multi_section div.section_holder {
	background: #f0f0f0;
	padding: 5px;
}

/*tabs*/
div.tab_holder {
	margin-top: 20px;
	border-bottom: 2px solid rgba(152, 166, 173, 0.2);
}
.tab {
	padding-left: 0;
}
div.tab_holder &gt; ul {
	margin: 0;
	padding-left: 10px;
	display: flex;
	flex: 1 1 auto;
	flex-wrap: wrap;
}
div.tab_holder &gt; button {
	height: 30px;
}
div.tabs ul li {
	list-style: none;
}
div.tabs ul li a {
	display: flex;
	flex: 1 0 auto;
	padding: 0 28px;
	margin: 0;
	display: block;
	line-height: 38px;
	cursor: pointer;
	text-decoration: none;
	color: var(--font-color);
}
div.tabs ul li.selected a {
	font-weight: bold;
	border-bottom: 2px solid var(--primary-color);
	color: var(--primary-color);
	margin-bottom: -2px;
}
.html_tab a:hover {
	color: var(--primary-color);
	text-decoration: none;
}
div.tabs ul li:not(.selected) a:hover {
	color: var(--font-color);
	background-color: var(--light-bgcolor-hover);
	text-decoration: none;
}
div.tabs ul li.selected a:hover,
a.nav-link:hover {
	text-decoration: none;
}
#toggle table {
	background-color: var(--light-bgcolor-hover);
	border-radius: 0.15rem;
}
#toggle td {
	padding: 0;
}
#toggle a {
	display: inline-block;
	padding: 6px 40px;
}
#toggle a:hover {
	text-decoration: none;
}
#toggle a:not([href]),
.toggle_on &gt; a {
	color: #fff;
	background-color: var(--primary-color);
	border-radius: 0.15rem;
}
#toggle a[href] {
	color: var(--font-color);
}
#toggle .divider &gt; span {
	display: none !important;
	background: transparent !important;
}
#toggle a[href]:hover,
.toggle_off &gt; a:hover {
	filter: brightness(50%);
}

/*PICKADAY CSS*/

.pika-single {
	z-index: 9999;
	display: block;
	position: relative;
	color: #333;
	background: #fff;
	border: 1px solid #ccc;
	border-bottom-color: #bbb;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.pika-single:after,
.pika-single:before {
	content: " ";
	display: table;
}
.pika-single:after {
	clear: both;
}
.pika-single.is-hidden {
	display: none;
}
.pika-single.is-bound {
	position: absolute;
	box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.5);
}
.pika-lendar {
	float: left;
	width: 240px;
	margin: 8px;
}
.pika-title {
	position: relative;
	text-align: center;
}
.pika-label {
	display: inline-block;
	position: relative;
	z-index: 9999;
	overflow: hidden;
	margin: 0;
	padding: 5px 3px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 700;
	background-color: #fff;
}
.pika-title select {
	cursor: pointer;
	position: absolute;
	z-index: 9998;
	margin: 0;
	left: 0;
	top: 5px;
	filter: alpha(opacity=0);
	opacity: 0;
}
.pika-next,
.pika-prev {
	display: block;
	cursor: pointer;
	position: relative;
	outline: 0;
	border: 0;
	padding: 0;
	width: 20px;
	height: 30px;
	text-indent: 20px;
	white-space: nowrap;
	overflow: hidden;
	background-color: transparent;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 75% 75%;
	opacity: 0.5;
}
.pika-next:hover,
.pika-prev:hover {
	opacity: 1;
}
.is-rtl .pika-next,
.pika-prev {
	float: left;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==);
}
.is-rtl .pika-prev,
.pika-next {
	float: right;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=);
}
.pika-next.is-disabled,
.pika-prev.is-disabled {
	cursor: default;
	opacity: 0.2;
}
.pika-select {
	display: inline-block;
}
.pika-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	border: 0;
}
.pika-table td,
.pika-table th {
	width: 14.285714285714286%;
	padding: 0;
}
.pika-table th {
	color: #999;
	font-size: 12px;
	line-height: 25px;
	font-weight: 700;
	text-align: center;
}
.pika-button {
	cursor: pointer;
	display: block;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	outline: 0;
	border: 0;
	margin: 0;
	width: 100%;
	padding: 5px;
	color: var(--font-color);
	font-size: 12px;
	line-height: 15px;
	text-align: right;
	background: #f5f5f5;
}
.pika-week {
	font-size: 11px;
	color: #999;
}
.is-today .pika-button {
	color: #3af;
	font-weight: 700;
}
.has-event .pika-button,
.is-selected .pika-button {
	color: #fff;
	font-weight: 700;
	background: #3af;
	box-shadow: inset 0 1px 3px #178fe5;
	border-radius: 3px;
}
.has-event .pika-button {
	background: #005da9;
	box-shadow: inset 0 1px 3px #0076c9;
}
.is-disabled .pika-button,
.is-inrange .pika-button {
	background: #d5e9f7;
}
.is-startrange .pika-button {
	color: #fff;
	background: #6cb31d;
	box-shadow: none;
	border-radius: 3px;
}
.is-endrange .pika-button {
	color: #fff;
	background: #3af;
	box-shadow: none;
	border-radius: 3px;
}
.is-disabled .pika-button,
.is-outside-current-month .pika-button {
	pointer-events: none;
	cursor: default;
	color: #999;
	opacity: 0.3;
}
.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
	color: #333; /*background:#4b5208;*/
	box-shadow: none;
	border-radius: 3px;
}
.pika-table abbr {
	border-bottom: none;
	cursor: help;
}

div.tabs ul li a:hover {
	text-decoration: none;
}

a.button.red,
button.button.red {
	background-image: -webkit-linear-gradient(top, #d9534f 0, #c12e2a 100%);
	background-image: -o-linear-gradient(top, #d9534f 0, #c12e2a 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#d9534f), to(#c12e2a));
	background-image: linear-gradient(to bottom, #d9534f 0, #c12e2a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	background-repeat: repeat-x;
	border-color: #b92c28;
	color: #fff !important;
	text-shadow: 0 1px 0 #c63632;
}
a.button.red:hover,
button.button.red:hover {
	background-color: #c12e2a;
	background-position: 0 -15px;
}
a.button.red:active,
button.button.red:active {
	background-color: #c12e2a;
	border-color: #b92c28;
	background-image: none;
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
a.button.red.disabledBtn,
button.button.red.disabledBtn {
	opacity: 0.5;
	background-color: #c12e2a !important;
	background-image: none;
	background-position: 0 -15px;
}

div.results table tr td div.buttonsq {
	overflow: visible !important;
	margin: 0px 10px;
}

select[multiple] {
	min-height: 100px;
	min-width: 80px;
}

.confTitle {
	font-size: 18px !important;
	margin-bottom: 10px !important;
}
.confText {
	margin-bottom: 20px !important;
}
.sa-button-container {
	margin-bottom: 25px !important;
}

.topinfo_tooltip_icon {
	position: relative;
	color: var(--secondary-color);
	display: inline-block;
	margin-left: 2px;
}

.topinfo_tooltip_icon .topinfo_tooltiptext_icon {
	visibility: hidden;
	width: 250px;
	background-color: black;
	color: #fff;
	text-align: left;
	border-radius: 4px;
	padding: 5px;
	position: absolute;
	z-index: 1;
	top: 140%;
	margin-left: -28px;
}

.topinfo_tooltip_icon .topinfo_tooltiptext_icon::after {
	content: "";
	position: absolute;
	bottom: 100%;
	right: 90%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent black transparent;
}

.topinfo_tooltip_icon:hover .topinfo_tooltiptext_icon {
	visibility: visible;
}

.cedarPopover {
	width: 160px;
	position: absolute;
	background-color: #ffffff;
	border-radius: 4px;
	border: 1px solid #cccccc;
	z-index: 999;
	box-shadow: rgba(0, 0, 0, 0.3) 0 2px 10px;
}

.cedarPopover .cedarPopoverContent {
	text-align: left;
	font-size: 13px;
	line-height: 1.2;
}

.cedarPopover .cedarPopoverContent .popoverHeader {
	border-bottom: 1px solid #cccccc;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	background-color: #f2f2f2;
	padding: 6px 8px;
	font-weight: bold;
	color: #666666;
}

.cedarPopover .cedarPopoverContent .popoverBody {
	padding: 10px 8px;
}

.cedarPopover .cedarPopoverContent .popoverBody a {
	color: var(--primary-color);
}

.cedarPopover.bottomPopover .cedarPopoverContent:before {
	content: "";
	display: block;
	position: absolute;
	left: 46%;
	bottom: 100%;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	border-bottom-color: black;
}

.cedarPopover.bottomPopover .cedarPopoverContent:after {
	content: "";
	display: block;
	position: absolute;
	left: 46%;
	bottom: 100%;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	border-bottom-color: #f2f2f2;
}

.cedarPopover.leftPopover .cedarPopoverContent:before {
	content: "";
	display: block;
	position: absolute;
	top: 10px;
	left: 100%;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	border-left-color: black;
}

.cedarPopover.leftPopover .cedarPopoverContent:after {
	content: "";
	display: block;
	position: absolute;
	top: 10px;
	left: 100%;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	border-left-color: #f2f2f2;
}

.cedarPopover.noArrow .cedarPopoverContent:before,
.cedarPopover.noArrow .cedarPopoverContent:after {
	display: none;
}

div.sticky {
	position: -webkit-sticky; /* Safari */
	position: sticky;
	top: 70px;
}

.short_name {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

a.disabled {
	color: #dddddd !important;
}
.hide_on_empty:empty {
	display: none;
}
.navigation_button {
	margin-top: 50px;
	margin-bottom: 50px;
}

/* --------------------------------------------------------------- */
/* NEW UI */
a.version_status {
	color: #fff;
}
a[href="#top"] {
	display: none;
}
a#showsf {
	color: var(--primary-color) !important;
	display: inline-block;
	margin-bottom: 10px;
}
#searchFields &gt; #genericSearch &gt; table &gt; tbody &gt; tr &gt; td,
#searchFields &gt; #search_form &gt; table &gt; tbody &gt; tr &gt; td,
#searchFields &gt; table &gt; tbody &gt; tr &gt; td,
#searchFields &gt; form &gt; table &gt; tbody &gt; tr &gt; td {
	padding: 6px 8px;
}
#searchFields input[type="text"] {
	width: 240px;
}
#searchFields select {
	width: 240px;
}
#searchFields &gt; #advanceUserSearch &gt; table &gt; tbody &gt; tr &gt; td {
	padding: 6px 8px;
}
#entry_fields table td,
#entryFields table td {
	padding: 6px 8px;
	vertical-align: top;
}
#entry_fields input[type="text"],
#entryFields input[type="text"] {
	width: 240px;
}
#entry_fields select,
#entryFields select {
	width: 240px;
}
#entry_fields textarea,
#entryFields textarea {
	width: 100%;
}
/* form field title */
.form-field-title{
	font-weight: bold;
	font-size: 1rem;
}

input[type="checkbox"],
input[type="radio"] {
	margin-right: 4px;
}
label &gt; input[type="checkbox"],
label &gt; input[type="radio"] {
	vertical-align: middle;
}
label &gt; input[type="checkbox"] + span,
label &gt; input[type="radio"] + span {
	vertical-align: middle;
}
table.genericSearchFieldsTable {
	margin-top: 10px;
}

table.genericSearchFieldsTable td {
	padding: 4px 4px 10px;
}

.message_container {
	width: 520px;
	border-radius: 6px;
	margin: 20px auto;
	padding: 12px;
	text-align: center;
	font-weight: bold;
}
.info_message_container {
	border: 1px solid #bee5eb;
	color: #0c5460;
	background-color: #d1ecf1;
}
.error_message_container {
	border: 1px solid #f5c6cb;
	color: #cc0000;
	background-color: #f8d7da;
}
.success_message_container {
	color: #155724;
	background-color: #d4edda;
	border-color: #c3e6cb;
}
.warning_message_container {
	color: #856404;
	background-color: #fff3cd;
	border-color: #ffeeba;
}
.info_message_container .message_icon {
	display: none;
}

.ui-message-box {
	border-radius: 6px;
	padding: 12px;
	text-align: center;
	font-weight: bold;
	margin: 10px auto;
	width: 520px;
}
.ui-message-box:empty {
	display: none;
}
.ui-info-message-box {
	border: 1px solid #bee5eb;
	color: #0c5460;
	background-color: #d1ecf1;
}
.ui-error-message-box {
	border: 1px solid #f5c6cb;
	color: #cc0000;
	background-color: #f8d7da;
}
.ui-success-message-box {
	color: #155724;
	background-color: #d4edda;
	border-color: #c3e6cb;
}
.ui-warning-message-box {
	color: #856404;
	background-color: #fff3cd;
	border-color: #ffeeba;
}
.round-box-status {
	border-radius: 6px;
	padding: 15px;
	border: 1px solid #bee5eb;
	color: #0c5460;
	background-color: #d1ecf1;
	text-align: center;
	display: inline-block;
	margin-bottom: 20px;
}
#supernaviuser {
	color: var(--primary-color) !important;
}

#flex_box {
	margin-left: 240px;
	margin-top: 70px;
	padding-bottom: 100px;
	-webkit-transition: all 0.3s; /* Safari */
	transition: all 0.3s;
	position: absolute;
	left: 0;
	right: 0;
}
#flex_box.expanded {
	margin-left: 80px;
}
#header_bar {
	width: 100%;
	height: 70px;
	background-color: #fff;
	position: fixed;
	z-index: 1000;
	top: 0;
	left: 0;
	border-bottom: 3px solid var(--client-color);
	padding: 0 10px;
	min-width: 800px;
}

#header_bar &gt; table &gt; tbody &gt; tr &gt; td {
	padding: 0px 4px;
	vertical-align: middle;
}

#msg_drop_menu {
	width: 300px;
	padding: 15px;
	line-height: 1.15rem;
	white-space: normal;
}
#msg_box {
	position: relative;
	height: 100%;
}
#user_id_box {
	position: relative;
	height: 100%;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
#msg_drop_menu,
#user_drop_menu {
	display: none;
	text-align: left;
	font-size: 0.8rem;
}
#msg_drop_menu.open,
#user_drop_menu.open {
	display: block;
}
#user_drop_menu .dropdown-item {
	padding: 0.3rem 1rem;
}
#user_drop_menu .dropdown-item &gt; a {
	color: var(--font-color);
	display: block;
}
#user_drop_menu .dropdown-item &gt; a:hover {
	color: var(--font-color);
	text-decoration: none;
}
#msg_drop_toggle {
	position: relative;
	padding: 0.5em 1.5em;
	height: 100%;
}
#msg_drop_toggle .badge {
	position: absolute;
	top: 2px;
	right: 14px;
	padding: 0.3em 0.5em;
	font-size: 0.5rem;
	border-radius: 50%;
	background: #cc0000;
	color: white;
}
#user_drop_toggle {
	padding: 0.5em 1.5em;
	height: 100%;
}
#user_drop_toggle &gt; span {
	display: inline-block;
	margin: 17px 0;
	line-height: 100%;
	vertical-align: middle;
}
.dropdown-item {
	width: auto;
}
.dropdown-item:active {
	color: #16181b;
	background-color: #f8f9fa;
}
#msg_icon {
	font-size: 1.25rem;
}
#user_icon {
	color: var(--client-color);
	margin-right: 5px;
	font-weight: bold;
	font-size: 1.25rem;
}
#user_name {
	color: #212529;
	font-size: 0.8rem;
}
#header_bar + .content {
	margin-top: 70px;
}
.content {
	padding: 20px;
}
#left-side-menu-wrapper {
	width: 240px;
	background-color: var(--light-client-color);
	top: 0;
	bottom: 0;
	z-index: 2;
	padding-top: 70px;
	position: fixed;
	-webkit-transition: width 0.3s; /* Safari */
	transition: width 0.3s;
	display: flex;
}
#left-side-menu {
	height: 100vh;
	width: 100%;
	overflow-y: auto;
	padding: 0 0 10px 0;
	border-right: 1px solid #e1e4e8;
}
#left-side-menu-wrapper.collapsed {
	width: 76px;
}
#left-side-menu-wrapper li {
	list-style: none;
}
.customized_scroller {
	scrollbar-color: #d8d8d8 #efefef;
	scrollbar-width: thin;
}

.customized_scroller::-webkit-scrollbar {
	width: 7.5px;
}

.customized_scroller::-webkit-scrollbar-track {
	background: #efefef;
	border-radius: 4px;
}

.customized_scroller::-webkit-scrollbar-thumb {
	background: #d8d8d8;
	border-radius: 4px;
}
#nav-menu-toggle {
	border-bottom: 1px solid #ccc;
	font-size: 1rem;
	text-align: center;
	position: sticky;
	top: 0;
	background-color: var(--light-client-color);
	z-index: 3;
}
#nav-menu-toggle &gt; div.icon_button {
	margin: 10px auto;
}
.nav-menu-list {
	padding: 5px 0;
	font-size: 0.85rem;
	text-align: center;
	margin-bottom: 80px;
}
.nav-menu-list li a {
	vertical-align: top;
	display: inline-block;
	color: var(--font-color) !important;
	cursor: pointer;
}
.nav-menu-item &gt; a[aria-expanded="true"] {
	font-weight: bold;
}
.nav-menu-list li a:hover {
	color: var(--font-color);
}
li.side-nav-item {
	padding: 0.2em 0;
}
.side-nav-item:not(.active_first_tier_menu):hover {
	background-color: var(--light-bgcolor-hover);
}
.nav-menu-item {
	width: 180px;
	display: inline-block;
	margin-top: 2px;
	vertical-align: top;
	text-align: left;
}
.nav-menu-item &gt; a {
	width: 180px;
	line-height: 22px;
	position: relative;
}
#left-side-menu-wrapper.collapsed .nav-menu-item {
	display: none;
}
#left-side-menu-wrapper .active_first_tier_menu {
	background-color: rgba(0, 0, 0, 0.09);
}
ul.side-nav-second-level {
	padding-left: 0;
}
ul.side-nav-second-level li {
	padding: 0.4em 0.3em;
	word-wrap: break-word;
}
ul.side-nav-second-level li:hover {
	background-color: var(--light-bgcolor-hover);
}
.side-nav-second-level li &gt; a {
	width: 100%;
}
.nav-menu-name {
	display: inline-block;
	padding: 0.4em 0.9em 0.4em 0.1em;
	line-height: 1.2;
}
.side-nav-second-level-dropdown {
	position: absolute;
	display: none;
	width: 180px;
	text-align: left;
	background-color: var(--light-client-color);
}
.side-nav-second-level-dropdown &gt; div {
	background-color: rgba(0, 0, 0, 0.05);
}
.side-nav-second-level-dropdown ul {
	padding: 4px 0;
}
.side-nav-second-level-dropdown .dropdown-header:hover,
.side-nav-second-level-dropdown li:hover {
	background-color: var(--light-bgcolor-hover);
}
.side-nav-second-level-dropdown li a {
	display: block;
	width: 100%;
	padding: 6px 10px;
}
.side-nav-second-level-dropdown .dropdown-divider {
	border-color: #cccccc;
	margin: 0.2rem 0;
}
#left-side-menu-wrapper .dropdown-header {
	padding: 2px 0 0;
	white-space: normal;
	color: var(--font-color);
}
#left-side-menu-wrapper .dropdown-header &gt; a {
	display: block;
	padding: 6px 10px;
}
#left-side-menu-wrapper:not(.collapsed) .dropdown-header,
#left-side-menu-wrapper:not(.collapsed) .dropdown-divider {
	display: none;
}
.expandable .menu-arrow {
	font-size: 0.8rem;
	position: absolute;
	top: 8px;
	right: 4px;
}

.dropdown-toggle::after {
	content: "";
}
a[href="#top"] {
	display: none;
}

/* loading overlay */
#loading_overlay {
	display: none;
}
#loading_bg {
	z-index: 100000;
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #ffffff;
	opacity: 0.8;
}
#loading_content {
	width: 240px;
	font-size: 0.8rem;
	z-index: 100010;
	display: block;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -50px;
	margin-left: -120px;
	text-align: center;
	opacity: 1;
}
/* END of loading overlay */

/* Form fields */
.ruleitem_criteria [src="/images/calendar.gif"] {
	margin-top: 10px;
}

.pure-material-textfield-outlined {
	position: relative;
	font-family: var(--pure-material-font, "Roboto", "Segoe UI", BlinkMacSystemFont, system-ui, -apple-system);
	font-size: 0.85rem;
	width: 240px;
	margin-bottom: 0.5rem;
}

.pure-material-textfield-outlined.has_error {
	width: 260px;
}

.pure-material-textfield-outlined &gt; div {
	position: relative;
	display: inline-block;
	padding-top: 4px;
	width: 240px;
}

.pure-material-textfield-outlined.full_width,
.pure-material-textfield-outlined.full_width &gt; div {
	width: 100%;
}

/* Input, Textarea */
.pure-material-textfield-outlined &gt; div &gt; input,
.pure-material-textfield-outlined &gt; div &gt; textarea,
.pure-material-textfield-outlined &gt; div &gt; select,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper {
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 12px 8px 8px;
	width: 100% !important;
	height: inherit;
	box-shadow: none; /* Firefox */
	font-family: inherit;
	font-size: 0.85rem;
	line-height: inherit;
	transition: border 0.2s, border-color 0.2s;
	resize: none;
	pointer-events: all;
}

.pure-material-textfield-outlined.no-label &gt; div &gt; input,
.pure-material-textfield-outlined.no-label &gt; div &gt; textarea,
.pure-material-textfield-outlined.no-label &gt; div &gt; select,
.pure-material-textfield-outlined.no-label &gt; div &gt; .input-wrapper {
	padding: 10px 8px;
}

.pure-material-textfield-outlined &gt; div &gt; input:not(:focus)::placeholder {
	color: transparent;
	opacity: 0; /* Firefox */
}

.pure-material-textfield-outlined &gt; div &gt; label &gt; input[type="checkbox"] {
	transform: scale(1.2);
}

.pure-material-textfield-outlined &gt; div &gt; label &gt; input[type="checkbox"] + span {
	font-size: 0.85rem;
}

.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper &gt; input[type="file"],
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper &gt; select {
	border: 0;
	padding: 0;
	width: 100%;
}

.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper &gt; input[type="file"] {
	line-height: 1.1;
}

.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper &gt; input[type="checkbox"] {
	width: auto;
}

.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.pure-material-textfield-outlined.disabled {
	pointer-events: none;
}

.pure-material-textfield-outlined.disabled &gt; div &gt; input,
.pure-material-textfield-outlined.disabled &gt; div &gt; textarea,
.pure-material-textfield-outlined.disabled &gt; div &gt; select,
.pure-material-textfield-outlined.disabled &gt; div &gt; div.input-wrapper {
	pointer-events: none;
	background-color: #e9ecef;
	color: rgba(0, 0, 0, 0.38);
}

.pure-material-textfield-outlined &gt; div input[type="text"],
.pure-material-textfield-outlined &gt; div input[type="password"],
.pure-material-textfield-outlined &gt; div &gt; select {
	height: 42px;
}

.pure-material-textfield-outlined &gt; div &gt; textarea {
	height: 120px;
}

.pure-material-textfield-outlined.has_error &gt; div &gt; input,
.pure-material-textfield-outlined.has_error &gt; div &gt; textarea,
.pure-material-textfield-outlined.has_error &gt; div &gt; select {
	border-color: #d32f2f;
}

.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.helper_text {
	width: 100%;
	font-size: 85%;
	white-space: pre-wrap;
	margin-top: 4px;
}
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.helper_text:empty {
	display: none;
}

.pure-material-textfield-outlined &gt; div input.input-with-leading-icon {
	padding-left: 30px;
}

.pure-material-textfield-outlined &gt; div input.input-with-trailing-icon {
	padding-right: 30px;
}

.pure-material-textfield-outlined &gt; div input.input-sm[type="text"],
.pure-material-textfield-outlined &gt; div input.input-sm[type="password"],
.pure-material-textfield-outlined &gt; div &gt; select.input-sm {
	height: 32px;
	font-size: 0.8rem;
}

/* Span */
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; input ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; textarea ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; select ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.input-wrapper ~ span.new-label {
	position: absolute;
	top: -2px;
	left: 0;
	display: flex;
	width: 100%;
	font-size: 90%;
	line-height: 15px;
	cursor: text;
	transition: color 0.2s, font-size 0.2s, line-height 0.2s, padding 0.2s;
	font-weight: normal;
	user-select: none;
}

.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; input.input-sm ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; textarea.input-sm ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; select.input-sm ~ span.new-label {
	font-size: 85%;
}

.pure-material-textfield-outlined.static-textfield &gt; div &gt; input ~ span.new-label,
.pure-material-textfield-outlined.static-textfield &gt; div &gt; textarea ~ span.new-label,
.pure-material-textfield-outlined.static-textfield &gt; div &gt; select ~ span.new-label {
	display: block;
}

.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label &gt; span,
.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label &gt; span,
.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label &gt; span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Icon */
.pure-material-textfield-outlined .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined .pure-material-textfield-outlined-trailing-icon {
	position: absolute;
	top: 18px;
	font-size: 0.95rem;
	z-index: 10;
	color: var(--primary-color);
	cursor: pointer;
	display: flex;
}
.pure-material-textfield-outlined .pure-material-textfield-outlined-leading-icon:hover,
.pure-material-textfield-outlined .pure-material-textfield-outlined-trailing-icon:hover {
	color: var(--primary-color-hover);
	text-decoration: none;
}
.pure-material-textfield-outlined .pure-material-textfield-outlined-leading-icon {
	left: 10px;
}
.pure-material-textfield-outlined .pure-material-textfield-outlined-trailing-icon {
	right: 10px;
}
.pure-material-textfield-outlined.static-textfield .pure-material-textfield-outlined-trailing-icon {
	top: 27px;
}
.pure-material-textfield-outlined .pure-material-textfield-outlined-trailing-icon-outside {
	position: absolute;
	top: 17px;
	right: 0px;
	font-size: 0.95rem;
}

/* Corners */
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; input ~ span.new-label::before,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; input ~ span.new-label::after,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; textarea ~ span.new-label::before,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; textarea ~ span.new-label::after,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; select ~ span.new-label::before,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; select ~ span.new-label::after,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.input-wrapper ~ span.new-label::before,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.input-wrapper ~ span.new-label::after {
	content: "";
	display: block;
	box-sizing: border-box;
	margin-top: 6px;
	border-top: solid 1px #aaa;
	min-width: 10px;
	height: 8px;
	pointer-events: none;
	box-shadow: inset 0 1px transparent;
	transition: color 0.2s, border 0.2s;
}

.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper ~ span.new-label::before {
	margin-right: 4px;
	border-left: solid 1px transparent;
	border-radius: 4px 0;
}

.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper ~ span.new-label::after {
	flex-grow: 1;
	margin-left: 4px;
	border-right: solid 1px transparent;
	border-radius: 0 4px;
}

.pure-material-textfield-outlined.has_error &gt; div &gt; input:not(:hover):not(:focus):not(:placeholder-shown) ~ span.new-label,
.pure-material-textfield-outlined.has_error &gt; div &gt; textarea:not(:hover):not(:focus):not(:placeholder-shown) ~ span.new-label,
.pure-material-textfield-outlined.has_error &gt; div &gt; select:not(:hover):not(:focus):not(:placeholder-shown) ~ span.new-label {
	color: #d32f2f;
}

.pure-material-textfield-outlined.has_error &gt; div &gt; input:not(:hover):not(:focus) ~ span.new-label::before,
.pure-material-textfield-outlined.has_error &gt; div &gt; input:not(:hover):not(:focus) ~ span.new-label::after,
.pure-material-textfield-outlined.has_error &gt; div &gt; textarea:not(:hover):not(:focus) ~ span.new-label::before,
.pure-material-textfield-outlined.has_error &gt; div &gt; textarea:not(:hover):not(:focus) ~ span.new-label::after,
.pure-material-textfield-outlined.has_error &gt; div &gt; select:not(:hover):not(:focus) ~ span.new-label::before,
.pure-material-textfield-outlined.has_error &gt; div &gt; select:not(:hover):not(:focus) ~ span.new-label::after {
	border-top-color: #d32f2f;
}

/* Hover */
.pure-material-textfield-outlined &gt; div &gt; input:hover,
.pure-material-textfield-outlined &gt; div &gt; textarea:hover,
.pure-material-textfield-outlined &gt; div &gt; select:hover,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper:hover {
	border-color: rgba(0, 0, 0, 0.87);
}

.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; div.input-wrapper:hover {
	border-top-color: transparent;
}

.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; input:hover:not(:focus):not(:placeholder-shown):not(:disabled):not(.disabled) ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; textarea:hover:not(:focus):not(:placeholder-shown):not(:disabled):not(.disabled) ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; select:hover:not(:focus):not(:placeholder-shown):not(:disabled):not(.disabled) ~ span.new-label,
.pure-material-textfield-outlined:not(.static-textfield) &gt; div &gt; div.input-wrapper:hover:not(:focus):not(:placeholder-shown) ~ span.new-label {
	color: rgba(0, 0, 0, 0.87);
}

.pure-material-textfield-outlined &gt; div &gt; input:hover ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea:hover ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select:hover ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input:hover ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea:hover ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select:hover ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper:hover ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; div.input-wrapper:hover ~ span.new-label::after {
	border-top-color: rgba(0, 0, 0, 0.87);
}

/* Placeholder-shown */
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; input:not(:placeholder-shown),
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; textarea:not(:placeholder-shown),
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; select:not(:placeholder-shown),.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; .input-wrapper {
	border-top-color: transparent;
}

.pure-material-textfield-outlined &gt; div &gt; input:not(:focus):placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea:not(:focus):placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select:not(:focus):placeholder-shown ~ span.new-label {
	font-size: 0.85rem;
	line-height: 54px;
	color: #aaa;
}

.pure-material-textfield-outlined &gt; div &gt; input.input-sm:not(:focus):placeholder-shown ~ span.new-label, .pure-material-textfield-outlined &gt; div &gt; textarea.input-sm:not(:focus):placeholder-shown ~ span.new-label, .pure-material-textfield-outlined &gt; div &gt; select.input-sm:not(:focus):placeholder-shown ~ span.new-label {
    font-size: 0.8rem;
	line-height: 44px;
}

.pure-material-textfield-outlined &gt; div &gt; input.input-with-leading-icon:not(:focus):placeholder-shown ~ span.new-label {
	padding-left: 16px;
}

.pure-material-textfield-outlined &gt; div &gt; input:not(:focus):placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea:not(:focus):placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select:not(:focus):placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input:not(:focus):placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea:not(:focus):placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select:not(:focus):placeholder-shown ~ span.new-label::after {
	border-top-color: transparent;
}

/* Focus */
.pure-material-textfield-outlined &gt; div &gt; input:focus,
.pure-material-textfield-outlined &gt; div &gt; textarea:focus,
.pure-material-textfield-outlined &gt; div &gt; select:focus {
	border-color: var(--primary-color);
	outline: none;
	box-shadow: none;
}
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; input:focus,
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; textarea:focus,
.pure-material-textfield-outlined:not(.no-label) &gt; div &gt; select:focus {
	border-top-color: transparent;
}

.pure-material-textfield-outlined &gt; div &gt; input:focus ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea:focus ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select:focus ~ span.new-label {
	color: var(--primary-color);
}

.pure-material-textfield-outlined &gt; div &gt; input:focus ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input:focus ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea:focus ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea:focus ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select:focus ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select:focus ~ span.new-label::after {
	border-top-color: var(--primary-color) !important;
}

/* Disabled */
.pure-material-textfield-outlined &gt; div &gt; input:disabled,
.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select:disabled,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; input.disabled,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select.disabled,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ span.new-label  {
	border-color: rgba(0, 0, 0, 0.2) !important;
	border-top-color: transparent !important;
	color: rgba(0, 0, 0, 0.5);
}

.pure-material-textfield-outlined.no-label &gt; div &gt; input:disabled,
.pure-material-textfield-outlined.no-label &gt; div &gt; input.disabled  {
	border-top-color: rgba(0, 0, 0, 0.2) !important;
}

.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ span.new-label {
	color: rgba(0, 0, 0, 0.38);
}

.pure-material-textfield-outlined &gt; div &gt; label &gt; input[type="checkbox"]:disabled + span,
.pure-material-textfield-outlined &gt; div &gt; label &gt; input[type="checkbox"].disabled + span  {
	color: rgba(0, 0, 0, 0.38);
}

.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ .pure-material-textfield-outlined-trailing-icon,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ .pure-material-textfield-outlined-trailing-icon,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ .pure-material-textfield-outlined-trailing-icon,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ .pure-material-textfield-outlined-trailing-icon,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ .pure-material-textfield-outlined-trailing-icon,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ .pure-material-textfield-outlined-trailing-icon {
	pointer-events: none;
	opacity: 0.5;
}

.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input:disabled ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select:disabled ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input.disabled ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select.disabled ~ span.new-label::after {
	border-top-color: rgba(0, 0, 0, 0.2) !important;
}

.pure-material-textfield-outlined &gt; div &gt; input:disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; input:disabled:placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled:placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select:disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; select:disabled:placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; input.disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; input.disabled:placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled:placeholder-shown ~ span.new-label,
.pure-material-textfield-outlined &gt; div &gt; select.disabled:placeholder-shown,
.pure-material-textfield-outlined &gt; div &gt; select.disabled:placeholder-shown ~ span.new-label {
	border-top-color: rgba(0, 0, 0, 0.2) !important;
}

.pure-material-textfield-outlined &gt; div &gt; input:disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input:disabled:placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea:disabled:placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select:disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select:disabled:placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; input.disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; input.disabled:placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; textarea.disabled:placeholder-shown ~ span.new-label::after,
.pure-material-textfield-outlined &gt; div &gt; select.disabled:placeholder-shown ~ span.new-label::before,
.pure-material-textfield-outlined &gt; div &gt; select.disabled:placeholder-shown ~ span.new-label::after {
	border-top-color: transparent !important;
}

.pure-material-textfield-outlined .error_msg,
.pure-material-textfield-outlined .error_icon {
	color: #d32f2f;
}

.pure-material-textfield-outlined.static-textfield span.static-value {
	display: inline-block;
	word-break: break-word;
	white-space: normal;
	margin-top: 4px;
	max-width: 500px;
}

.pure-material-textfield-outlined:not(.static-textfield) span.static-value,
.pure-material-textfield-outlined:not(.static-textfield) .edit-link {
	display: none;
}

.pure-material-textfield-outlined.static-textfield &gt; div &gt; input,
.pure-material-textfield-outlined.static-textfield &gt; div &gt; select,
.pure-material-textfield-outlined.static-textfield &gt; div &gt; textarea,
.pure-material-textfield-outlined.static-textfield &gt; div &gt; div.input-wrapper,
.pure-material-textfield-outlined.static-textfield .pure-material-textfield-outlined-leading-icon,
.pure-material-textfield-outlined.static-textfield .pure-material-textfield-outlined-trailing-icon {
	display: none;
}

.pure-material-textfield-outlined.static-textfield &gt; div &gt; span.new-label {
	font-weight: bold;
	display: block;
}

.pure-material-textfield-outlined.static-textfield &gt; div &gt; div.helper_text {
	display: none;
}

/* Faster transition in Safari for less noticable fractional font-size issue */
@media not all and (min-resolution: 0.001dpcm) {
	@supports (-webkit-appearance: none) {
		.pure-material-textfield-outlined &gt; div &gt; input,
		.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label,
		.pure-material-textfield-outlined &gt; div &gt; textarea,
		.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label,
		.pure-material-textfield-outlined &gt; div &gt; select,
		.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label,
		.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label::before,
		.pure-material-textfield-outlined &gt; div &gt; input ~ span.new-label::after,
		.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label::before,
		.pure-material-textfield-outlined &gt; div &gt; textarea ~ span.new-label::after,
		.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label::before,
		.pure-material-textfield-outlined &gt; div &gt; select ~ span.new-label::after {
			transition-duration: 0.1s;
		}
	}
}
/* End of form fields */

.bordered-container {
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 10px 8px;
}

/* table */
.standard_table_container {
	width: 100%;
	overflow: auto;
}
table.standard_table {
	table-layout: auto !important;
	border-collapse: collapse;
	white-space: nowrap;
	border-top: 1px solid #e7e7e7 !important;
	background-color: #fff;
	color: var(--font-color) !important;
	width: 100%;
}

table.standard_table &gt; tbody &gt; tr:hover {
	background-color: #f4f8fc;
}
table.standard_table &gt; tbody &gt; tr &gt; td {
	padding: 6px 8px;
	text-align: left;
	vertical-align: middle;
}

table.standard_table &gt; thead &gt; tr &gt; th {
	padding: 10px 8px;
	text-align: left;
	border-collapse: collapse;
	border-bottom: 2px solid #e7eff8;
	background-color: #e7eff8;
}

table.standard_table &gt; thead &gt; tr &gt; th,
table.standard_table &gt; tbody &gt; tr &gt; td {
	border-top: 1px solid #e7eff8;
}

table.standard_table &gt; tbody &gt; tr &gt; td &gt; {
	border-top: 0;
	padding: 0;
}
/* End of table */
.swal-overlay--show-modal .swal-modal {
	will-change: auto;
}
.swal-overlay--show-modal .swal-modal .swal-icon {
	will-change: transform;
}
.swal-text {
	color: var(--font-color);
}

/* status box */
.version_status,
.testing_status,
.status_box {
	display: block;
	width: 120px;
	text-align: center;
	padding: 5px 10px;
	color: #fff;
	border-radius: 20px;
	font-size: 0.8rem;
}

.version_status:hover,
.testing_status:hover,
a.status_box:hover,
.status_box:hover {
	text-decoration: none;
	color: #fff;
}

.statusopen {
	background-color: #990000;
}
.statusapproved {
	background-color: #99cc66;
}
.statusrejected {
	background-color: red;
}
.statuspaid {
	background-color: #6699cc;
}
.statusclosed {
	background-color: #003366;
}
.statushold {
	background-color: #ceca4e;
}
.statussuspended {
	background-color: #997ee5;
}
.statusenrolled {
	background-color: #f29e30;
}

.version_active{
	background: #34DC2C;
}
.version_draft{
	background: #666;
}
.version_rejected{
	background: red;
}
.version_cancelled, .version_cancelled_due_to_delete{
	background-color: #9f2500;
}
.version_pending, .version_in_progress, .version_pending_tier {
	background: #579dc5;
}
.version_accepted, .version_approved, .version_bulk_approved{
	background: darkblue;
}
.version_archived, .version_in_process{
	background: #D2A100;
}
.version_proofing{
	background: #dee100;
}
.version_complete, .version_completed, .version_system_completed, .version_system_approved_completed{
	background: #008300;
}
.version_in_approvals{
	background: #92b1d3;
}
.testing_complete{
	background: #a1cfb4;
}
.testing_pending, .version_merged{
	background-color: #d5a6d7;
}
.version_failed{
	background: #8a0000;
}
.version_locked{
	background: #8e0000;
}
.version_final_approval{
	background: #0061b6;
}
.version_delivery_ready{
	background: #439400;
}
.version_deleted{
	background: #000;
	color: #fff !important;
}
.version_suspended{
	background: #d36565;
}
.version_processed{
	background: #99cc66;
}
.version_not_started {
    background: #989898;
}
.version_processing, .testing_running{
	background: #92b1d3;
}


/* tickets status */
.status-created{		
	background-color:#008300;	
}
.status-assigned{		
	background-color:#F8C471;  
}
.status-work-started{			
	background-color: #579dc5;	
}	
.status-work-done{		
	background-color:darkblue;	
}
.status-closed{			
	background-color: #989898;
}	
.status-cancelled{	 
	background-color: #D23E00;
}
/* @end */
/* @end */
.section-title-light {
	background-color: var(--light-color);
	display: inline-block;
	font-size: 0.85rem;
	font-weight: bold;
	padding: 0.4rem 1.5rem;
	border-radius: 0.15rem;
}


/* bootstrap v4 styles override */
.btn-group-xs &gt; .btn,
.btn-xs {
	padding: 0.4rem;
	font-size: 0.8rem;
	line-height: 0.5;
	border-radius: 0.2rem;
}

.card-header {
	padding: 0.5rem 1.25rem;
}

.input-group-append &gt; .button {
	margin: 0;
}

.input-group &gt; .input-group-append &gt; .button,
.input-group &gt; .input-group-append &gt; .input-group-text,
.input-group &gt; .input-group-prepend:first-child &gt; .button:not(:first-child),
.input-group &gt; .input-group-prepend:first-child &gt; .input-group-text:not(:first-child),
.input-group &gt; .input-group-prepend:not(:first-child) &gt; .button,
.input-group &gt; .input-group-prepend:not(:first-child) &gt; .input-group-text {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.input-group &gt; .input-group-append:last-child &gt; .button:not(:last-child):not(.dropdown-toggle),
.input-group &gt; .input-group-append:last-child &gt; .input-group-text:not(:last-child),
.input-group &gt; .input-group-append:not(:last-child) &gt; .button,
.input-group &gt; .input-group-append:not(:last-child) &gt; .input-group-text,
.input-group &gt; .input-group-prepend &gt; .button,
.input-group &gt; .input-group-prepend &gt; .input-group-text {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.form-control {
    border: 1px solid #aaa;
    border-radius: 4px;
    padding: 10px 8px;
    height: inherit;
    font-family: inherit;
    font-size: 0.85rem;
    line-height: inherit;
    transition: border 0.2s, border-color 0.2s;
    color: var(--font-color);
}

/* END of bootstrap v4 styles override */

/* overriding jquery ui style for accordion triangle icon */
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
	font-family: "Roboto", Arial, Helvetica, sans-serif !important;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url(images/ui-icons_ef8c08_256x240.png) !important;
}
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
	background-image: url(images/ui-icons_ef8c08_256x240.png) !important;
}
.ui-accordion .ui-accordion-content a {
	color: var(--primary-color);
}
.ui-accordion .ui-state-active,
.ui-accordion .ui-state-default,
.ui-accordion .ui-state-hover {
	color: var(--font-color);
	background-color: #fff;
	border: 1px solid #ccc !important;
}
.ui-accordion .ui-state-active, .ui-accordion .ui-state-hover, .ui-accordion-header:hover {
	background-color: var(--light-bgcolor-hover);
}

.ui-accordion .ui-corner-all,
.ui-accordion .ui-corner-top {
	-webkit-border-radius: 0px !important;
	-moz-border-radius: 0px !important;
	border-radius: 0px !important;
}
/* overriding jquery ui style for accordion triangle icon */
</pre></body></html>