﻿/* --------------------------------------
	XC-General
	
	A set of common CSS tools
   -------------------------------------- */
/*color constants are copied into ColorsViewModel.cs*/
/* These Z-Indexes Are Intertwined In order to support popups*/
/*-------------------- Top Bar and Main Menu --------------------------*/
/* -------------------------------------- Basic Typography -------------------------------------- */
/* -------------------------------------- Responsive Constants -------------------------------------- */
/* Same widths as Bootstrap's responsive breaks: http://getbootstrap.com/2.3.2/scaffolding.html#responsive */
/* --------------------------------------
	Responsive
	
	Some CSS, Mixins, and Media Queries
	to assist in making things respnosive
	 
   -------------------------------------- */
/*color constants are copied into ColorsViewModel.cs*/
/* These Z-Indexes Are Intertwined In order to support popups*/
/*-------------------- Top Bar and Main Menu --------------------------*/
/* -------------------------------------- Basic Typography -------------------------------------- */
/* -------------------------------------- Responsive Constants -------------------------------------- */
/* Same widths as Bootstrap's responsive breaks: http://getbootstrap.com/2.3.2/scaffolding.html#responsive */
/* Animate the element when it's size/position changes (not just on breakpoints...) */
.breakpoint-animate {
		transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-ms-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-moz-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-webkit-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-o-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out; }

/* Use this to build custom responsive shims for elements */
[hidden] {
		display: none; }

input[type=text]::-ms-clear {
		height: 11px;
		width: 11px;
		position: absolute;
		right: 12px;
		top: 16px;
		background-image: url("../../../CortexDotNet/Common/images/icon-close.png");
		cursor: pointer;
		color: transparent; }

/* ---------------------------------- Icons ---------------------------------- */
.xc-collapse-expand-icon {
		/* float: right; */
		/* margin-right: 5px; */
		margin: auto;
		display: inline-block;
		vertical-align: top;
		width: 8px;
		height: 11px;
		margin-top: 4px;
		margin-left: 0px; }

.xc-collapse-expand-icon.expanded {
		background-image: url("../images/ExpandCollapse.png");
		background-position: -1px -1px; }

.xc-collapse-expand-icon.collapsed {
		background-image: url("../images/ExpandCollapse.png");
		background-position: -8px -1px; }

#UserNameSettingsIcon {
		min-width: 295px; }
		#UserNameSettingsIcon.js-menu-visible {
				min-width: 395px; }

#ElevateBackground, #ElevateUserCtrlContent {
		z-index: 904; }

/* ---------------------------------------------------------------------------- XC STYLES FOR CORTEX-RELATED TAGS ---------------------------------------------------------------------------- */
/*
		These relate to HTML Tags created by Cortex in which we've modified the inline style by using CSS classes
	*/
