.preh1 {
  color:#4795b1 !important;
}
body {
	background:#f5f5f5;
	font-family: 'Lucida Grande', verdana, arial, helvetica, sans-serif;
	font-size:11px;
}
em {
	font-style:normal;
}
input[type="text"] {
	border:1px #bbb solid;
	padding:6px 7px 4px;
	font-size:12px;
}
textarea {
  height:15px;
  width:100%;
	border:none;
	background:none;
	color:#aaa;
	font-size:12px;
	resize:none;
	-webkit-appearence:none;
	cursor:pointer;
}
textarea:focus {
  outline:none;
  cursor:text;
}
textarea.hasInput {
  height:50px !important;
  color:#444 !important;
}
#header {
	position:relative;
	background:#111;
	height:45px;
}
	#header h1 {
		font-size:20px;
		padding:11px 0 0 25px;
		color:#fff;
	}
#nav {
	position:absolute;
	left:200px;
	bottom:0;
	list-style:none;
}
	#nav li {
		float:left;
		height:45px;
		overflow:hidden;
	}
	#nav li:hover {
		background:#222;
	}
	#nav li.active, #nav li.active:hover{
		background:#207d9e;
	}
		#nav li a {
			padding:15px 20px;
			display:block;
			font-size:13px;
			font-weight:700;
			text-transform:uppercase;
			color:#fff;
			text-decoration:none;
		}
#user {
	position:absolute;
	right:25px;
	top:14px;
	color:#fff;
}
	#user li {
		float:left;
		overflow:hidden;
		margin:0 7px;
	}
		#user li a {
			color:#aaa;
			display:block;
		}		
#wrapper {
	position:relative;
	padding:25px;
	min-width:850px;
}
#content {
	margin:0 auto;
	border-collapse: collapse;
	clear:left;
	width:100%;
}
#content td.left {
	width:67%;
	vertical-align:top;
}
#content td.right {
	width:33%;
	vertical-align:top;
}
.box {
	padding:14px;
	background:#fff;
	-webkit-border-radius:4px;
	border:1px #dfdfdf solid;
	border-top:1px #f0f0f0 solid;
	margin-bottom:20px;
}
.right .box {
  margin-left:20px;
}
.box h2 {
	font-size:16px;
	font-weight:400;
	color:#777;
	letter-spacing:1px;
	border-bottom:1px #dfdfdf solid;
	padding-bottom:5px;
}
.box table {
	margin:7px 0;
}
td.date a {
	text-decoration:none;	
}
td.date div {
	display:block;
	width:125px;
	padding:5px;
}
td.date span {
	padding:4px 7px;
	display:block;
	-webkit-border-radius:3px;
	border: 1px #f5f5f5 solid;
	color:#222;
	text-align:center;
	background: green;
    color: white;
}
td.type {
	width:100%;
	font-size:12px;
	padding:8px 0 0 10px;
	color:#222;
}
td.type em {
	color:rgba(0,0,0,.25);
	font-size:11px;
}
td.status {
	text-transform:uppercase;
	padding:8px 10px 0;
	font-size:12px;
	text-align:right;
	color:#aaa;
}
td.remove {
	padding-top:8px;
}
td.remove a {
 	width:14px;
 	display:block;
 	text-indent:-9999px;
 	height:14px;
 	background:url(../img/close.png) no-repeat;
 	opacity:0.5;
}
td.remove a:hover{
  opacity:1;
}
.pending .status {
	color:orange;
}
td.person {
	padding-top:8px;
	text-align:right;
  	width:150px;
  	display:block;
  	color:#aaa !important;
  	text-transform:none;
  	font-size:11px;
}
.pending .date span {
	background:orange;
	border:none;
	color:#fff;
}
.approved .status {
	color:green;
}
.approved .date span {
	background:green;
	color:#fff;
	border:none;
}

.cancel .date span {
	background:red;
	color:#fff;
	border:none;
}


.right .largeButton {
  margin:0 0 20px 20px;
	text-align:center;
	background:#111;
	border:none;
	-webkit-border-radius:4px;	
}
.right .largeButton a {
	color:#fff;
	font-size:16px;
	padding:8px 15px;
	letter-spacing:1px;
	display:block;
	text-decoration:none;
}

