/* Our blue: #387FE8 */

html {height:100%;}
body {
	height:100%;
	font-size:16px;
	background: url(../images/fabric-texture-bg.png);
	font-family: "Hevetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	color:#333;
	font-size: 12px;
	}
/* Begin - Generics */
table {border-collapse: collapse;}
a, a:link, a:visited {color:#387FE8;}
a:hover {text-decoration: none;}

.GenericTable {
	width:100%;
	border-collapse: collapse;
	}
.GenericTable th {
	border-left: 1px solid #999;
	background-color:#fff;
	padding:8px;
	text-align: left;
	border-bottom: 3px solid #333;
	font-weight: bold;
	}
.GenericTable td {
	border-left: 1px solid #999;
	padding:8px;
	vertical-align: top;
	}
.GenericTable tr > td:first-child,
.GenericTable tr > th:first-child {
	border-left:0;
	}
.GenericTable tfoot th,
.GenericTable tfoot td {
	border-top: 3px solid #333;
	font-weight: bold;
	}
.GenericTable tr.Alternate td {
	background-color:#DAE8F7;
	}
/* End - Generic Table */


#HRApplication {
	background: #eee;
	height: 100%;
	}
.PageWidthWrapper {
	width: 960px;
	margin:0 auto;
	position: relative;
	}

#HRApplication > .Header {
	height: 102px;
	background-image:url(../images/hr-v1-header-bg-texture.png);
	background-color:transparent;
	background-repeat: repeat-x;
	background-position: 0 0;
	/* border-bottom: 1px solid #666; */
	position: relative;
	z-index: 100;
	}
	.HeaderHomeroomLogo {
		display: block;
		position: absolute;
		top: 18px;
		left: 0;
		width:  196px;
		height: 38px;
		background-image:url(../images/hr-v1-homeroom-header-logo.png);
		background-color:transparent;
		background-repeat:no-repeat;
		background-position:left -0px;
		text-indent: -9999px;
		}
	.HeaderWorkbenchLogo {
		display: block;
		position: absolute;
		top: 30px;
		left: 50%;
		margin-left: -160px;
		width:  320px;
		height: 20px;
		background-image:url(../images/hr-v1-widgetworkbench-logo.png);
		background-color:transparent;
		background-repeat:no-repeat;
		background-position:left -0px;
		text-indent: -9999px;
		}
	#HRApplication > .Header .UserActions {
		height: 24px;
		width: 100px;
		position: absolute;
		right: 12px;
		top: 26px;
		}
		#HRApplication > .Header .UserActions .MDButton {
			display: block;
			background:transparent;
			-pie-background: none;
			background-image:url(../images/hr-core-sprite.png);
			background-color:transparent;
			background-repeat:no-repeat;
			text-indent: -9999px;
			outline:0;
			border:0;
			padding:0;
			width:  26px;
			height: 26px;
			float:right;
			margin-left: 10px;
			}
			#HRApplication > .Header .UserActions .MDButton span {display:none;}

			#HRApplication .Header .UserActions .Logout				{background-position:-52px -877px;}
			#HRApplication .Header .UserActions .Logout.Over		{background-position:-52px -903px;}
			#HRApplication .Header .UserActions .Logout.Pressed,
			#HRApplication .Header .UserActions .Logout.Active		{background-position:-52px -929px;}
			#HRApplication .Header .UserActions .UserProfile		{background-position:0px -877px;}
			#HRApplication .Header .UserActions .UserProfile.Over	{background-position:0px -903px;}
			#HRApplication .Header .UserActions .UserProfile.Pressed,
			#HRApplication .Header .UserActions .UserProfile.Active	{background-position:0px -929px;}
			#HRApplication .Header .UserActions .Menu				{background-position:-26px -877px;}
			#HRApplication .Header .UserActions .Menu.Over			{background-position:-26px -903px;}
			#HRApplication .Header .UserActions .Menu.Pressed,
			#HRApplication .Header .UserActions .Menu.Active		{background-position:-26px -929px;}

	#HRApplication > .Header .TabButtons {
		position: absolute;
		top:70px;
		left:0;
		height: 34px;
		width:100%;
		}
	#HRApplication .DemoModeFlag {
		position: absolute;
		right: 12px;
		background: #c02b00;
		border-top: 0;
		border-radius: 0px 0px 4px 4px;
		padding: 2px 5px;
		color: #eee;
		font-size: 11px;
		text-shadow: 0px 1px #333;
		box-shadow: 0px 0px 5px #333;
		border: 1px solid #555;
		border-top: 0;
		cursor: pointer;
		behavior: url(../css/PIE.htc);
		}

