/**********************************************************************************************/
/* COLORS *************************************************************************************/
/**********************************************************************************************/

:root {
	--text: #4F4F4F;
	--white: #FFFFFF;
	--blue: #4DC9F5;
	--blue-1: #14214A;
	--blue-2: #005C96;
	--blue-3: #1C7493;
	--blue-4: #2487B2;
	--blue-5: #40A8D7;
	--blue-6: #80D2EA;
	--green: #1EA345; /*#1FBC7A*/
	--yellow: #FABC39;
	--orange: #EE5732;
	--orange-1: #E3642F;
	--orange-2: #EA8134;
	--orange-3: #EF9A3E;
	--orange-4: #F4A75B;
	--red: #BE1E2D;
	--purple: #9F5ABF;
	--grey: #DBDBDB;
	--grey-light-mode: #F9F9F9;
	--grey-dark-mode: #060606;
	--grey-2-light-mode: #ECECEC;
	--grey-2-dark-mode: #212121;
}

/**********************************************************************************************/
/* COLUMNS ************************************************************************************/
/**********************************************************************************************/

@media(max-width: 776px) {
    .columns.is-reversed {
        display: flex;
        flex-direction: column-reverse;
   }
}

/**********************************************************************************************/
/* DEFAULT ELEMENT STYLING ********************************************************************/
/**********************************************************************************************/

a {
	color: var(--blue-5);
}

hr {
	border-bottom: 1px solid #CCC;
}

/**********************************************************************************************/
/* STYLING HELPERS ****************************************************************************/
/**********************************************************************************************/

.clear {
	clear: both;
}

.pointer {
	cursor: pointer;
}

.center {
	text-align: center;
}

.textleft {
	text-align: left;
}

.textright {
	text-align: right;
}

.bold {
	font-weight: bold;
}

.superbold {
	font-weight: 900;
}

.thin {
	font-weight: 100 !important;
}

.italic {
	font-style: italic;
}

.underline {
	text-decoration: underline;
}

.strike {
	text-decoration: line-through;
}

.bigger,
.bigger p,
.bigger ol,
.bigger ul {
	font-size: 1.2em;
}

.smaller,
.smaller ul,
.smaller ol {
	font-size: .8em;
}

.smaller p { 
	font-size: .9em;
}

/**********************************************************************************************/
/* TEXT COLORS ********************************************************************************/
/**********************************************************************************************/

.text-white {
	color: var(--white) !important;
}

.text-green {
	color: var(--green) !important;
}

.text-yellow {
	color: var(--yellow) !important;
}

.text-orange {
	color: var(--orange) !important;
}

.text-orange-1 {
	color: var(--orange-1) !important;
}

.text-orange-2 {
	color: var(--orange-2) !important;
}

.text-orange-3 {
	color: var(--orange-3) !important;
}

.text-orange-4 {
	color: var(--orange-4) !important;
}

.text-blue {
	color: var(--blue) !important;
}

.text-blue-1 {
	color: var(--blue-1) !important;
}

.text-blue-2 {
	color: var(--blue-2) !important;
}

.text-blue-3 {
	color: var(--blue-3) !important;
}

.text-blue-4 {
	color: var(--blue-4) !important;
}

.text-blue-5 {
	color: var(--blue-5) !important;
}

.text-blue-6 {
	color: var(--blue-6) !important;
}

.text-red {
	color: var(--red) !important;
}

.text-purple {
	color: var(--purple) !important;
}

/**********************************************************************************************/
/* BACKGROUND COLORS **************************************************************************/
/**********************************************************************************************/

.bg-green {
	background-color: var(--green) !important;
}

.bg-yellow {
	background-color: var(--yellow) !important;
}

.bg-orange {
	background-color: var(--orange) !important;
}

.bg-red {
	background-color: var(--red) !important;
}

.bg-orange-1 {
	background-color: var(--orange-1) !important;
}

.bg-orange-2 {
	background-color: var(--orange-2) !important;
}

.bg-orange-3 {
	background-color: var(--orange-3) !important;
}

.bg-orange-4 {
	background-color: var(--orange-4) !important;
}

.bg-blue {
	background-color: var(--blue) !important;
}

.bg-blue-1 {
	background-color: var(--blue-1) !important;
}

.bg-blue-2 {
	background-color: var(--blue-2) !important;
}

.bg-blue-3 {
	background-color: var(--blue-3) !important;
}

.bg-blue-4 {
	background-color: var(--blue-4) !important;
}

.bg-blue-5 {
	background-color: var(--blue-5) !important;
}

.bg-blue-6 {
	background-color: var(--blue-6) !important;
}

.bg-grey-moded {
	background-color: var(--grey-light-mode) !important;
}

@media (prefers-color-scheme: dark) {
	.bg-grey-moded {
		background-color: var(--grey-dark-mode) !important;
	}
}