/* Summary */
#summary table {
	width:100%;
  position:relative;
}
#summary {
	padding:20px 0;
}
#summaryVacation,
#summaryESL {
	width:50%;
}
#summary h1 em	{
	font-size:20px;	
}
#summary td h3 {
	font-size:16px;
	font-weight:normal;
	color:#4795b1;
	position:relative;
	display:block;
	margin:0 30px;
	zoom:1;
}
#summary td h3 span {
	position:absolute;
	right:0;
	color:#444;
}
#summary td h3 span em {
	color:#aaa;
}
#summary .tube-wrap {
	width:100%;
	margin-top:15px;
}
#summary .tube {
	margin:0 30px;
	height:28px;
	-webkit-border-radius:14px;
	background:-webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(.5, rgb(250,250,250)),
	    color-stop(1, rgb(230,230,230))
	);
	border:1px #dfdfdf  solid;
	position:relative;
	overflow:hidden;
}
#summary .tube em {
  background:#4795b1;
	background:-webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0, rgb(48,126,159)),
	    color-stop(1, rgb(71,149,177))
	);
	height:28px;
	-webkit-border-top-left-radius:14px;
	-webkit-border-bottom-left-radius:14px;
	position:absolute;
	top:0;
	left:0;
}
#summary .tube em.full {
  -webkit-border-top-right-radius:14px;
	-webkit-border-bottom-right-radius:14px;
}
#summaryDetails {
	font-size:13px;
	color:#444;
	margin:20px 30px 10px;
}
#summaryDetails span,
#summaryDetails em {
	color:#aaa;
	margin:0 7px 0 25px;
}
#summaryDetails span {
	margin-left:0;
}




/* Create New Request */
#addReq, #addBonus, #addEsp {
	padding:20px 25px;
	margin-left:20px;
}
#addReq h2, #addBonus h2 {
	margin-bottom:15px;
	position:relative;
}
#addReq h2 a {
  position:absolute;
  right:0;
  font-size:11px;
  letter-spacing:0;
  top:3px;
  color:#777;
  text-decoration:none;
}
#addReq h2 a:hover {
  text-decoration:underline;
}

#addReq .type p {
	margin-top:20px;
}
#addReq .type ul {
	margin:10px 0 30px;
	list-style:none;
}
#addReq .type li {
	display:block;
	clear:both;
	padding:5px 10px;
	font-size:12px;
}
#addReq .type li input {
	float:left;
	clear:left;
	margin-right:15px;
}
#addReq .type li label {
	display:inline-block;
	float:left;
}
#addReq .paid p {
	float:left;
	margin-right:15px;
}
#addReq .paid input {
	float:left;
}
#addReq .paid label {
	float:left;
	padding-left:5px;
	margin-right:10px;
	font-size:12px;
	padding-top:1px;
}
#addReq .note {
  clear:both;
  padding-top:15px;
}
.ie #addReq .note {
  padding-top:0;
}
#addReq .note div, #addBonus .note div {
	padding:5px 10px;
	border:1px #bbb solid;
}




/* Create New Especial Request */

#addEsp h2 a {
  position:absolute;
  right:0;
  font-size:11px;
  letter-spacing:0;
  top:3px;
  color:#777;
  text-decoration:none;
}
#addEsp h2 a:hover {
  text-decoration:underline;
}

#addEsp .type p {
	margin-top:20px;
}
#addEsp .type ul {
	margin:10px 0 30px;
	list-style:none;
}
#addEsp .type li {
	display:block;
	clear:both;
	padding:5px 10px;
	font-size:12px;
}
#addEsp .type li input {
	float:left;
	clear:left;
	margin-right:15px;
}
#addEsp .type li label {
	display:inline-block;
	float:left;
}


#addEsp .paid p {
	float:left;
	margin-right:15px;
}
#addEsp .paid input {
	float:left;
}
#addEsp .paid label {
	float:left;
	padding-left:5px;
	margin-right:10px;
	font-size:12px;
	padding-top:1px;
}
#addEsp .note {
  clear:both;
  padding-top:15px;
}
.ie #addEsp .note {
  padding-top:0;
}
#addEsp .note div, #addBonus .note div {
	padding:5px 10px;
	border:1px #bbb solid;
}