/* HomeroomMainTabs */
.HomeroomMainTabs {
	height:34px;
	overflow:hidden;
	position: relative;
	z-index: 1;
	}
	.HomeroomMainTabs .MDTabs-Tab {
		display: block;
		float:left;
		height: 29px;
		margin-right: 2px;
		margin-top:3px;
 		border-radius: 4px 4px 0px 0px; 
		-moz-border-radius: 4px 4px 0px 0px;
		-webkit-border-radius: 4px 4px 0px 0px;
		background: -webkit-gradient(linear, 0 0, 0 bottom, from(#8D8F91), to(#5B5F63));
		background: -webkit-linear-gradient(#8D8F91 10%, #5B5F63);
		background:	   -moz-linear-gradient(#8D8F91 10%, #5B5F63);
		background:		-ms-linear-gradient(#8D8F91 10%, #5B5F63);
		background:		 -o-linear-gradient(#8D8F91 10%, #5B5F63);
		background:			linear-gradient(#8D8F91 10%, #5B5F63);
		-pie-background: 	linear-gradient(#8D8F91 10%, #5B5F63);
		behavior: url(../css/PIE.htc);
		}
		.HomeroomMainTabs .MDTabs-Tab a {
			display: block;
			text-decoration: none;
			line-height:1;
			padding:8px 10px 0;
			}
			.HomeroomMainTabs .MDTabs-Tab .CloseTabButton {
				display: block;
				float:left;
				position:relative;
				outline:0;
				border:0;
				width:  14px;
				height: 14px;
				left: -2px;
				top: 0px;
				margin-right: 4px;
				background-image:url(../images/hr-core-sprite.png);
				background-color:transparent;
				background-repeat:no-repeat;
				background-position:right -567px;
				text-indent: -9999px;
				}
				.HomeroomMainTabs .MDTabs-Tab .CloseTabButton.Over,
				.HomeroomMainTabs .MDTabs-Tab.Selected .CloseTabButton.Over {background-position:right -567px;}
			.HomeroomMainTabs .MDTabs-Tab.Selected .CloseTabButton {background-position:right -553px;}

			.HomeroomMainTabs .MDTabs-Tab span {
				display: block;
				float:left;
				font-size: 13px;
				font-weight: bold;
				line-height:1;
				color:#333;
				}
		.HomeroomMainTabs .MDTabs-Tab.Selected {
			background-image:url(../images/hr-v1-body-bg-texture.png);
			-pie-background: url(../images/hr-v1-body-bg-texture.png), repeat-x;
			background-color:transparent;
			background-repeat:repeat-x;
			background-position:0 0;
			border: 1px solid #999;
			height: 34px;
			margin-top:0;
	 		border-radius: 4px 4px 0px 0px; 
			-moz-border-radius: 4px 4px 0px 0px;
			-webkit-border-radius: 4px 4px 0px 0px;
			behavior: url(../css/PIE.htc);
			}
			.HomeroomMainTabs .MDTabs-Tab.Selected a {padding-top:10px;}
			.HomeroomMainTabs .MDTabs-Tab.Selected span {
				color: #387FE8;
				text-shadow: #fff 0px 1px 0px;
				}
.MainTabContentsContainer {
	position: absolute;
	z-index: 1;
	top:102px;
	left:0;
	right:0;
	bottom:0;
	overflow:hidden;
	background-image:url(../images/hr-v1-body-bg-texture.png);
	background-color:transparent;
	background-repeat:repeat;
	background-position:0 0;
	border-top: 1px solid #666;
	}
	.HomeroomMainTabContents {
		border-top: 1px solid #fff;
		}
	.TabCanvas {
		position: absolute;
		top:51px;
		bottom:0;
		width:  100%;
		overflow-y:auto;
		overflow-x:hidden;
		}
		.TabCanvasInner {
			overflow: hidden;
			padding-top: 10px;
			}
	.TabCanvasNavBar {
		position: absolute;
		z-index: 10000;
		top:0;
		left:0;
		right:0;
		border-top: 1px solid #fff;
		height: 50px;
		display: block;
		background-image:url(../images/hr-v1-body-bg-texture.png);
		background-color:transparent;
		background-repeat:repeat-x;
		background-position:0 0;
		}
		.TabCanvasNavBar.Shadow .NavBarShadow {
			position: absolute;
			height: 5px;
			left:0;
			right:0;
			bottom:-5px;
			background-image:url(../images/hr-v1-navbar-shelf-shadow.png);
			background-color:transparent;
			background-repeat:repeat-x;
			background-position:0 0;
			}
		.TabCanvasNavBarInner {padding-top:13px;}
		.Spotlight .TabCanvasNavBarInner {padding-top:4px;}
			.WidgetCanvasNavTrigger {
				font-size: 13px;
				color: #aaa;
				text-shadow: #fff 0px 1px 0px;
				display:inline-block;
				line-height:1;
				margin-right: 23px;
				cursor: pointer;
				}
				.WidgetCanvasNavTrigger span {
					display:inline-block;
					font-weight: bold;
					padding-top:5px;
					}
				.WidgetCanvasNavTrigger:hover {
					color: #999;
					}
			.WidgetCanvasNavTriggerIcon {
				width:  25px;
				height: 25px;
				float: left;
				margin-right: 7px;
				display: none;/*TODO: Delete */
				}
/* /HomeroomMainTabs */

/* WIDGET */
.Widget.Width-1,
.Widget.Width-2,
.Widget.Width-3,
.Widget.Width-4,
.Widget.Width-5,
.Widget.Width-6,
.Widget.Width-7,
.Widget.Width-8,
.Widget.Width-9,
.Widget.Width-10,
.Widget.Width-11,
.Widget.Width-12 {float: left;}

.Widget.Width-1  {width:60px;}
.Widget.Width-2  {width:140px;}
.Widget.Width-3  {width:220px;}
.Widget.Width-4  {width:300px;}
.Widget.Width-5  {width:380px;}
.Widget.Width-6  {width:460px;}
.Widget.Width-7  {width:540px;}
.Widget.Width-8  {width:620px;}
.Widget.Width-9  {width:700px;}
.Widget.Width-10 {width:780px;}
.Widget.Width-11 {width:860px;}
.Widget.Width-12 {width:940px;}

.IEWidgetWrapper {float:left; position:relative; margin:0px 10px 22px;} /* IE Hack for PIE */
.Widget {
	margin:0px 10px 22px;
	position:relative;
	background-color: #eee;
	border-radius: 4px; 
	box-shadow: rgb(35,35,35) 0px 0px 5px;
	behavior: url(../css/PIE.htc);
	}
	.IEWidgetWrapper .Widget {margin:0;}
	/* WidgetHeader */
	.WidgetHeader {
		height:29px;
		position:relative; 
		overflow:visible;
		border-bottom:1px solid #ccc;
		border-radius: 4px 4px 0 0;
		background: #e7e7e7;
		background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FFFFFF), to(#e7e7e7));
		background: -webkit-linear-gradient(#FFFFFF 10%, #e7e7e7);
		background:	   -moz-linear-gradient(#FFFFFF 10%, #e7e7e7);
		background:		-ms-linear-gradient(#FFFFFF 10%, #e7e7e7);
		background:		 -o-linear-gradient(#FFFFFF 10%, #e7e7e7);
		background:			linear-gradient(#FFFFFF 10%, #e7e7e7);
		/* -pie-background: 	linear-gradient(#FFFFFF 10%, #e7e7e7); */
		behavior: url(../css/PIE.htc); */
		}
		.WidgetActions {
			display: block;
			position:absolute;
			top:0px;
			right:0px;
			padding-top: 4px;
			padding-right: 4px;
			width:33%;
			height:29px;
			overflow:hidden;
			}
			.WidgetActions .MDButton {
				display: block;
				outline:0;
				border: none;
				width:  20px;
				height: 20px;
				float:right;
				margin-left: 2px;
				background:transparent;
				-pie-background: none;
				background-image:url(../images/hr-core-sprite.png);
				background-color:transparent;
				background-repeat:no-repeat;
				text-indent: -9999px;
				}
				.WidgetActions .MDButton.ToolbarRefresh 			{background-position:-20px -110px;}
				.WidgetActions .MDButton.ToolbarRefresh.Over		{background-position:-20px -130px;}
				.WidgetActions .MDButton.ToolbarRefresh.Pressed,
				.WidgetActions .MDButton.ToolbarRefresh.Active		{background-position:-20px -150px;}
				.WidgetActions .MDButton.ToolbarMenu 				{background-position:-60px -110px;}
				.WidgetActions .MDButton.ToolbarMenu.Over			{background-position:-60px -130px;}
				.WidgetActions .MDButton.ToolbarMenu.Pressed,
				.WidgetActions .MDButton.ToolbarMenu.Active 		{background-position:-60px -150px;}
				.WidgetActions .MDButton.ToolbarProfile 			{background-position:-40px -110px;}
				.WidgetActions .MDButton.ToolbarProfile.Over		{background-position:-40px -130px;}
				.WidgetActions .MDButton.ToolbarProfile.Pressed,
				.WidgetActions .MDButton.ToolbarProfile.Active		{background-position:-40px -150px;}
				.WidgetActions .MDButton.ToolbarDate 				{background-position:-0px  -110px;}
				.WidgetActions .MDButton.ToolbarDate.Over			{background-position:-0px  -130px;}
				.WidgetActions .MDButton.ToolbarDate.Pressed,
				.WidgetActions .MDButton.ToolbarDate.Active			{background-position:-0px  -150px;}
				.WidgetActions .MDButton.ToolbarPlus 				{background-position:-0px  -50px;}
				.WidgetActions .MDButton.ToolbarPlus.Over			{background-position:-0px  -70px;}
				.WidgetActions .MDButton.ToolbarPlus.Pressed,
				.WidgetActions .MDButton.ToolbarPlus.Active			{background-position:-0px  -90px;}
				.WidgetActions .MDButton.ToolbarFullscreen 			{background-position:-40px -50px;}
				.WidgetActions .MDButton.ToolbarFullscreen.Over		{background-position:-40px -70px;}
				.WidgetActions .MDButton.ToolbarFullscreen.Pressed,
				.WidgetActions .MDButton.ToolbarFullscreen.Active	{background-position:-40px -90px;}
				.WidgetActions .MDButton.ToolbarDownload 			{background-position:-80px -50px;}
				.WidgetActions .MDButton.ToolbarDownload.Over		{background-position:-80px -70px;}
				.WidgetActions .MDButton.ToolbarDownload.Pressed,
				.WidgetActions .MDButton.ToolbarDownload.Active		{background-position:-80px -90px;}
				.WidgetActions .MDButton.ToolbarPrint 				{background-position:-60px -50px;}
				.WidgetActions .MDButton.ToolbarPrint.Over			{background-position:-60px -70px;}
				.WidgetActions .MDButton.ToolbarPrint.Pressed,
				.WidgetActions .MDButton.ToolbarPrint.Active		{background-position:-60px -90px;}
				.WidgetActions .MDButton.ToolbarBack 				{background-position:-40px -170px;}
				.WidgetActions .MDButton.ToolbarBack.Over			{background-position:-40px -190px;}
				.WidgetActions .MDButton.ToolbarBack.Pressed,
				.WidgetActions .MDButton.ToolbarBack.Active			{background-position:-40px -210px;}

		.WidgetToolbarSpinner {
			display: block;
			float: left;
			height: 16px;
			margin-right: 4px;
			margin-top: 12px;
			width: 16px;
			}
		.WidgetToolbarIcon {
			width:  18px;
			height: 18px;
			position: absolute;
			top:  6px;
			left: 6px;
			background-image:url(../images/WIDGET_TOOLBAR_ICON_FPO.png);
			background-color:transparent;
			background-repeat:no-repeat;
			background-position:left -0px;
			text-indent: -9999px;
			display: none; /*TODO: Delete */
			}
		.WidgetToolbarName {
			color:#444;
			font-weight: bold;
			text-shadow: #fff 0px 1px 0px;
			font-size: 13px;
			line-height:1;
			position: absolute;
			top:  8px;
			left: 8px;
			/*left: 30px; TODO: put BACK! */
			}

	.WidgetContentWrapper {
		position: relative;
		background: #fff;
		}
	.WidgetContentContainer {
		position: absolute;
		z-index: 100;
		top:0;
		right:0;
		bottom:0;
		left:0;
		background:#fff;
		overflow: auto;
		border-bottom: 1px solid #ccc;
		}
		.WidgetContentContainer .WidgetEmptyMessage {
			width:  100%;
			color: #ccc;
			font-size: 14px;
			line-height:1;
			font-weight: bold;
			padding:85px 0px 18px;
			text-align: center;
			}
		.WidgetContentContainer .WidgetFailureNotice {
			text-align: center;
			color:#ccc;
			font-size: 16px;
			}

	.WidgetFooter {
		height:13px;
		background:#eee;
		position:relative;
		border-radius: 0 0 4px 4px; 
		behavior: url(../css/PIE.htc);
		}
		.WidgetFooter .WidgetFooterText {
			font-size: 11px;
			line-height:1;
			text-shadow: #fff 0px 1px 0px;
			padding-left:4px;
			}
	.WidgetDownloadIframeContainer {overflow:hidden;}
/* /WIDGET */


/* Styles for MD.Popovers used in Homeroom */
.MDPopover {
	z-index: 5000;
	}
.MDPopover.Message h3 {
	font-size: 16px;
	font-weight: bold;
	line-height:1;
	margin-bottom:10px;
	}
.MDPopover.Message p {
	font-size: 13px;
	line-height:1.2;
	margin-bottom:10px;
	}
/* UploadFormModal */
.UploadFormModal .PopoverContents{
    padding: 0 10px;
    }
.UploadFormModal .MDUploadListContainer {
    height:158px;
    }
/* /UploadFormModal */



/* Spotlight Buttons */
.MDButton.SpotlightCircle,
.MDButton.Spotlight {
	display: block;
	background-image:url(../images/hr-core-sprite.png);
	background-color:transparent;
	background-repeat:no-repeat;
	text-indent: -9999px;
	outline:0;
	border:0;
	padding:0;
	}
	.MDButton.Spotlight span {display:none;}
	.MDButton.Size-36 {width:  36px; height: 36px;}
	.MDButton.Size-24 {width:  24px; height: 24px;}
	.MDButton.Size-16 {width:  16px; height: 16px;}
	.MDButton.Size-12 {width:  12px; height: 12px;}

	.MDButton.Spotlight.Size-36				{background-position: -0px -625px;}
	.MDButton.Spotlight.Size-36.Over		{background-position: -0px -661px;}
	.MDButton.Spotlight.Size-36.Pressed,
	.MDButton.Spotlight.Size-36.Active		{background-position: -0px -697px;}
	.MDButton.Spotlight.Size-24				{background-position: -0px -733px;}
	.MDButton.Spotlight.Size-24.Over		{background-position: -0px -757px;}
	.MDButton.Spotlight.Size-24.Pressed,
	.MDButton.Spotlight.Size-24.Active		{background-position: -0px -781px;}
	.MDButton.Spotlight.Size-16				{background-position: -48px -733px;}
	.MDButton.Spotlight.Size-16.Over		{background-position: -48px -749px;}
	.MDButton.Spotlight.Size-16.Pressed,
	.MDButton.Spotlight.Size-16.Active		{background-position: -48px -765px;}
	.MDButton.Spotlight.Size-12				{background-position: -80px -733px;}
	.MDButton.Spotlight.Size-12.Over		{background-position: -80px -745px;}
	.MDButton.Spotlight.Size-12.Pressed,
	.MDButton.Spotlight.Size-12.Active		{background-position: -80px -757px;}
	/* SpotlightCircle */
	.MDButton.SpotlightCircle.Size-36				{background-position: -36px -625px;}
	.MDButton.SpotlightCircle.Size-36.Over		 	{background-position: -36px -661px;}
	.MDButton.SpotlightCircle.Size-36.Pressed,
	.MDButton.SpotlightCircle.Size-36.Active		{background-position: -36px -697px;}
	.MDButton.SpotlightCircle.Size-24				{background-position: -24px -733px;}
	.MDButton.SpotlightCircle.Size-24.Over		 	{background-position: -24px -757px;}
	.MDButton.SpotlightCircle.Size-24.Pressed,
	.MDButton.SpotlightCircle.Size-24.Active		{background-position: -24px -781px;}
	.MDButton.SpotlightCircle.Size-16				{background-position: -64px -733px;}
	.MDButton.SpotlightCircle.Size-16.Over		 	{background-position: -64px -749px;}
	.MDButton.SpotlightCircle.Size-16.Pressed,
	.MDButton.SpotlightCircle.Size-16.Active		{background-position: -64px -765px;}


/* /Spotlight Buttons */