.bg-blue_gradient {
	background: #4FC8F4;
	background: -moz-linear-gradient(0deg, #4FC8F4 0%, #2588B2 100%);
	background: -webkit-linear-gradient(0deg, #4FC8F4 0%, #2588B2 100%);
	background: linear-gradient(0deg, #4FC8F4 0%, #2588B2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4fc8f4",endColorstr="#2588b2",GradientType=0);
}

/**********************************************************************************************/
/* BORDER COLORS ******************************************************************************/
/**********************************************************************************************/

.border-grey-moded {
	border-color: var(--grey-2-light-mode) !important;
}

@media (prefers-color-scheme: dark) {
	.border-grey-moded {
		border-color: var(--grey-2-dark-mode) !important;
	}
}

/**********************************************************************************************/
/* LEFTBAR COLORS *****************************************************************************/
/**********************************************************************************************/

.leftbar {
	border-left: 15px solid #000;
	padding-left: 15px;
	margin-bottom: 2rem;
}

.rightbar {
	border-right: 15px solid #000;
	padding-right: 15px;
	margin-bottom: 2rem;
}

.leftbar-slim {
	border-width: 7px;
}

.rightbar-slim {
	border-width: 7px;
}

.leftbar-grey,
.rightbar-grey {
	border-color: var(--grey-2-light-mode);
}

@media (prefers-color-scheme: dark) {
	.leftbar-grey,
	.rightbar-grey {
		border-color: var(--grey-2-dark-mode);
	}
}

.leftbar-blue {
	border-color: var(--blue) !important;
}

.leftbar-blue_1,
.leftbar-blue-1 {
	border-color: var(--blue-1) !important;
}

.leftbar-blue_2,
.leftbar-blue-2 {
	border-color: var(--blue-2) !important;
}

.leftbar-blue_3,
.leftbar-blue-3 {
	border-color: var(--blue-3) !important;
}

.leftbar-blue_4,
.leftbar-blue-4 {
	border-color: var(--blue-4) !important;
}

.leftbar-blue_5,
.leftbar-blue-5 {
	border-color: var(--blue-5) !important;
}

.leftbar-blue_6,
.leftbar-blue-6 {
	border-color: var(--blue-6) !important;
}

.leftbar-darkgreen {
	border-color: #1EA345;
}

.leftbar-green {
	border-color: var(--green) !important;
}

.leftbar-purple {
	border-color: var(--purple) !important;
}

.leftbar-red {
	border-color: var(--red) !important;
}

.leftbar-orange {
	border-color: var(--orange) !important;
}

.leftbar-redorange,
.leftbar-orange-1 {
	border-color: var(--orange-1) !important;
}

.leftbar-orange-2 {
	border-color: var(--orange-2) !important;
}

.leftbar-orange-3 {
	border-color: var(--orange-3) !important;
}

.leftbar-orange-4 {
	border-color: var(--orange-4) !important;
}

.leftbar-yellow {
	border-color: var(--yellow) !important;
}


/**********************************************************************************************/
/* CONTENT TAGS *******************************************************************************/
/**********************************************************************************************/

.content_tag {
	background-color: #666;
	border: 1px solid #666;
	font-size: .9em;
	padding: 1px 7px;
	margin-right: 7px;
	border-radius: 5px;
	font-weight: bold;
	color: #FFF;
	display: inline-block;
	vertical-align: bottom;
}

/**********************************************************************************************/
/* ARROWS *************************************************************************************/
/**********************************************************************************************/

div.arrow {
	width: 100%;
	padding: 10px 0;
	position: relative;
}

div.arrow hr {
	border: 0;
	border-bottom: 2px solid #000;
	margin: 0;
}

div.arrow_green hr {
	border-color: #53BA5F;
}

div.arrow:after {
	content: '';
	display: block;
	position: absolute;
	right: -2px;
	top: 1px;
	width: 0; 
	height: 0; 
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	border-left: 15px solid #53BA5F;
}

div.arrow:after {
	border-left-color: #53BA5F;	
}

/**********************************************************************************************/
/* LOADER *************************************************************************************/
/**********************************************************************************************/

.loader_icon {
	margin-bottom: 2rem;
}

.loader_show {
	display: none;
}

/**********************************************************************************************/
/* FIELDS *************************************************************************************/
/**********************************************************************************************/

.input_container {
	margin-bottom: 1rem;
}

.select {
	width: 100%;
}

.select select {
	box-shadow: inset 0 0.0625em 0.125em rgba(10,10,10,.05);
    max-width: 100%;
    width: 100%;
}

.field.inline select,
.field.inline .input {
	max-width: auto;
    width: auto;
	display: inline-block;
	vertical-align: middle;
}

/*
.field.inline select,
.npe_form.scorecard select {
	-moz-appearance: base-select;
    -webkit-appearance: base-select;
}*/

.field.inline .select::after {
	display: none;	
}

#metricsForm input[type=text].pa_metric,
#metricsSettingsForm input[type=text].pa_metric,
#business_modeling input.pa_numeric,
#business_modeling input.pa_currency,
input.pa_numeric,
input.pa_currency,
input.pa_percent {
	padding: .25rem 30px .25rem 30px;
}F

#metricsForm input.pa_currency,
#metricsSettingsForm input.pa_currency,
#business_modeling input.pa_currency,
input.pa_currency {
	background-image: url('/assets/img/global/icons/currency.png');
	background-position: 0 50%;
	background-repeat: no-repeat;
}

#metricsForm input.pa_currency.pa_uk,
#metricsSettingsForm input.pa_currency.pa_uk,
#business_modeling input.pa_currency.pa_uk,
input.pa_currency.pa_uk,
#metricsForm input.pa_currency_gbp,
#metricsSettingsForm input.pa_currency_gbp,
#business_modeling input.pa_currency_gbp,
input.pa_currency_gbp {
	background-image: url('/assets/img/global/icons/currency_pound.png');
	background-position: 0 50%;
	background-repeat: no-repeat;
}

#metricsForm input.pa_currency.pa_euro,
#metricsSettingsForm input.pa_currency.pa_euro,
#business_modeling input.pa_currency.pa_euro,
input.pa_currency.pa_euro,
#metricsForm input.pa_currency_eur,
#metricsSettingsForm input.pa_currency_eur,
#business_modeling input.pa_currency_eur,
input.pa_currency_eur {
	background-image: url('/assets/img/global/icons/currency_euro.png');
	background-position: 0 50%;
	background-repeat: no-repeat;
}

#metricsForm input.pa_currency_aed,
#metricsSettingsForm input.pa_currency_aed,
#business_modeling input.pa_currency_aed,
input.pa_currency_aed {
	background-image: url('/assets/img/global/icons/currency_aed.png');
	background-position: 0 50%;
	background-repeat: no-repeat;
}

input.pa_percent {
	background-image: url('/assets/img/global/icons/percent.png');
	background-position: 100% 50%;
	background-repeat: no-repeat;
}

.npe_form .columned,
.onboarding .columned  {
	display: inline-block;
	padding: 0 10px;
	vertical-align: top;
	float: none;
}

.npe_form .columned textarea,
.npe_form .columned .input[type="email"],
.npe_form .columned .input[type="text"],
.npe_form .columned .input[type="number"],
.onboarding .columned textarea,
.onboarding .columned .input[type="email"],
.onboarding .columned .input[type="text"],
.onboarding .columned .input[type="number"] {
	min-width: auto;
	width: 100%;
}

.npe_form .columned .question_label,
.onboarding .columned .question_label {
	font-size: .875rem;
	text-align: center;
}

.npe_form .input.type_slider {
	display: none;
}

.ui-slider .ui-slider-handle {
    width: 2.1em;
    height: 1.6em;
    font-size: 18px;
    text-align: center;
}

.ui-slider .ui-slider-handle.ui-state-active {
    background: #00AF98;
}

.stoplight_radio input[type=radio] {
    display: none;
}

.stoplight_radio label.pace { 
	width: 20px;
    height: 20px;
    position: relative;
    margin: 0.25rem !important;
	display: inline-block;
	cursor: pointer;
	border-radius: 50%;
}

.stoplight_radio label.pace.red {
	border: 2px solid var(--red);
}

.stoplight_radio label.pace.yellow {
	border: 2px solid var(--yellow);
}

.stoplight_radio label.pace.green { 
	border: 2px solid var(--green);
}

.stoplight_radio label.pace:before {
	content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #FFF;
    border-radius: 50%;
	border: 2px solid #FFF;
}
	
.stoplight_radio input[type=radio]:checked + label.pace.red:before {
	background-color: var(--red);
}

.stoplight_radio input[type=radio]:checked + label.pace.yellow:before { 
	background-color: var(--yellow); 
}

.stoplight_radio input[type=radio]:checked + label.pace.green:before { 
	background-color: var(--green); 
}


/**********************************************************************************************/
/* BORDERS ************************************************************************************/
/**********************************************************************************************/

.border-right {
	border-right: 1px solid;
	border-color: var(--bulma-border-l);
}


@media only screen and (max-width:769px) {
	.border-right {
		border-right: none;
	}
}

/**********************************************************************************************/
/* LESSONS ************************************************************************************/
/**********************************************************************************************/

.course_tile {
	width: 405px;
	display: inline-block;
	margin: .5rem;
}

.course_tile a {
	display: block;
	width: 100%;
	height: 100%;
}

.course_tile img {
	width: 100%;
}

.course_tile .progress_container {
	width: 60%;
	margin: 1rem auto;
}

.course_tile .course_image {
	position: relative;
}

.course_tile .course_image .overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.course_tile .course_image .overlay.active {
	background-color: rgba(0,0,0,.5);
}

.course_tile .course_image .overlay.active p {
	display: block;
	width: 100%;
	color: #FFF;
	text-align: center;
	font-weight: bold;
	padding: 3px 10px;
	background-color: rgba(0,0,0,.5);
}

.course_completion .progress_container,
.step_container .progress_container {
	margin-bottom: .25rem 0 1rem;
    border-radius: 0;
    background-color: #e7e7e7;
	height: 8px;
}

.course_completion .progress_bar,
.step_container .progress_bar {
	width: 0;
	background-color: #00be49;
	border-radius: 0;
	display: block;
	height: 8px;
}

.step_container .progress_container {
	max-width: 320px;
    margin: 2rem auto 0;
}

.course_completion .program_status i {
	width: 37px;
    height: 37px;
    line-height: 36px;
    background: #8a8a8a;
    color: #fefefe;
    border-radius: 50%;
    font-size: 1.1rem;
}

.course_listing {
	margin: 2rem 0;
}

.course_listing .ui-selectmenu-button {
	box-shadow: inset 0 1px 0 #2467b8;
	border: none;
    height: 54px;
    line-height: 54px;
    color: #fefefe;
    border-radius: 2px;
    padding: 0 50px 0 20px;
    font-size: 1rem;
    font-family: AvenirNextLTPro-Demi;
    background: #438ee3;
    background: linear-gradient(180deg,#438ee3 0,#3580dd);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#438ee3",endColorstr="#3580dd",GradientType=0);
}

.course_listing .ui-selectmenu-button .ui-selectmenu-text {
	line-height: 54px;
    padding: 0;
}

.course_listing .ui-selectmenu-button .ui-icon {
	background: none;
	right: 1em;
}

.course_listing .ui-selectmenu-button:after {
	content: '\f078';
    font-family: "Font Awesome 5 Free";
	font-style: normal;
    font-size: 1rem;
    color: #FFF;
    width: 18px;
    height: 18px;
    line-height: 1;
    display: block;
    position: absolute;
    text-align: center;
    top: calc(50% - 9px);
    right: 14px;
}

.additional_resources a {
	padding: 10px 40px 10px 10px;
    display: block;
    position: relative;
	background: var(--grey-2-light-mode);
    margin-bottom: 7px;
}

@media (prefers-color-scheme: dark) {
	.additional_resources a {
		background-color: var(--grey-2-dark-mode);
	}
}

.additional_resources a:after {
	content: "\f381";
    font-family: "Font Awesome 5 Free";
    color: #c0cedb;
    font-size: 1.2rem;
    position: absolute;
    top: calc(50% - 14px);
    right: 15px;
	font-weight: 900;
}

.course_lessons #lessons_list {
	margin: 2rem 0;
}

.course_lessons #lessons_list li {
	border: 0;
	background: transparent;
	padding: .65rem 0;
	font-size: .95rem;
	color: #4c4c4c;
}

.course_lessons #lessons_list li>a,
.course_lessons #lessons_list li>span {
	padding: 0 25px 0 0;
	background: transparent;
	position: relative;
	line-height: 1.2;
	font-size: .9375rem;
	color: inherit;
}

.course_lessons #lessons_list li>span {
	color: inherit;
}