/* ---------------------------------- CSS Tools ---------------------------------- */
/* Basics */
.xc-green-text-over-white {
		color: #1EBD59; }

.xc-red-text-over-white {
		color: #B93E1C; }

.xc-warning-message-box {
		color: #B93E1C;
		font-size: 1.1em;
		border: 1px solid #EC5A32;
		padding: 10px;
		background-color: #F2DEDE;
		border-radius: 3px; }

.xc-warning-message-box .xc-link, .xc-warning-message-box .xc-link.a, .xc-warning-message-box a {
		color: #E88A44; }

.xc-error-message-box {
		margin-bottom: 10px;
		padding: 5px 10px 5px 35px;
		border: 1px solid #9E2F2C;
		background: url("../../../CortexDotNet/Common/images/message_negative.png") 7px center no-repeat #EC5A32;
		color: #FFF;
		font-size: 14px;
		border-radius: 3px; }

.xc-error-message-box .xc-link, .xc-error-message-box .xc-link.a, .xc-error-message-box a {
		color: #FCF2E3; }

.xc-success-message-box {
		color: #1EBD59;
		font-size: 1.1em;
		border: 1px solid #7AA744;
		padding: 10px;
		background: #E8FFCB;
		border-radius: 3px; }

.xc-padded-content {
		padding: 10px;
		margin-left: 20px;
		margin-right: 20px; }

.xc-padded-content-minimal {
		padding: 10px;
		margin-left: 10px;
		margin-right: 10px; }

.xc-content-outside-xc-page {
		margin: 10px; }

.xc-tab-content, .xc-tab-content-box {
		padding: 2px 0px 2px 10px;
		display: none; }

.xc-tab-content-box {
		border: 1px solid #efefef; }

.xc-tab-content.active {
		display: block; }

.xc-tab-title {
		font-weight: bold; }

.xc-tabs-container .xc-tabs .xc-tab {
		cursor: pointer;
		text-align: center;
		position: relative;
		float: left;
		margin: 3px 0px 0px 0px;
		background-color: #FFF;
		color: #424242;
		border-bottom: 1px solid #FAFAFA;
		border-top-left-radius: 2px;
		border-top-right-radius: 2px;
		border: 1px solid #DDD;
		padding: 5px 10px; }
		.xc-tabs-container .xc-tabs .xc-tab.selected {
				background-color: #FFF;
				color: #424242;
				border-top: 3px solid #1EBD59;
				box-shadow: 6px -3px 12px -5px rgba(0, 0, 0, 0.2);
				border-bottom: 1px solid transparent;
				z-index: 1; }
				.xc-tabs-container .xc-tabs .xc-tab.selected .badge {
						top: -10px; }
		.xc-tabs-container .xc-tabs .xc-tab.selected p {
				color: #FFF; }
		.xc-tabs-container .xc-tabs .xc-tab:hover {
				border: 1px solid #DDD;
				border-top: 3px solid #1EBD59;
				background-color: #D7F7E3;
				color: #424242;
				box-shadow: 6px -3px 12px -5px rgba(0, 0, 0, 0.2);
				z-index: 1; }
				.xc-tabs-container .xc-tabs .xc-tab:hover h3 {
						padding-top: 4px; }
		.xc-tabs-container .xc-tabs .xc-tab.selected:hover {
				color: #424242;
				background-color: #FFF;
				border-top: 3px solid #1EBD59;
				border-bottom: 1px solid transparent; }
		.xc-tabs-container .xc-tabs .xc-tab h3 {
				display: inline-block;
				vertical-align: top;
				padding: 0px;
				margin: 1px 0px 0px 0px;
				font-weight: 300;
				padding-top: 6px; }
		.xc-tabs-container .xc-tabs .xc-tab.selected h3 {
				padding-top: 6px; }

.xc-down-arrow-img {
		background-image: url("../../../CortexDotNet/Common/images/down-arrow.png");
		background-size: 12px 12px;
		width: 12px;
		height: 12px;
		display: inline-block; }

.xc-up-arrow-img {
		background-image: url("../../../CortexDotNet/Common/images/up-arrow.png");
		background-size: 12px 12px;
		width: 12px;
		height: 12px;
		display: inline-block; }

.xc-table-two-column tr td:first-child {
		padding-right: 20px; }

.xc-button-orange {
		border: 1px solid #BF733B;
		border-radius: 3px;
		background-color: #E88A44;
		padding: 7px 18px 7px 18px;
		font-size: 15px;
		color: white;
		cursor: pointer; }

.xc-button-orange:hover {
		background-color: #BF733B;
		border: 1px solid #BF733B; }

.xc-button-orange:disabled, .xc-button-orange.disabled {
		cursor: default;
		background-color: #F1B78D;
		border: 1px solid #E88A44; }

.xc-button-green, a.xc-button-green {
		border: 1px solid transparent;
		border-radius: 5px;
		background-color: #1EBD59;
		padding: 7px 18px 7px 18px;
		font-size: 15px;
		color: white;
		cursor: pointer;
		display: inline-block; }

.xc-button-green:hover, a.xc-button-green:hover {
		cursor: pointer;
		color: #fff;
		background-color: #179144;
		border: 1px solid #127236; }

.xc-button-green:disabled, a.xc-button-green:disabled, .xc-button-green.disabled, a.xc-button-green.disabled {
		cursor: default;
		background-color: #7FE4A8;
		color: #424242; }

.xc-button-green:disabled:hover, a.xc-button-green:disabled:hover, .xc-button-green.disabled:hover, a.xc-button-green.disabled:hover {
		background-color: #7FE4A8;
		color: #424242; }

.xc-button-small-green, a.xc-button-small-green {
		border: 1px solid #127236;
		border-radius: 3px;
		background-color: #1EBD59;
		font-size: 15px;
		border-radius: 3px;
		padding: 4px 11px;
		color: white;
		cursor: pointer;
		display: inline-block; }

.xc-button-small-green:hover, a.xc-button-small-green:hover {
		color: #fff;
		background-color: #179144;
		border: 1px solid #127236; }

.xc-button-small-green.disabled, a.xc-button-small-green:disabled {
		cursor: default;
		background-color: #7FE4A8; }

.xc-button-small-green.disabled:hover, a.xc-button-small-green:disabled:hover {
		cursor: default;
		background-color: #7FE4A8; }

.xc-button-small-green.smaller-button {
		padding: 2px 7px;
		font-size: 13px; }

.xc-button-modern-blue, a.xc-button-modern-blue {
		border: 1px solid #316195;
		background-color: #2C6DA3;
		border-radius: 2px;
		padding: 5px 11px;
		font-size: 15px;
		color: white;
		cursor: pointer;
		border-radius: 3px; }

.xc-button-modern-blue:hover, a.xc-button-modern-blue:hover {
		background-color: #3184CA;
		text-decoration: none; }

.xc-button-modern-blue.disabled {
		cursor: default;
		background-color: #7598BD; }

/* Bootstrap Button Overrides */
.btn {
		padding: 7px 12px;
		cursor: pointer; }

.btn-xs {
		font-size: 10px;
		line-height: 1;
		border-radius: 3px; }

.xc-button-modern-blue, a.xc-button-modern-blue {
		color: white; }

.xc-radio-button {
		border: 1px solid #DDD;
		opacity: 0.75;
		border-radius: 2px; }

.xc-radio-button:hover {
		border: 1px solid #CCC;
		background-color: #D7F7E3; }

.xc-radio-button.checked {
		opacity: 1;
		background-color: #1EBD59;
		border: 1px solid #1EBD59;
		color: #FFF; }

.xc-radio-button.checked:hover {
		opacity: 1;
		border: 1px solid #CCC; }

.xc-standard-input {
		border: 1px solid #BBB;
		background-color: #F0F0F0;
		outline: none; }

.xc-standard-input:focus {
		background-color: white; }

.xc-standard-input::-ms-clear {
		display: none; }

.xc-standard-input.warning {
		border: 1px solid #E98A3A !important;
		background-color: #FFCB9E !important; }

/* -------- Generic Styles -------- */
.hidden, .hide {
		display: none; }

.position-relative {
		position: relative; }

.invisible {
		opacity: 0; }

.float-left {
		float: left; }

.float-right {
		float: right; }

.float-right-wide {
		float: right; }

@media (max-width: 1200px) {
		.float-right-wide {
				float: left; } }

.display-inlineblock {
		display: inline-block; }

.display-inline {
		display: inline; }

/*-------------------------------------- Font Classes --------------------------------------*/
.xs-font {
		font-size: 11px; }

.sm-font {
		font-size: 12px; }

.med-sm-font {
		font-size: 13px; }

.med-font {
		font-size: 14px; }

.med-lg-font {
		font-size: 15px; }

.lg-font {
		font-size: 18px; }

.x-lg-font {
		font-size: 24px; }

.x-lg-header-font {
		font-size: 30px; }

.jumbo-header-font {
		font-size: 36px; }

.top-bar-header-height {
		line-height: 60px; }

.bold {
		font-weight: bold; }

.lt-bold {
		font-weight: 400; }

.x-bold {
		font-weight: 600; }

.not-bold {
		font-weight: 300; }

.normal {
		font-weight: 300; }

.italic {
		font-style: italic; }

.not-italic {
		font-style: normal; }

.center-text {
		text-align: center; }

.left-text {
		text-align: left; }

.right-text {
		text-align: right; }

.justified {
		text-align: justify; }

.font-large, a.font-large {
		font-size: 1.1em; }

.font-larger, a.font-larger {
		font-size: 1.3em; }

.clear-float {
		clear: both; }

.clear-float-after:after {
		content: "";
		visibility: hidden;
		display: block;
		height: 0;
		clear: both; }

.cursor-pointer {
		cursor: pointer; }

.ellipsis {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		-moz-binding: url("assets/xml/ellipsis.html#ellipsis"); }

.centering-parent {
		margin: auto auto;
		width: 100%;
		text-align: center; }

.centered-element {
		display: table;
		margin: 0 auto; }

.vertically-centered-element-parent {
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		transform-style: preserve-3d; }

.vertically-centered-element {
		position: relative;
		top: 50%;
		transform: translateY(-50%); }

/* 
		Justified Boxes - Line up some boxes in a row and get them to fill up the container's space
		You must still:
		1) Specify the padding on the container - if you want it
		2) Specify a width for each box (perhaps something like 33% for three, 50% for two...)
	*/
.xc-justifiedboxes-container {
		width: 100%;
		text-align: justify;
		text-justify: distribute;
		box-sizing: border-box; }

.xc-justifiedboxes-box {
		text-justify: inherit;
		text-align: center;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		display: inline-block;
		float: left; }

.xc-info-box {
		padding: 10px;
		border: 1px solid #DDD;
		position: relative; }

.xc-info-box.info {
		background-color: #FFFFF4;
		color: #424242;
		cursor: default;
		float: none;
		margin-top: 0px;
		border: 1px solid #FCFBC4; }

.xc-info-box .title-icon {
		position: absolute;
		right: -16px;
		top: -8px;
		width: 32px;
		height: 32px;
		background-image: url("../images/icon-info-boxes.png"); }

.xc-info-box.error {
		background-color: #ee6262;
		color: #FFF; }

.xc-info-box.error .title-icon {
		background-position-x: -111px; }

.xc-info-box.message {
		background-color: #D7F7E3;
		color: #1B9E4B;
		font-size: 15px;
		border-radius: 3px; }

.xc-info-box.warning {
		background-color: #FFCB9E;
		color: #424242;
		border: 1px solid #E98A3A; }

.xc-info-box.noborder {
		border: none; }

.xc-info-box.warning .title-icon {
		background-position-x: -74px; }

.xc-info-box.correct {
		background-color: #D7F7E3;
		color: #424242;
		border: 1px solid #90C747; }

.xc-info-box.correct .title-icon {
		background-position-x: -37px; }

.text-box-clear-text-icon-container {
		position: relative; }

.text-box-clear-text-icon {
		height: 11px;
		width: 11px;
		position: absolute;
		right: 12px;
		background-image: url("../../../CortexDotNet/Common/images/icon-close.png");
		cursor: pointer; }

.xc-remove-IE-clear-text-icon::-ms-clear {
		display: none;
		width: 0;
		height: 0; }

.widget-title-bar .text-box-clear-text-icon-container {
		float: right; }

.text-box-clear-text-icon:hover {
		background-image: url("../../../CortexDotNet/Common/images/icon-close-hover.png"); }

/* Some predefined percentage widths */
.xc-width-one-of-one {
		width: 100%; }

.xc-width-one-of-two {
		width: 50%; }

.xc-width-one-of-three {
		width: 33.333333333333333%; }

.xc-width-one-of-four {
		width: 25%; }

.xc-width-one-of-five {
		width: 20%; }

.xc-width-one-of-six {
		width: 16.66666666666666%; }

.xc-width-one-of-seven {
		width: 20%; }

.xc-width-one-of-eight {
		width: 12.5%; }

.xc-width-one-of-nine {
		width: 11.111111111111111%; }

.xc-width-one-of-ten {
		width: 10%; }

.xc-width-two-of-three {
		width: 66.66666666%; }

.xc-width-two-of-four {
		width: 50%; }

.xc-width-two-of-five {
		width: 40%; }

.xc-width-two-of-six {
		width: 33.333333333333333%; }

.xc-width-two-of-seven {
		width: 28.571428571428571428571428571429%; }

.xc-width-two-of-eight {
		width: 25%; }

.xc-width-two-of-nine {
		width: 22.222222222222222%; }

.xc-width-two-of-ten {
		width: 20%; }

/* -------- OneWidgetOnly.Master -------- */
#OneWidgetOnlyMainBody {
		background-position: 0 -17px;
		margin: 15px 0px 0px 0px;
		padding: 0;
		background-color: #1EBD59; }

#XcMainLogo {
		margin-left: 10px; }

#XcMainLogo a {
		border: none;
		text-decoration: none; }

#XcMainLogo a img {
		border: none; }

#OneWidgetOnlyMainBody .xc-dashboard-root {
		padding-top: 0px; }

#OneWidgetOnlyMainBody .widget-title-bar > .xc-icon-popout {
		display: none; }

.xc-checkbox-selector-fancy-blue {
		float: left;
		margin-right: 10px;
		margin-top: 10px; }

.xc-checkbox-selector-fancy-blue span {
		background-color: #FFF;
		border-radius: 5px;
		border: 1px solid silver;
		text-align: center;
		padding: 7px;
		display: block;
		cursor: pointer; }

.xc-checkbox-selector-fancy-blue input {
		position: absolute;
		visibility: hidden; }

.xc-checkbox-selector-fancy-blue input:checked + span {
		border: 1px solid #7FE4A8;
		background-color: #1EBD59;
		color: white; }

.xc-checkbox-selector-fancy-blue input:disabled:checked + span {
		border: 1px solid #D7F7E3;
		background-color: #7FE4A8;
		color: white; }

.xc-page-title-with-icon {
		margin-bottom: 20px;
		color: #111; }

#CmsPage .xc-page-title-with-icon a, #CmsPage .xc-page-title-with-icon a:hover {
		font-size: 20px; }

#CmsPage ul {
		list-style: square; }

#CmsPage ul li {
		margin-top: 10px; }

#CmsPage ul li a {
		font-size: 22px !important; }

#CmsPage ul li a:hover {
		text-decoration: none; }

#NewAcctMngBadge {
		position: absolute;
		margin-left: -31px;
		margin-top: -14px; }

/* -------- Useful Styles from Account Management -------- */
.content-tile {
		margin: 0px 40px 30px 0px; }
		.content-tile.no-margin {
				margin: 0px; }
		@media only screen and (max-width: 1550px) {
				.content-tile.sm-margin {
						margin: 0 12px 30px 0; } }

.float-right .content-tile, .float-right.content-tile {
		float: right;
		margin: 0px 0px 30px 50px; }
		@media only screen and (max-width: 1550px) {
				.float-right .content-tile.sm-margin, .float-right.content-tile.sm-margin {
						margin: 0 12px 30px 0; } }

.content-box h3 {
		margin: 0px;
		padding: 0px;
		font-size: 16px;
		font-weight: 400;
		border-bottom: 1px solid #CCC;
		padding-bottom: 2px;
		margin-bottom: 7px; }

.content-box.has-filter-bar h3 {
		margin-bottom: 1px; }

.content-box.has-filter-bar .xc-widget-filter-bar {
		margin-bottom: 10px;
		padding-left: 0px; }

.content-box .content, .content-box.content {
		margin: 0px 0px 15px 0px;
		border: 1px solid #DDD;
		padding: 20px 20px;
		background-color: #FFF;
		box-shadow: 3px 3px 8px -4px rgba(0, 0, 0, 0.2); }

.content-box.smallbox h3 {
		font-size: 20px;
		margin-top: 3px; }

.content-box.smallbox .content {
		border: 1px solid #DDD;
		padding: 10px 15px;
		background-color: #FFF;
		box-shadow: 3px 3px 8px -4px rgba(0, 0, 0, 0.2); }

.fa-spin-hover:hover {
		-webkit-animation: spin 2s infinite linear;
		-moz-animation: spin 2s infinite linear;
		-o-animation: spin 2s infinite linear;
		animation: spin 2s infinite linear; }

.HelpPageStyling h1, .HelpPageStyling h2, .HelpPageStyling h3 {
		margin-top: 10px;
		margin-bottom: 5px; }

.HelpPageStyling ul li {
		font-size: 1.5em; }

.HelpPageStyling p {
		font-size: 1.5em; }

#toast-container .toast {
		background-color: #424242;
		opacity: 1; }
		#toast-container .toast.toast-success {
				background-color: #1EBD59; }
		#toast-container .toast.toast-error {
				background-color: #CA4613; }
		#toast-container .toast.toast-info {
				background-color: #00C853; }
		#toast-container .toast.toast-warning {
				background-color: #E88A44; }
