/* Elements handles global styling options for time sheet guru */

body {
font-family: 	Helvetica Neue, Helvetica, Arial;
margin: 0px;
font-size: 12px;
color: #555555
}

a  {
color: #18807F;
text-decoration: none;
}

a:hover {
text-decoration: underline;
color: #399A98;
}

/*table styling elements */


.t_head {
color: #18807F;
line-height: 20px;
font-size: 16px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}

.teal {
color: #18807F;
}

tr td {
border: 1px solid  #cccccc;
padding: 5px;
vertical-align: top;
} 

.tr_alt {
background: #e6e6e6;
}

table {
border-collapse: collapse;
width: 745px;
text-align: left top;

}


/* Generic styles you can utilise */

/* This can be used to add the teal to any class for textual highlighting */

.green {
color: #18807F;
}

/* Generic rounded div with light grey border for containig what ever you may choose - NOTE this has no width or height specified */

.rounded{
background: #fff;
border: 1px solid #ccc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
overflow: hidden;
padding: 5px;
}

/* As elements are needed we will ad them here */

.notice{
	text-align: center;
	margin: 1px auto;
	padding: 5px 20px;
	margin-left:200px;
	border: 1px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url('icons/success.png');

}

.warning{
	background: #FFF6BF;
	border: 2px solid #FFD324;
	text-align: center;
	margin: 1px auto;
	padding: 5px 20px;
		margin-left:200px;
}

.error{
	background: #FF5F61;
	border: 2px solid #F00;
	text-align: center;
	margin: 1px auto;
	padding: 5px 20px;
		margin-left:200px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		
		color: #D8000C;
		background-color: #FFBABA;
}

#errorExplanation, #errors {
  width: 400px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #f0f0f0;
}


#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px;
  background-color: #c00;
  color: #fff;
}

#errorExplanation p {
  color: #333;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
}

.fieldWithErrors {
  padding: 2px;
  background-color: red;
  display: table;
}

h4,h2 {
	display:inline ;
}
h2{
	  font-size: 12px;
}

#stats_notes{
	float:right;
	font-size: 9px;
}

.notes {
	padding-bottom:10px;
	padding-top:10px;

}

.input_warning{
position: relative; 
top: -0.5em; 
color: #F00;
font-size: 90%;

}

.staff_detail_field{
	margin-top:20px;
}

.staff_detail_label{
	font-weight: bold;
	width: 150px;
	display:block;
}

.staff_detail_value{
	width: 150px;
}

.skill_item{
	margin:10px;
	margin-left:20px;
}

.skill_item a {
	float: right;
}

.missing_info li{
	margin-left:20px;
}

.provident_fund_entry, .iod_entry, .uif_claimed_entry, .sars_entry, .cv_employment_history_entry{
	font-size: 10px;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	background: #fff;
	border: 1px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	padding: 5px;
	margin-top:20px;
}

.client_list {
	margin:0px;
	padding:0px;
}

.toggle {
	float:right;
}


.searchbox{
	font-size: 25px;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	background: #fff;
	border: 1px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	padding: 5px;
	margin-top:20px;	
}



.small_searchbox{
	margin-top:3px;
	padding:2px;
	font-size: 10px;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	background: #fff;
	border: 1px solid #ccc;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}

#small_search form{
	display:inline;
	margin-left:100px;
}



#small_search_submit{
vertical-align:middle;
}


#search_submit{
		font-size: 25px;
}

.help li{
  margin:20px;
  text-align: left;
/*  font-weight: bold;*/
  padding: 5px 5px 5px 15px;
  font-size: 12px;

}

.search_filter{
	margin:10px;
}
.search_filter p{
	margin-left:20px;
}