.course_lessons #lessons_list li>a.completed:after,
.course_lessons #lessons_list li>span.completed:after {
	content: '\f058';
    font-family: 'Font Awesome 5 Free';
    font-size: 1.2rem;
    color: #00be49;
    width: 18px;
    height: 18px;
    line-height: 1;
    display: block;
    position: absolute;
    text-align: center;
    top: calc(50% - 9px);
    right: 0;
}

@media only screen and (min-width: 62.01em) { 
	.lesson_toggle { 
		display: none; 
	} 
}

@media only screen and (max-width: 62em) { 
	.course_lessons #learndash_course_content { 
		display: none; 
	} 
}

/**********************************************************************************************/
/* PLAYBOOKS **********************************************************************************/
/**********************************************************************************************/

.playbook_container {
	width: 100%;
}

.playbook_column {
	width: 20%;
	border: 1px solid transparent;
	vertical-align: middle;
	text-align: center;
	padding: 0 !important;
}

.playbook_header .playbook_column {
	text-align: left;
	border: 2px solid transparent;
	border-bottom: 0;
}

.playbook_column h5 {
	color: #FFF;
}

.playbook_column h6 {
	font-weight: bold;
	color: #FFF;
}

.playbook_image {
	text-align: right;
}

.playbook_image img {
	height: 80px;
	vertical-align: middle;
}

