/*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 */
#XcUserMenuCurrentStatusText {
		padding-top: 2px;
		float: left;
		margin-left: 2px;
		margin-right: 6px; }

#XcUserMenuCurrentStatusColorBoxAndText {
		cursor: pointer; }

.xc-team-usermenu-status-text {
		display: block;
		color: inherit;
		padding-top: 1px; }

.xc-team-usermenu-status-text:hover {
		text-decoration: none; }

.xc-team-status-box-small {
		height: 18px;
		width: 3px;
		float: left;
		margin-right: 3px;
		border: 1px solid #888;
		border-radius: 1px; }

.xc-team-status-box-medium {
		height: 22px;
		width: 3px;
		margin-right: 0px;
		border: 1px solid #888;
		border-radius: 1px; }

.xc-availability-status-update-ctrl input[type="text"].xc-availability-status-update-notes-textbox {
		width: 99.1%;
		width: -moz-calc(100% - 10px);
		width: -webkit-calc(100% - 10px);
		width: calc(100% - 10px);
		margin: 11px 5px 0px 5px;
		padding: 2px 5px;
		border: 1px solid #EEE;
		color: #AAA; }

.xc-availability-status-update-ctrl input[type="text"].xc-availability-status-update-notes-textbox:focus {
		border: 1px solid #CCC;
		font-style: initial;
		color: #333; }

.xc-availability-status-update-ctrl input[type="text"].xc-availability-status-update-notes-textbox:hover {
		border: 1px solid #AAA; }

.xc-availability-status-update-ctrl input[type="text"].xc-availability-status-update-notes-textbox.userEdited {
		font-style: initial;
		font-style: italic;
		color: #888; }

.xc-availability-status-update-ctrl input[type="text"].xc-availability-status-update-notes-textbox.userEdited:focus {
		font-style: initial;
		color: #333; }

#XcUserMenuCurrentStatusNotesUpdate {
		font-size: 11px;
		padding: 3px 6px;
		margin-top: 0px; }

#XcUserMenuCurrentStatusNotesUpdate:disabled {
		background-color: #AAA;
		border: 1px solid #DDD;
		color: #F0F0F0; }

.xc-availability-status-selector {
		padding: 0px 0px;
		list-style: none;
		float: left; }

.xc-availability-status-selector li {
		display: block;
		color: #4d4f53;
		font-weight: bold;
		font-size: 12px;
		padding: 5px;
		float: left; }

.xc-team-usermenu-status-text {
		background: none repeat scroll 0 0 #DDD;
		padding: 5px 0px;
		cursor: pointer;
		border-radius: 3px; }

.xc-team-usermenu-status-text.Available:hover {
		background-color: #B4F566;
		color: #9D9D9D; }

.xc-team-usermenu-status-text.Available.selected, .xc-team-usermenu-status-text.Available.selected:hover {
		background-color: #B4F566;
		color: #727272; }

.xc-team-usermenu-status-text.Busy:hover {
		background-color: #E9794E;
		color: #F0F0F0; }

.xc-team-usermenu-status-text.Busy.selected, .xc-team-usermenu-status-text.Busy.selected:hover {
		background-color: #CA4613;
		color: #FFF; }

.xc-team-usermenu-status-text.OffWork:hover {
		background-color: #BBB;
		color: #FFF; }

.xc-team-usermenu-status-text.OffWork.selected, .xc-team-usermenu-status-text.OffWork.selected:hover {
		background-color: #a4a4a4;
		color: #FFF; }

#InOutLastUpdatedText {
		font-style: italic; }