/* Create New User */
#addUser {
	padding:20px 25px;
	display:none;
}
#addUser h2 {
	margin-bottom:15px;
}
#addUser .firstName .label {
	font-size:12px;
	padding:5px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .firstName input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .department td {
	padding-top:15px;
}
#addUser .department .label {
	font-size:12px;
	padding:20px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .department input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .lastName td {
	padding-top:15px;
}
#addUser .lastName .label {
	font-size:12px;
	padding:20px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .lastName input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .email td {
	padding-top:15px;
}
#addUser .email .label {
	font-size:12px;
	padding:20px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .email input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .type p {
	margin-top:20px;
}
#addUser .type p em {
  color: #999;
}
#addUser .type ul {
	margin:10px 0 30px;
	list-style:none;
}
#addUser .type li {
	display:block;
	clear:both;
	padding:5px 10px;
	font-size:12px;
}
#addUser .type li input {
	float:left;
	clear:left;
	margin-right:15px;
}
#addUser .type li label {
	display:inline-block;
	float:left;
}
#addUser .dateHire .label {
	font-size:12px;
	padding:5px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .dateHire input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .firstYear td {
	padding-top:15px;
}
#addUser .firstYear .label {
	font-size:12px;
	padding:20px 0 0 0;
	color:#444;
	display:block;	
	width:120px;
}
#addUser .firstYear input {
	display:block;
	margin:0 2px;
	width:90%;
}
#addUser .type li label {
	display:inline-block;
	float:left;
}
#addUser .hrLead td {
	padding-top:17px;
}
#addUser .hrLead label {
	font-size:12px;
	padding:2px 10px 0 0;
	color:#444;
	display:block;	
	width:80px;
}
#addUser .hrLead select {
	display:block;
	margin:0 2px;
	width:90%;
}

/* User List */
.userList {
  padding:20px 25px;
}
.userList h2 {
  margin-bottom:15px;
  position:relative;
  zoom:1;
}
.userList h2 a {
  position:absolute;
  right:0;
  font-size:11px;
  letter-spacing:0;
  top:3px;
  color:#777;
  text-decoration:none;
}
.userList h2 a:hover {
  text-decoration:underline;
}
.userList ul {
  list-style:none;
}
.userList ul li {
  position:relative;
  margin-bottom:4px;
}
.userList li a {
  color:#444;
  text-decoration:none;
  font-size:13px;
  padding:6px 0;
}
.userList li a.deact {
  position:absolute;
  color:#999;
  font-size:80%;
  right:0;
  visibility:hidden;
}
.userList li:hover a.deact {
  visibility:visible;
}
.userList li:hover li a.deact {
  visibility:hidden;
}
.userList li:hover li:hover a.deact {
  visibility:visible;
}
.userList li a:hover {
  color:#222;
  text-decoration:underline;
}
.userList li ul {
  border-top:1px #ddd solid;
  padding:4px 0 4px 15px;
}
.userList li ul li {
  padding-left:15px;
}


/* Request */
#request {
	padding:20px 0;
}
#request table {
	width:100%;
	margin:0;
}
#request #title {
	width:70%;
}
#request #dateRange {
	width:30%;
}
#request #dateRange div {
	margin-right:20px;
	text-align:center;
	font-size:20px;
	padding:11px 0;
	-webkit-border-radius:5px;
	border: 1px #f5f5f5 solid;
	color:#777;
}
#request #dateRange p {
  margin:7px 22px 0 0;
  font-size:11px;
  color:#777;
  clear:both;
}
#request #dateRange p em {
  color:#444;
  display:block;
  float:right;
}
#request h3 {
	font-size:28px;
	font-weight:normal;
	color:#444;
  position:relative;
  zoom:1;
	display:block;
	margin:5px 30px 2px;
}
#request h3 em {
  font-size:20px;
  color:#777;
}
#request h4 {
  font-size:13px;
  color:#ddd;
  margin:0 30px;
  font-weight:400;
}
#request #title p {
  font-size:14px;
  line-height:17px;
  color:#444;
  margin: 15px 30px 5px;
}
#comments {
  margin:20px 0;
  padding:15px 20px;
}
#comments h3 {
 	font-size:17px;
	font-weight:normal;
	color:#444;
	border-bottom:1px #ddd solid;
	padding-bottom:5px;
  position:relative;
  zoom:1;
	display:block;
	margin-bottom:15px;
}
#comments ul {
  list-style:none;
}
#comments li {
  display:block;
  padding:10px;
  font-size:12px;
  color:#444;
  line-height:17px;
}
#comments li span {
  font-weight:bold;
}
#comments li em {
  color:#999;
  font-style:normal;
  font-size:9px;
  display:block;
}
#comments form {
  padding:10px;
}
#comments form div {
  display:block;
  background:#fff;
  border:1px #ddd solid;
  padding:5px;
  cursor:pointer;
}
#commentSubmit {
  display:none !important;
  margin-top:15px;
}
.show-button #commentSubmit {
  display:inline !important;
}
#files {
  padding:15px 20px;
}
#files h3 {
 	font-size:17px;
	font-weight:normal;
	color:#444;
	border-bottom:1px #ddd solid;
	padding-bottom:5px;
	display:block;
}
#files form {
  padding:10px;
  display:none;
  padding-bottom:0;
}
#files form input {
  display:block;
  margin-bottom:15px;
}
#files ul {
  list-style:none;
}
#files li {
  display:block;
  padding:10px;
  font-size:12px;
  color:#444;
  line-height:17px;
}
#files li a {
  color:#999;
  font-weight:bold;
}
#files li em {
  color:#999;
  font-style:normal;
  font-size:9px;
}
#files li em a {
  text-decoration:none;
  font-weight:normal;
}
#files li em a:hover {
  text-decoration:underline;
  color:#777;
}
#uploadTrigger {
  border:1px #ddd solid;
  color:#aaa;
  font-size:12px;
  padding:5px;
  cursor:pointer;
  margin:10px;
}
.pendingReq {
  border-left:10px orange solid !important;
}
.pendingReq #dateRange div {
	border:none;
	color:#fff !important;
	background:orange;
}
.approvedReq {
  border-left:10px green solid !important;
}