.playbook_tile {
	background-color: var(--bulma-scheme-main-l);
	text-align: center;
	font-size: .8rem;
	height: 80px;
	position: relative;
	margin: 1px;
	border: 2px solid #000;
	border-color: var(--bulma-text-tile-1);
}

.playbook_tile.in_progress {
	background-color: #F6B93A;
}

.playbook_tile.complete {
	background-color: #1EA149;
}

.playbook_tile a {
	color: var(--bulma-text-title-l);
	width: 100%;
	height: 100%;
	padding: 5px 3px;
	vertical-align: middle;
	display: flex;
	align-items: center;
	justify-content: center;
}

.playbook_tile.in_progress a {
	color: #FFF;
}

.playbook_tile.complete a {
	color: #FFF;
}

.playbook_tile.locked:before {
	display: block;
	position: absolute;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,.65);
	color: #FFF;
	font-family: 'Font Awesome 5 Free';
	content: '\f023';
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	line-height: 72px;
}

#playbook_progress-button {
	width: 125px;
	font-size: .8rem;
	font-weight: bold;
	background: transparent;
	border: 0;
	display: inline-block;
}

#playbook_progress-menu {
	border: 1px solid #999;
	box-shadow: 0 5px 5px #CCC;
}

#playbook_progress-menu .ui-menu-item {
	font-size: .8rem;
	font-weight: bold;
}

#playbook_progress-menu .ui-menu-item {
	font-size: .8rem;
	font-weight: bold;
	padding: 14px 20px;
	border: 0;
}

#playbook_progress-menu .ui-menu-item-wrapper {
	border: 0 !important;
	padding: 0;
}

#playbook_progress-menu .ui-state-active {
	font-weight: bold;
	margin: 0;
	background: transparent;
	color: #222;
}

#playbook_progress-menu .ui-menu-item:nth-child(2) {
	background-color: #F6B93A;
}

#playbook_progress-menu .ui-menu-item:nth-child(3) {
	background-color: #1EA149;
}

#playbook_progress-menu .ui-menu-item:nth-child(2) .ui-menu-item-wrapper {
	color: #FFF !important;
}

#playbook_progress-menu .ui-menu-item:nth-child(3) .ui-menu-item-wrapper {
	color: #FFF !important;
}

/*****************************************************************************************/
/* EVENTS ********************************************************************************/
/*****************************************************************************************/

.event_tile {
	/*border: 2px solid #ebeeef;
    border-radius: 5px;
    padding: 40px 10px;*/
	text-align: center;
    margin-bottom: 30px;
}

.event_tile:hover {
    /*box-shadow: 1px 2px 20px #c0cedb;
    border-color: #999ea1;*/
}

.event_tile h4 {
	font-size: 21px;
	margin-bottom: 1rem;
	font-weight: 400;
}

.event_tile h6 {
	font-size: .9rem;
	font-weight: 400;
}

.event_tile h6.day {
	color: #666;
	text-transform: uppercase;
	font-size: .85rem;
}

.event_tile h6.countdown {
	font-size: .75rem;
}

.event_tile a.button {
	margin: 1rem 0 0;
}

/**********************************************************************************************/
/* METRICS ************************************************************************************/
/**********************************************************************************************/

#metrics #trend_options {
    padding: 5px 20px;
}

#metrics table th {
    position: relative;
    white-space: nowrap;
}

#metrics table th div.new_year {
    font-size: .65rem;
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #222;
    position: absolute;
    right: -18px;
    z-index: 1;
    top: 15px;
    bottom: 0;
    height: 15px;
    width: 37px;
    text-align: center;
    vertical-align: bottom;
    font-weight: 200;
}

#metricsForm #pa_date {
    background-image: url('/assets/img/global/icons/calendar_24.png');
    background-position: 96% 50%;
	background-repeat: no-repeat;
    padding-right: 30px;
    cursor: pointer;
	max-width: 500px;
	width: 100%;
}

#metricsForm .buttons_container {
	margin: 2rem 0;
}

#metricsForm .options_container,
#metricsForm .pages_container,
#metricsForm .buttons_container {
	max-width: 500px;
}

#metricsForm .options_container>div {
	margin: 1rem 0;
}

#metricsForm .add_location {
	color: var(--green);
	cursor: pointer;
}

#metricsForm .location_radio,
#metricsForm .stream_check {
	display: block;
}

#metricsForm .location_select {
	display: inline-block;
}

#metricsForm .location_edit {
	display: none;
}

#metricsForm .location_select i {
	display: none;
	color: #CCC;
	cursor: pointer;
}

#metricsForm .location_select:hover i {
	display: inline;
}

#metricsForm .location_edit .fa-save {
	color: var(--green);
}

#metricsForm .location_edit .fa-trash-alt {
	color: var(--red);
}

#metricsForm .stream_edit {
	display: none;
	margin: 1rem 0;
}

#metricsForm .stream_edit_button {
	cursor: pointer;
}

#metricsForm .input_container {
	max-width: 450px;
	margin: 1rem 0;
}

#metricsForm .error_container {
	height: 21px;
	width: 100%;
}

#metricsForm .error_message,
#metricsForm .warning_message {
	color: #FFF;
	background-color: #FE6356;
	font-size: .7em;
	text-align: right;
	padding: .15rem .5rem;
	display: none;
	border-bottom-left-radius: 9px;
	border-bottom-right-radius: 9px;
	top: -8px;
    position: relative;
}

