/* --------------------------------------
	Main Layout Style Sheet
   -------------------------------------- */
/* Add the Bootstrap Constants */
/**/
/*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 */
/*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 */
@-webkit-keyframes spin {
		from {
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg); }
		to {
				-webkit-transform: rotate(360deg);
				transform: rotate(360deg); } }

@keyframes spin {
		from {
				-webkit-transform: rotate(0deg);
				transform: rotate(0deg); }
		to {
				-webkit-transform: rotate(360deg);
				transform: rotate(360deg); } }

#MainMenu.navbar-default {
		width: 250px;
		font-size: 1.2em;
		background-color: inherit;
		color: #fff; }
		#MainMenu.navbar-default.navbar-default {
				float: left; }
		#MainMenu.navbar-default .nav > li > a, #MainMenu.navbar-default .nav > li > a:focus, #MainMenu.navbar-default .nav > li > a.focus, #MainMenu.navbar-default .nav li > a, #MainMenu.navbar-default .nav li > a:focus, #MainMenu.navbar-default .nav li > a.focus {
				-moz-transition: background .25s, color .25s;
				-o-transition: background .25s, color .25s;
				-webkit-transition: background .25s, color .25s;
				transition: background .25s, color .25s;
				cursor: pointer;
				padding-left: 20px;
				padding-right: 10px;
				border-radius: 0;
				color: #FFF;
				font-weight: 400;
				background-color: inherit; }
				#MainMenu.navbar-default .nav > li > a:hover, #MainMenu.navbar-default .nav > li > a.hover, #MainMenu.navbar-default .nav > li > a:focus:hover, #MainMenu.navbar-default .nav > li > a:focus.hover, #MainMenu.navbar-default .nav > li > a.focus:hover, #MainMenu.navbar-default .nav > li > a.focus.hover, #MainMenu.navbar-default .nav li > a:hover, #MainMenu.navbar-default .nav li > a.hover, #MainMenu.navbar-default .nav li > a:focus:hover, #MainMenu.navbar-default .nav li > a:focus.hover, #MainMenu.navbar-default .nav li > a.focus:hover, #MainMenu.navbar-default .nav li > a.focus.hover {
						background-color: #00C853;
						color: #FFF;
						font-weight: 400; }
						#MainMenu.navbar-default .nav > li > a:hover > .fa, #MainMenu.navbar-default .nav > li > a.hover > .fa, #MainMenu.navbar-default .nav > li > a:focus:hover > .fa, #MainMenu.navbar-default .nav > li > a:focus.hover > .fa, #MainMenu.navbar-default .nav > li > a.focus:hover > .fa, #MainMenu.navbar-default .nav > li > a.focus.hover > .fa, #MainMenu.navbar-default .nav li > a:hover > .fa, #MainMenu.navbar-default .nav li > a.hover > .fa, #MainMenu.navbar-default .nav li > a:focus:hover > .fa, #MainMenu.navbar-default .nav li > a:focus.hover > .fa, #MainMenu.navbar-default .nav li > a.focus:hover > .fa, #MainMenu.navbar-default .nav li > a.focus.hover > .fa {
								color: #FFF; }
				#MainMenu.navbar-default .nav > li > a .trigger-dashboard-edit, #MainMenu.navbar-default .nav > li > a:focus .trigger-dashboard-edit, #MainMenu.navbar-default .nav > li > a.focus .trigger-dashboard-edit, #MainMenu.navbar-default .nav li > a .trigger-dashboard-edit, #MainMenu.navbar-default .nav li > a:focus .trigger-dashboard-edit, #MainMenu.navbar-default .nav li > a.focus .trigger-dashboard-edit {
						display: inline;
						visibility: hidden;
						opacity: 0;
						color: #FFF;
						font-size: 1.2em;
						float: right;
						color: #BBB;
						margin-top: 1px;
						-webkit-transition: opacity, 0.5s, visibility, 0.5s;
						-moz-transition: opacity, 0.5s, visibility, 0.5s;
						-ms-transition: opacity, 0.5s, visibility, 0.5s;
						-o-transition: opacity, 0.5s, visibility, 0.5s;
						transition: opacity, 0.5s, visibility, 0.5s; }
		#MainMenu.navbar-default .nav > li.selected > a, #MainMenu.navbar-default .nav > li:focus > a, #MainMenu.navbar-default .nav li.selected > a, #MainMenu.navbar-default .nav li:focus > a {
				font-weight: 600;
				font-size: 1.1em; }
		#MainMenu.navbar-default .nav > li.selected:hover .trigger-dashboard-edit, #MainMenu.navbar-default .nav > li:focus:hover .trigger-dashboard-edit, #MainMenu.navbar-default .nav li.selected:hover .trigger-dashboard-edit, #MainMenu.navbar-default .nav li:focus:hover .trigger-dashboard-edit {
				visibility: visible;
				opacity: 1; }
				#MainMenu.navbar-default .nav > li.selected:hover .trigger-dashboard-edit:hover, #MainMenu.navbar-default .nav > li:focus:hover .trigger-dashboard-edit:hover, #MainMenu.navbar-default .nav li.selected:hover .trigger-dashboard-edit:hover, #MainMenu.navbar-default .nav li:focus:hover .trigger-dashboard-edit:hover {
						color: inherit; }
		#MainMenu.navbar-default .nav > li.open > a, #MainMenu.navbar-default .nav li.open > a {
				background-color: #35B558;
				/*color: $MenuColor_FontStandard;*/ }
		#MainMenu.navbar-default > .nav > li.has-submenu {
				background-color: inherit;
				color: inherit;
				border-left: inherit;
				-moz-transition: border .25s;
				-o-transition: border .25s;
				-webkit-transition: border .25s;
				transition: border .25s; }
		#MainMenu.navbar-default > .nav > li.has-submenu.xc-active-menu {
				background-color: #35B558;
				color: #FFF;
				border-left: 4px solid #FFF;
				-moz-transition: border .25s;
				-o-transition: border .25s;
				-webkit-transition: border .25s;
				transition: border .25s; }
		#MainMenu.navbar-default > .nav li.has-submenu > ul {
				max-height: 0;
				overflow: hidden;
				-moz-transition: max-height 0.25s;
				-o-transition: max-height 0.25s;
				-webkit-transition: max-height 0.25s;
				transition: max-height 0.25s; }
		#MainMenu.navbar-default > .nav li.has-submenu.xc-active-menu > ul {
				max-height: 1000px;
				-moz-transition: max-height 0.25s;
				-o-transition: max-height 0.25s;
				-webkit-transition: max-height 0.25s;
				transition: max-height 0.25s; }
		#MainMenu.navbar-default #UserHeader {
				cursor: pointer;
				background-color: #1B9E4B;
				padding: 25px 20px 32px 20px;
				position: relative; }
				#MainMenu.navbar-default #UserHeader:hover, #MainMenu.navbar-default #UserHeader:focus, #MainMenu.navbar-default #UserHeader.hover {
						background-image: url("../../images/RN_Background250x165.jpg");
						background-repeat: no-repeat;
						background-size: auto;
						color: inherit;
						background-color: #1EBD59; }
				#MainMenu.navbar-default #UserHeader > a {
						padding: 0px; }
				#MainMenu.navbar-default #UserHeader .user-menu-profile-pic-container .js-inout-status-current-user-status {
						display: inline-block;
						width: 5px;
						height: 65px;
						border-top-left-radius: 2px;
						border-bottom-left-radius: 2px;
						float: left;
						background-color: #FAFAFA;
						border: 1px solid transparent; }
						#MainMenu.navbar-default #UserHeader .user-menu-profile-pic-container .js-inout-status-current-user-status.Available {
								background-color: #B4F566; }
						#MainMenu.navbar-default #UserHeader .user-menu-profile-pic-container .js-inout-status-current-user-status.Busy {
								background-color: #CA4613; }
						#MainMenu.navbar-default #UserHeader .user-menu-profile-pic-container .js-inout-status-current-user-status.OffWork {
								background-color: #a4a4a4; }
				#MainMenu.navbar-default #UserHeader .user-menu-profile-pic-container .user-menu-profile-pic {
						height: 65px;
						border-top-right-radius: 2px;
						border-bottom-right-radius: 2px; }
				#MainMenu.navbar-default #UserHeader #UserName {
						float: left;
						font-size: 1em;
						color: #FFF;
						margin-top: 18px;
						max-width: 210px; }
						#MainMenu.navbar-default #UserHeader #UserName.elevation-is-impersonating {
								color: #FFF57F;
								font-weight: 400; }
						#MainMenu.navbar-default #UserHeader #UserName #UserDropdownMenu {
								margin-left: 19px;
								top: inherit; }
								#MainMenu.navbar-default #UserHeader #UserName #UserDropdownMenu .xc-availability-status-update-ctrl-container {
										padding: 20px 20px 10px 20px; }
						#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge {
								font-size: 18px;
								padding-left: 3px; }
								#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge .switch-back {
										font-size: .7em;
										font-weight: 300;
										font-style: italic; }
								#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge a {
										color: #FFF57F; }
										#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge a:hover {
												text-decoration: none; }
										#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge a:focus {
												text-decoration: none; }
								#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge.elevation-is-impersonating {
										font-weight: 400; }
								#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge.elevation-can-switch-elevate a {
										color: #FFF; }
								#MainMenu.navbar-default #UserHeader #UserName #ElevationBadge.elevation-can-login-elevate a {
										color: #777; }
				#MainMenu.navbar-default #UserHeader #FirmName {
						font-size: 1em;
						color: #FFF;
						padding: 1px 0;
						max-width: 210px;
						position: relative; }
				#MainMenu.navbar-default #UserHeader #UserTitle {
						padding: 1px 0;
						font-size: 0.9em;
						max-width: 210px; }
				#MainMenu.navbar-default #UserHeader #UserAvailabilityStatus #CurrentStatus {
						float: left;
						font-style: italic; }
				#MainMenu.navbar-default #UserHeader #UserAvailabilityStatus #StatusAndTextSeparator {
						float: left;
						font-style: italic; }
				#MainMenu.navbar-default #UserHeader #UserAvailabilityStatus #TruncatedStatus {
						font-style: italic;
						float: left;
						text-overflow: ellipsis;
						overflow: hidden;
						white-space: nowrap;
						display: inline-block;
						max-width: 135px;
						padding-right: 3px; }
				#MainMenu.navbar-default #UserHeader #UserAvailabilityStatus #UserStatusDropdownMenu {
						width: 400px;
						margin-left: 19px;
						padding-bottom: 20px;
						top: inherit; }
						#MainMenu.navbar-default #UserHeader #UserAvailabilityStatus #UserStatusDropdownMenu .xc-availability-status-update-ctrl-container {
								padding: 20px 20px 10px 20px; }
		#MainMenu.navbar-default #UserHeaderPopoutOverlay, #MainMenu.navbar-default #NotificationsPartialPopoutOverlay {
				position: fixed;
				top: 0px;
				left: 0px;
				width: 100%;
				height: 100%;
				cursor: default;
				z-index: 1;
				display: none; }
		#MainMenu.navbar-default #EndPreviewLink {
				display: block;
				text-align: center;
				border: none; }
				#MainMenu.navbar-default #EndPreviewLink div {
						padding: 5px 10px 5px 10px;
						margin-top: 5px;
						background-color: #7FE4A8;
						border: none; }
						#MainMenu.navbar-default #EndPreviewLink div:hover {
								background-color: #1EBD59;
								font-weight: 400; }
						#MainMenu.navbar-default #EndPreviewLink div .fa {
								font-size: 15px; }
		#MainMenu.navbar-default .nav .collapsable-submenu > li > a {
				padding-left: 43px; }
		#MainMenu.navbar-default .nav .collapsable-submenu > li > .collapsable-submenu > li > a {
				padding-left: 53px; }
		#MainMenu.navbar-default .nav .collapsable-submenu > li > .collapsable-submenu > li > .collapsable-submenu > li > a {
				padding-left: 65px; }