.cancelReq {
  border-left:10px red solid !important;
}
.approvedReq #dateRange div {
	border:none;
	color:#fff !important;
	background:green;
}

.cancelReq #dateRange div {
	border:none;
	color:#fff !important;
	background:red;
}
.info, .success, .warning, .error {
    margin: 10px 0px 20px;
    padding:10px 10px 9px 32px;
    background-repeat: no-repeat;
    background-position: 10px center;
	  -webkit-border-radius:4px;
	  font-size:13px;
	  list-style:none;
}
.info {
    color: #00529B;
    background-color: #BDE5F8;
}
.success {
    color: #4F8A10;
    padding:10px 10px 9px;
    background-color: #DFF2BF;
}
.warning {
    color: #9F6000;
    background-color: #FEEFB3;
}
.error {
    color: #D8000C;
    background-color: #FFBABA;
}
.sort {
	color:#aaa;
	text-align:right;
	padding:10px;	
}
.sort a{
	color:#444;
}
.sort a:visited{
	color:#444;
}
#dateRange .workingDays {
  font-size:20px !important;
  text-align:center;
  margin-bottom:5px;
  border-bottom:1px #ddd solid;
  padding:5px 0 7px;
}
#hrSummary {
  position:relative;
  zoom:1;
}
#hrSummary table {
  width:100%;
  text-align:center;
}
#hrSummary table td {
  padding:5px 0 0;
}
#hrSummary table .tableHead {
  background:#f0f0f0;
}
#hrSummary table .tableHead td {
  padding:5px 0;
  text-transform:uppercase;
  color:#666;
  font-weight:bold;
}
#hrSummary h2 {margin-top:30px; border-bottom:none;}
#hrSummary h1 {
  font-size:30px;
  font-weight:400;
  color: #333;
  margin-top:5px;
}
#hrSummary .total {
  position:absolute;
  right:20px;
  top:20px;
  border:1px #ddd solid;
  -webkit-border-radius:4px;
  padding:7px;
  font-size:15px;
  text-align:right;
}
.ie #hrSummary .total {
  width:250px;
}
#hrSummary .total span {
  margin:0 5px;
  color:#999;
}
#hrSummary .total span em {
  color:#333;
}
#hrSummaryYear {
  position:absolute;
  top:26px;
  left:255px;
}
.reqButtons {
  margin:5px 0 0 30px;
  position:relative;
  zoom:1;
  overflow:hidden;
}
.reqButtons form {
  float:left;
}
.removeReq {
  float:left;
  margin:25px 0 0 10px;
  font-size:1.2em;
  color:#999;
}
.removeReqInd {
  margin:20px 0 0;
  color:#999;
  font-size:1.1em;
  padding-left:20px;
 	background:url(../img/close.png) left center no-repeat;
 	text-decoration:none;
}
.removeReqInd:hover {
  text-decoration:underline;
}
#summary {
  position:relative;
  zoom:1;
}
#summary h1 {
  font-size:30px;
  font-weight:400;
  color: #333;
  margin-top:5px;
  margin-left:30px;
  margin-bottom:20px;
}
#userSummaryYear {
  position:absolute;
  top:32px;
  left:265px;
}
#managerSummaryYear {
  position:absolute;
  top:32px;
  left:265px;
}
.emptyYear {
  left:190px !important;
}
.hasInput {
  color:#444 !important;
}
#login {
  width:300px;
  margin:150px auto 0;
  padding:20px;
	background:#fff;
	-webkit-border-radius:4px;
	border:1px #dfdfdf solid;
	border-top:1px #f0f0f0 solid;
	position:relative;
}
#login .logo {
  display:block;
  background:url(../img/preh-logo.png) center no-repeat;
  height:75px;
  margin-bottom:30px;
  text-indent:-9999px;
}
#login label, #login input {
  display:block;
}
#login .input {
  padding:7px 9px 6px;
  border:1px #bbb solid;
  font-size:12px;
  width:200px;
  margin:5px 0 10px;
}
.forgot-password {
  color:#999;
  position:absolute;
  right:20px;
  bottom:23px;
}