#metricsForm .warning_message {
	background-color: #FFBB2F;
}


/**********************************************************************************************/
/* PROGRESS BARS ******************************************************************************/
/**********************************************************************************************/


.npe_form .progress_bar {
	width: 80%;
	height: 20px;
	background-color: #BFEBE5;
	margin: 1rem auto 2rem;
	border-radius: 10px;
	clear: both;
	white-space: nowrap;
}

.npe_form .progress_bar .progress_made {
	background: #00AF98; /*-- Color of the bar --*/
	height: 20px;
	width: 0%;
	max-width: 100%;
	border-radius: 10px;
	float: left;
	-webkit-animation: progress 2s 1 forwards;
	-moz-animation: progress 2s 1 forwards;
	-ms-animation: progress 2s 1 forwards;
	animation: progress 2s 1 forwards;
	position: relative;
}

/*
.progress_bar progress_animation {
	height: 20px;
	width: 100%;
	overflow: hidden;
	background: url('/assets/img/forms/animated_progress_overlay.gif') repeat-x;
	-moz-opacity: 0.25;
	-khtml-opacity: 0.25;
	opacity: 0.25;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=25);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=25);
	filter: alpha(opacity=25);
}
*/

.npe_form .progress_bar .progress_text {
	font-size: .9em;
	font-weight: bold;
	color: #FFF;
	padding-left: 10px;
	line-height: 20px;
	display: none;
}

.npe_form .progress_bar .progress_percent {
	padding-left: 10px;
	color: #FFF;
}


/**********************************************************************************************/
/* BUTTONS ************************************************************************************/
/**********************************************************************************************/

.button {
	color: var(--white);
	border-color: var(--orange);
	background-color: var(--orange);
	font-weight: bold;
}

.button:hover {
	color: var(--white);
	border-color: var(--orange);
	opacity: .9;
}

.button.secondary {
	color: var(--orange);
	border-color: var(--orange);
	background-color: var(--bulma-scheme-main-l);
	font-weight: bold;
}

.button.secondary:hover {
	color: var(--orange);
	border-color: var(--orange);
	opacity: .9;
}

.button.grey {
	border-color: var(--grey);
	background-color: var(--grey);
}

.button.grey:hover {
	border-color: var(--grey);
}

.button.green {
	border-color: var(--green);
	background-color: var(--green);
}

.button.green:hover {
	border-color: var(--green);
}

.button.red {
	border-color: var(--red);
	background-color: var(--red);
}

.button.red:hover {
	border-color: var(--red);
}

/**********************************************************************************************/
/* HEADER *************************************************************************************/
/**********************************************************************************************/

body.has-navbar-fixed-top, html.has-navbar-fixed-top {
	padding-top: 90px;
}

.navbar-item i {
	/*margin-right: .5rem;*/
}

.navbar-item img {
	max-height: 3.5rem;
}

header.navbar {
	background-color: #515352;
    height: 90px;
    padding: 0 30px;
    position: fixed;
    width: 100%;
    z-index: 100;
    border-bottom: 10px solid #FABC39;
}

nav.navbar {
	background: transparent;
}

header.navbar .navbar-item,
header.navbar .navbar-link {
	color: var(--white);
}

header.navbar .is-active .navbar-item,
header.navbar .is-active .navbar-link {
	font-weight: bold;
}

header.navbar .navbar-dropdown i {
	width: 20px;
	text-align: center;
}

header.navbar .navbar-dropdown .navbar-item,
header.navbar .navbar-dropdown .navbar-link {
	font-weight: normal;
}

header.navbar .navbar-item.has-dropdown:hover .navbar-link {
	background-color: transparent;
}

header.navbar .navbar-item:hover,
header.navbar .navbar-item:active,
header.navbar .navbar-item:focus,
header.navbar .navbar-link:hover,
header.navbar .navbar-link:active,
header.navbar .navbar-link:focus {
	color: var(--orange);
	background-color: transparent;
}

.navbar-link:not(.is-arrowless)::after {
	border-color: var(--white);
}

.navbar-link:hover:not(.is-arrowless)::after {
	border-color: var(--orange);
}

.navbar-burger {
	color: var(--white);
	margin-top: .75rem;
}

.navbar-burger:hover {
	background: transparent;
	color: var(--orange);
}

.navbar-burger span {
	height: 2px;
	width: 20px;
	left: calc(50% - 10px);
}

.navbar-burger span:first-child {
	top: calc(50% - 8px);
}

.navbar-burger span:nth-child(3) {
    top: calc(50% + 6px);
}

.navbar-burger.is-active span:first-child {
	transform: translateY(7px) rotate(45deg);
}

.navbar-burger.is-active span:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

/*****************************************************************************************/
/* SUBHEADER *****************************************************************************/
/*****************************************************************************************/

.subheader {
	width: 100%;
	background-color: #CCC;
	padding: 1.5rem 0;
	margin: 0;
}

.subheader_container {
	max-width: 83.5625rem;
	margin: 0 auto;
}

.subheader h2 {
	display: inline-block;
	color: #FFF;
	font-weight: bold;
	margin: 0;
	line-height: 65px;
	vertical-align: middle;
}

.subheader .subheader_tile {
	display: inline-block;
	width: 75px;
	height: 75px;
	background-color: #FFF;
	padding: 5px;
	margin-right: 10px;
	vertical-align: middle;
}

.subheader_green {
	background: #53BA5F;
	background: -moz-linear-gradient(90deg, #1EA345 0%, #53BA5F 100%);
	background: -webkit-linear-gradient(90deg, #1EA345 0%, #53BA5F 100%);
	background: linear-gradient(90deg, #1EA345 0%, #53BA5F 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1ea345",endColorstr="#53ba5f",GradientType=1);
}

.subheader_purple {
	background: #8E8EE8;
	background: -moz-linear-gradient(90deg, #4646E8 0%, #8E8EE8 100%);
	background: -webkit-linear-gradient(90deg, #4646E8 0%, #8E8EE8 100%);
	background: linear-gradient(90deg, #4646E8 0%, #8E8EE8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4646e8",endColorstr="#8e8ee8",GradientType=1);
}

.subheader_orange {
	background: #F29639;
}

.subheader_blue_1 {
	background: #14214A;
	background: -moz-linear-gradient(90deg, #14214A 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #14214A 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #14214A 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#14214a",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_blue_2 {
	background: #005C96;
	background: -moz-linear-gradient(90deg, #005C96 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #005C96 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #005C96 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#005c96",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_blue_3 {
	background: #1C7493;
	background: -moz-linear-gradient(90deg, #1C7493 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #1C7493 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #1C7493 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c7493",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_blue_4 {
	background: #2487B2;
	background: -moz-linear-gradient(90deg, #2487B2 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #2487B2 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #2487B2 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2487b2",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_blue_5 {
	background: #40A8D7;
	background: -moz-linear-gradient(90deg, #40A8D7 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #40A8D7 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #40A8D7 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#40a8d7",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_blue_6 {
	background: #80D2EA;
	background: -moz-linear-gradient(90deg, #80D2EA 0%, #4DC6F2 100%);
	background: -webkit-linear-gradient(90deg, #80D2EA 0%, #4DC6F2 100%);
	background: linear-gradient(90deg, #80D2EA 0%, #4DC6F2 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#80d2ea",endColorstr="#4dc6f2",GradientType=1);
}

.subheader_brown {
	background: #524A41;
}


.titlebar {
	margin-bottom: 2rem;
}

.titlebar .titlebar_icon {
	padding-right: 15px;
	display: inline-block;
	vertical-align: top;
}

.titlebar .titlebar_icon img {
	width: 85px;
}

.titlebar .titlebar_content {
	border-left: 15px solid #000;
	padding-left: 15px;
	display: inline-block;
	min-height: 75px;
}

.titlebar .titlebar_content h4 {
	font-weight: bold;
}

.titlebar .titlebar_content p {
	margin: 0;
}

.titlebar.titlebar_lightblue .titlebar_content {
	border-color: #50C8F3;
}


/*****************************************************************************************/
/* PROFILE *******************************************************************************/
/*****************************************************************************************/

.referral_form label {
	display: inline-block;
	width: 150px;
	vertical-align: top;
	margin-top: 13px;
}

.referral_form input[type="text"],
.referral_form textarea,
.referral_form select,
.referral_form .mock_textarea,
.referral_form div.select {
	display: inline-block;
	width: 450px;
}

.mock_textarea {
    border: 1px solid #D1D1D1;
}

.mock_textarea .uneditable {
	padding: 15px;
    cursor: not-allowed;
}

.mock_textarea hr {
	border-bottom: 1px dashed #000;
}

.mock_textarea textarea {
	width: 100%;
	border: 0;
	height: 250px;
	padding: 0 15px;
}

/*****************************************************************************************/
/* DASHBOARD *****************************************************************************/
/*****************************************************************************************/

#dashboard {
	width: 100%;
	height: calc(100% - 90px); /*calc(100% - 58px);*/
	display: flex;
	position: relative;
}

#dashboard .dashboard_left {
	width: 350px;
	background-color: var(--grey-light-mode);
	padding: 4rem 2rem;
}

@media (prefers-color-scheme: dark) {
	#dashboard .dashboard_left {
		background-color: var(--grey-dark-mode);
	}
}

#dashboard .dashboard_left a.button {
	margin-bottom: 0;
}

#dashboard .dashboard_left #upcoming_calls {
	color: #EE5732;
	font-weight: bold;
}

#dashboard .dashboard_left .upcoming_calls {
	padding-left: 25px;
	padding-top: 10px;
}

#dashboard .dashboard_right {
	background-color: var(--bulma-scheme-main-l);
	padding: 4rem 4%;
	display: inline-block;
	width: calc(100% - 350px);
}

#dashboard .dashboard_right .next_lesson {
	background-color: transparent;
	padding: 0;
}

#dashboard .dashboard_right .next_lesson .next_lesson_desc {
	margin: 0;
}

#dashboard .dashboard_right .next_lesson div.excerpt p {
	font-size: .9em;
}

#dashboard .dashboard_right .next_lesson div.next_lesson_image {
	max-width: 325px;	
}

#dashboard .dashboard_right .next_lesson button {
	margin: 0;
}

#dashboard .dashboard_right_inside {
	margin: 0 auto;
	max-width: 1275px;
}

#dashboard .action_items p {
	word-wrap: break-word;
}

#dashboard .step_container {
	width: 100%;
	max-width: 650px;
	margin: 0 auto 40px;
	position: relative;
	color: #646a6f;
	font-size: .9rem;
	padding: 20px;
}

#dashboard .step_container_inner {
	width: 100%;
	display: block;
	position: relative;
}

#dashboard .step_section {
	float: left;
	text-align: center;
	position: relative;
	z-index: 1;
}

#dashboard .step_progress {
	position: absolute;
	margin: 7px auto 0;
	height: 5px;
	background-color: #E6E6E5;
}

#dashboard .step_progress_inner {
	height: 100%;
	background-color: #1FBC7A;
}

#dashboard .step_container .progress_bar {
	float: right;
}

#dashboard .step_circle {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background-color: #E6E6E5;
	border: 2px solid #E6E6E5;
	margin: 0 auto 5px;
}

#dashboard .step_circle.current {
	background-color: #fff;
	border-color: #1FBC7A;
}

#dashboard .step_circle.complete {
	background-color: #FFF;
	border-color: #1FBC7A;
	line-height: 20px;
}

#dashboard .step_circle.complete:before {
	content: '\f058';
	font-family: 'Font Awesome 5 Free';
	font-weight: bold;
	display: block;
	height: 100%;
	width: 100%;
	line-height: 20px;
	text-align: center;
	color: #1FBC7A;
	position: relative;
	top: -1px;
	left: -1px;
	font-size: 1.1rem;
}

#dashboard .step_label {
	max-width: 100px;
	margin: 0 auto;
}