/* User List */
#holidayList {
  padding:20px 25px;
}
#holidayList h2 {
  margin-bottom:5px;
  position:relative;
}
#holidayList h2 a {
  position:absolute;
  right:0;
  font-size:11px;
  letter-spacing:0;
  top:3px;
  color:#777;
  text-decoration:none;
}
#holidayList h2 a:hover {
  text-decoration:underline;
}
#holidayList ul {
  list-style:none;
}
#holidayList li {
  font-size:13px;
  margin-bottom:3px;
  position:relative;
}
#holidayList li em {
  color:#999;
  font-size:11px;
}
#holidayList li a {
  position:absolute;
  color:#999;
  font-size:80%;
  right:0;
  visibility:hidden;
}
#holidayList li:hover a {
  visibility:visible;
}
#addHolidayForm {
  display:none;
  margin-bottom:15px;
}

#myInfo {
  height:0;
  display:none;
  background:#111;
  position:relative;
  overflow:hidden;
}
#myInfo .box {
  width:240px;
  position:absolute;
  right:30px;
}
#myInfo .contain {
  position:relative;
  height:55px;
  width:119px;
  float:left;
}
#myInfo .containFull {
  clear:both;
  padding:7px 0 5px;
}
#myInfo label {
  margin-left:5px;
  color:#999;
}
#myInfo .input {
  padding:7px 9px 6px;
  border:1px #bbb solid;
  font-size:12px;
  width:100px;
  margin:5px 0 10px;
}
#myInfo .ui-button {
  margin-top:10px;
}
#myInfoCancel {
  color:#999;
  text-decoration:none;
  margin-left:10px;
  position:relative;
  top:5px;
  font-size:11px;
}
#myInfoCancel:hover {
  text-decoration:underline;
  color: #777;
}
#userDetails h1 {
  font-size:30px;
  font-weight:400;
  color: #333;
  margin-top:5px;
}
.hr-detail-label {
  float:left;
  margin-top:15px;
  margin-right:30px;
}
.hr-detail-label span {
  font-size:15px;
  margin-right:15px;
}




/* Create requests input overhaul */
.sharedWidthInput {
  position:relative;
  zoom:1;
  margin-bottom:10px;
}
.sharedWidthInput .left {
  position:absolute;
  top:25%;
  left:0;
}
.sharedWidthInput .input {
  margin:0 100px 0 80px;
  z-index:9999;
}
.sharedWidthInput .input input {
  width:100%;
  padding:6px 0 4px;
  display:block;
}
.sharedWidthInput .right {
  position:absolute;
  right:0;
  top:25%;
}

/* Individual line settings */
#startDateWrap .right {
  margin-right:10px;
}
#endDateWrap .dayAmt {
	color:#444;
	margin-right:10px;
	font-size:14px;
}
#endDateWrap .if_halfDay {
  position:absolute;
  top:20%;
  left:0;
  visibility:hidden;
}
#bonusDaysWrap {
  margin-bottom:10px;
}
#addBonus .note {
  margin-top:20px;
}
#pendingReq h2,
#upcomingReq h2, 
#SpecialReq h2, 
#archivedReq h2 {
  display:block;
  position:relative;
}
#pendingReq h2 a,
#upcomingReq h2 a, 
#SpecialReq h2 a, 

#archivedReq h2 a {
  position:absolute;
  right:0;
  font-size:11px;
  letter-spacing:0;
  top:3px;
  color:#777;
  text-decoration:none;
}