@media only screen and (max-width: 62em) {
	#dashboard {
		width: 100%;
		height: auto;
		display: block;
		position: relative;
	}

	#dashboard .dashboard_left,
	#dashboard .dashboard_right {
		width: 100%;
		height: auto;
		display: block;
		padding: 3rem 4%;
	}
}

/*****************************************************************************************/
/* SIDEBAR *******************************************************************************/
/*****************************************************************************************/

.sidebar_menu {
	padding: 1rem 0;
}

.sidebar_menu .item {
	margin: .75rem 0;
	color: #999ea1;
}

.sidebar_menu .item a {
	border-left: 2px solid transparent;
	padding: 5px 30px;
	display: block;
	width: 100%;
	height: 100%;
}

.sidebar_menu .item.selected {
	color: inherit;
}

.sidebar_menu .item.selected a {
	border-color: #2398e4;
	color: inherit;
}

.sidebar_menu .subitem {
	color: #999ea1;
	padding: 5px 50px;
	margin: .5rem 0;
}

.sidebar_menu .subitem.selected a {
	color: #999ea1;
}

.sidebar_menu .item:hover,
.sidebar_menu .subitem:hover {
	background-color: var(--grey-2-light-mode);
}

@media (prefers-color-scheme: dark) {
	.sidebar_menu .item:hover,
	.sidebar_menu .subitem:hover {
		background: var(--grey-2-dark-mode);
	}
}

/*****************************************************************************/
/* CONTAINERS ****************************************************************/
/*****************************************************************************/

.divTable {
	display: table;
}

.divRow {
	display: table-row;
}

.divRow.alt_bg {
	background-color: #F9F9F9;
}

@media (prefers-color-scheme: dark) {
	.divRow.alt_bg {
		background-color: #060606;
	}
}

.divCell {
	display: table-cell;
	padding: .25rem .5rem;
	vertical-align: middle;
}

.shadow_container {
	-moz-box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 25%);
    -webkit-box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 25%);
	box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 25%);
	padding: 2rem;
	border-radius: 10px;
	background-color: var(--bulma-scheme-main-l);
	margin-bottom: 2rem;
}

@media (prefers-color-scheme: dark) {
	.shadow_container {
		-moz-box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 100%);
		-webkit-box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 100%);
		box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 100%);
	}
}

.border_container {
	border: 1px solid #000;
	border-top: 15px solid #000;
	border-radius: 10px;
	padding: 2rem;
	margin-bottom: 2rem;
}

.border_yellow {
	border-color: #FABC39 !important;
}

.page_box {
	margin: 0 auto 2rem;
	background: var(--grey-light-mode);
    border: 2px solid #eaefef;
    border-radius: 5px;
	padding: 2rem;
}

@media (prefers-color-scheme: dark) {
	.page_box {
		border-color: #151010;
		background: var(--grey-dark-mode);
	}
}

.page_box.collapse {
	padding: 0;
}

/*****************************************************************************/
/* TABLES ********************************************************************/
/*****************************************************************************/

table.member {
	width: 100%;
	border-radius: 0;
	border-collapse: separate;
	border: none;
	border-bottom: 1px solid #666;
}

table.member thead th {
	background-color: #2d99e2 !important;
	color: #FFF;
	white-space: nowrap;
	border: none !important;
	font-weight: 200 !important;
}

table.member tr {
	background-color: var(--grey-light-mode);
}

@media (prefers-color-scheme: dark) {
	table.member tr {
		background-color: var(--grey-dark-mode);
	}
}

table.member td {
	/*border: 1px solid #E1E2E2;*/
	border-bottom: 1px solid #EEE;
	vertical-align: middle;
}

table.member tr td, 
table.member tr th {
	font-size: .95rem;
}

table.member .desc {
	font-size: .85em;
}

table.table_lined {
	border-collapse: collapse;
}

table.table_lined tr,
table.table_lined td {
	border: 1px solid #000;
	background-color: var(--bulma-scheme-main-l);
	vertical-align: middle;
}

td.input_entry {
	padding: 0;
}

td.input_entry input {
	display: block;
	background-color: transparent !important;
	border: 0;
	box-shadow: none;
	margin: 0;
	text-align: right;
	font: inherit;
	color: #FFF;
}

td.input_entry input:focus {
	outline: 1px dashed #FFF;
}

table.stats.dataTable tbody tr,
table.stats.dataTable tbody tr>.dtfc-fixed-start,
table.stats.dataTable tbody tr>.dtfc-fixed-end,
table.stats.dataTable thead tr>.dtfc-fixed-start,
table.stats.dataTable thead tr>.dtfc-fixed-end,
table.stats.dataTable tfoot tr>.dtfc-fixed-start,
table.stats.dataTable tfoot tr>.dtfc-fixed-end {
	background-color: var(--bulma-scheme-main-l);
}

/*****************************************************************************/
/* TABS **********************************************************************/
/*****************************************************************************/

.tabbed {
	padding: 0;
	border: 0;
}

.tabbed.ui-tabs .ui-tabs-panel {
	padding: 0;
	padding-top: 3rem;
}

.tabbed .ui-tabs-nav {
	background: none;
	padding: 0;
	border: 0;
}

.tabbed .ui-tabs-nav li {
	text-align: center;
	height: 51px;
	vertical-align: middle;
	align-items: center;
	display: flex;
	margin: 1px 1% 0 0;
}

.tabbed .ui-tabs-nav li:last-of-type {
	margin-right: 0;
}

.tabbed .ui-tabs-nav li.results_tab {
	margin-left: 30px;
}

.tabbed .ui-tabs-nav li.results_tab:after {
	content: '--‣';
	display: inline-block;
	position: absolute;
	font-size: 26px;
	left: -30px;
	color: #000;
}

.ui-widget-content {
	background: var(--bulma-scheme-main-l);
	color: var(--bulma-text-l);
}

.ui-widget-content a {
	color: #2d99e2;
}

.ui-widget-content a.button {
	color: #FFF;
}

.ui-widget-content a.button.secondary {
	color: #EE5732;
}

.ui-widget.ui-widget-content {
	border: 0;
}

.ui-widget.ui-widget-content.ui-slider {
	border: 1px solid #C5C5C5;
}

.ui-widget.ui-widget-content.ui-autocomplete {
	border: 1px solid #CCC;
}

@media only screen and (max-width:40em) {
	.tabbed .ui-tabs-nav li {
		width: 100% !important;
	}
}

.tabbed .ui-tabs-nav li:last-of-type {
	margin-right: 0;
}

.tabbed .ui-tabs-nav li.ui-state-default {
	background-color: var(--grey-light-mode);
	color: var(--bulma-text-l);
}

@media (prefers-color-scheme: dark) {
	.tabbed .ui-tabs-nav li.ui-state-default {
		background-color: var(--grey-dark-mode);
		color: var(--bulma-text-l);
	}
}

.tabbed .ui-tabs-nav li.ui-state-active {
	background-color: #53BA5F;
	color: #FFF;
}

.tabbed .ui-tabs-nav .ui-tabs-tab a {
    font-size: 12px;
    font-weight: bold;
    height: 100%;
    width: 100%;
    white-space: normal;
    align-items: center;
    justify-content: center;
    display: flex;
}

.tabbed .ui-widget-header .ui-state-active,
.tabbed .ui-widget-header .ui-state-default {
	border: 0;
	border-radius: 0;
	background: none;
}


/*****************************************************************************************/
/* CHARTS ********************************************************************************/
/*****************************************************************************************/

.piechart {
	display: inline-block;
	width: 150px;
	height: 150px;
	position: relative;
	margin: .25rem 1rem;
}

.piechart.mini {
	width: 32px;
	height: 32px;
	margin: .15rem .5rem;
	vertical-align: top;
}

.piechart .piechart_outer {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.piechart.mini .piechart_outer {
	width: 32px;
	height: 32px;
}

.piechart .piechart_inner {
	width: 120px;
	height: 120px;
	background-color: #FFF;
	border-radius: 50%;
	font-size: 50px;
	font-weight: bold;
	line-height: 120px;
	text-align: center;
}

.piechart.mini .piechart_inner {
	width: 24px;
	height: 24px;
	font-size: 14px;
	line-height: 24px;
}

/**********************************************************************************************/
/* TOOLBOX ************************************************************************************/
/**********************************************************************************************/

.tool_container {
	height: 300px;
	width: 290px;
	display: inline-block;
	margin: 1rem 2rem 1rem 0;
    /*background: #fefefe;
    border: 2px solid #eaefef;
    border-radius: 5px;*/
	vertical-align: bottom;
}

@media only screen and (max-width: 62em) {
	.tool_container {
		margin: 2rem auto;
		display: block;
		float: none;
	}
}

.tool_container a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 0;
	color: inherit;
	text-align: center;
	background-color: transparent;
	background-position: 20px 50%;
	background-repeat: no-repeat;
	/*-webkit-box-shadow: 1px 1px 5px 1px #C6C8CA;  */
	/*-moz-box-shadow:    1px 1px 5px 1px #C6C8CA;  */
	/*box-shadow:         1px 1px 5px 1px #C6C8CA;  */
}

.tool_container a:hover {
	/*background-color: #F4F5F6;*/
}

.tool_container img {
	width: 80px;
}

h5.tool_title {
	color: var(--bulma-text-l);
	margin: 0;
	font-weight: 900;
	height: 65px;
	font-size: 16px;
}

.tool_container p {
	margin-bottom: .5rem;
}

.tool_container p.tool_desc {
	margin: 0;
	color: var(--bulma-text-l);
	line-height: 1.2;
	font-size: 14px;
}

.toolbox_filter {
	margin: 1rem auto;
	z-index: 1;
	position: relative;
}

.toolbox_filter .select {
	max-width: 400px;
	margin: 0 auto;
}

#toolbox .dt-search {
	z-index: 2;
}

#toolbox .tabbed ul {
	text-align: center;
}

#toolbox .tabbed li {
	background-color: #ECECEC;
	border-radius: 0;
	color: #979797;
	padding: 2rem 0;
	float: none;
	display: inline-flex;
	background-position: 90% 50%;
	background-repeat: no-repeat;
	background-size: 50px 50px;
	width: 205px;
	text-align: left;
}

#toolbox .tabbed li.tooltab_webtools {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_webtools.png');
}

#toolbox .tabbed li.tooltab_templates {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_templates.png');
}

#toolbox .tabbed li.tooltab_sops {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_sops.png');
}

#toolbox .tabbed li.tooltab_playbooks {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_guides.png');
}

#toolbox .tabbed li.tooltab_assessments {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_assessments.png');
}

#toolbox .tabbed li.tooltab_swipes {
	background-image: url('/assets/img/members/toolbox/toolbox_icon_swipes.png');
}

#toolbox .tabbed li.ui-state-active {
	background-color: #4DC9F5;
	color: #FFF;
}

#toolbox .tabbed li a {
	font-size: 18px;
	justify-content: left;
	padding: 2rem 1rem;
}

/**********************************************************************************************/
/* JQUERY UI **********************************************************************************/
/**********************************************************************************************/

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	color: var(--bulma-text-l);
	background: var(--grey-light-mode);
}

@media (prefers-color-scheme: dark) {
	.ui-state-default,
	.ui-widget-content .ui-state-default,
	.ui-widget-header .ui-state-default,
	.ui-button,
	html .ui-button.ui-state-disabled:hover,
	html .ui-button.ui-state-disabled:active {
		background: var(--grey-dark-mode);
	}
}

/**********************************************************************************************/
/* MISC ***************************************************************************************/
/**********************************************************************************************/

div[role="tooltip"] {
	cursor: pointer;
}

[role~="tooltip"]::after {
	white-space: pre-line !important;
}

.email_content {
	border: 1px solid #dbdbdb;
	border-radius: 4px;
	padding: 3rem 2rem;
	position: relative;
	max-width: 800px;
}

.toolbox_link {
	display: inline-block;
	margin-bottom: 1rem;
}

.toolbox_link i {
	color: #FABC39;
}