@charset "UTF-8";
/* CSS Document */
@import url("reset.css");
@import url("calendar.css");
@import url("summary.css");

/* ------------------------------------------*/
/* -------TOP-LEVEL LAYOUT STYLES -----------*/
/* ------------------------------------------*/

html {
	height:100%;
	}

/* There is IE6 fix for this style*/
body {
	background-color:#fff6df;
	font-family:lucida sans, Lucida Sans Unicode, Verdana, myriad pro, arial, sans serif;
	font-size:62.5%;
	height:100%;
	/*text-align:center;*/
	}
	
#wrapper {
	margin:0 auto 0 auto;
	min-width:600px;
	max-width:1200px;
	font-size:1.2em;
	position:relative;
	}



#header {
	height:75px;
	background:url(/images/header.png) left top repeat-x;
	}

	#logoLink {height:70px; width:300px; display:block; float:left;}
		
	
	#my-info {
		float:right;
		font-size:1.1em;
		margin:0 0 0 20px;
		padding:17px 10px 0 0;
		text-align:right;
		color:#fff;
		}
	
#content {
	background:#fff url(/images/content_bg.png) top left repeat-x;
	margin:0 210px 0 0;
	padding:10px 20px 20px 20px;
	min-height:330px;
	}
	

	

#sidebar {
	float:right;
	/*padding:25px;*/
	width:200px;
	height:319px;
	/*margin-left:-150px;*/
	margin-left:0px;
	background:url(/images/sidebar_dummy.png) top left no-repeat;
	
	}
	

#footer {
	background:url(/images/footer-bg.gif) top left repeat-x;
	position:relative;
	height:106px;
	clear:both;
	font-size:1em;
	text-align:center;
	padding:5px 0 0 0;
	}
	
	#footer span {
		margin:0 5px 0 5px;
		}
		
	#offsite_logo {
	position:relative;
		top:7px;}

/* ---------------------------------------- */
/* -------- MULTI COLUMN LAYOUT ----------- */
/* ---------------------------------------- */

#cols_container {
	padding:5px 20px 20px 20px;
	background-color:#fff;
	}

#three_col_left_container {
	margin:0 540px 0 0;
}

#two_col_left_container_s {
	margin:0 270px 0 0;
	/*border:1px solid blue;*/
	}

#two_col_left_container_m {
	margin:0 370px 0 0;
	/*border:1px solid blue;*/
	}

#two_col_left_container_l {
	margin:0 200px 0 0;
	/*border:1px solid blue;*/
	}
	
#two_col_left_container_half {
	margin:0 500px 0 0;
	/*border:1px solid blue;*/
	}

.left_col {
	float:left;
	margin:0px 15px 0 0;

	}
	
.center_col {
	float:right;
	margin:0px 15px 0 0;
	}
	
.right_col {
	float:right;
	margin:0px 0px 0 0px;
	padding:0;
	}

.s_col {
	width:250px;
	/*border:1px solid green;*/
	}
	
.m_col {
	width:350px;
	/*border:1px solid green;*/
	}

.half_col {
	width:430px;
	/*border:1px solid gray;*/
	}

.wide_col {
	width:100%;
	/*border:1px solid red;*/
	}

/* ------------------------------ */
/* COLUMN CONTENT DIVIDERS        */
/* ------------------------------ */

/*IE FIX*/
.half {width:49%;margin-right:2%; float:left;}
.last {margin:0;}
.line {border-right:1px solid #ccc; padding-right:0.5%; width:48%;}

/* -------------------------------- */
/* ------- LAYOUT STYLES ---------- */
/* -------------------------------- */

hr {
	border:none;
	}

.pagedivider {
	border-top:4px solid #ddd;
	}
	
	div.blue_bg .pagedivider {
		border-top:4px solid #abe2f4;
		}
.divider {
	border-top:1px solid #ddd;
	}

	div.blue_bg .divider {
		border-top:1px solid #abe2f4;
		}
.pagedivider_bottom{
	border-bottom:4px solid #ddd;
	}
	
/* There is IE6 fix for this style*/
.clearfix:after {
	content:"."; display: block; height: 0; clear: left; visibility: hidden
	}
	
.clearfix_both:after {
	content:"."; display: block; height: 0; clear:both; visibility: hidden
	}
	
.clearleft {
	clear:left;
	}	

.blue_bg {
	background-color:#dbf2f9;
	background:#dbf2f9 url(/images/blue_bg.png) top left repeat-x;
	}


/* ---------------------------------------------
---------- TYPOGRAPHY --------------------------
----------------------------------------------*/

h1 {
	font-size:1.6em;
	color:#717171;
	margin:0.6em 0 0.4em 0;
	}

h2 {
	font-size:1.2em;
	font-weight:bold;
	color:#e89403;
	margin:1em 0 0.5em 0;
	}

h3 {
	font-weight:bold;
	margin:1em 0 0.5em 0;}

h4 {
	font-weight:bold;
	}

p {
	line-height:1.5em;
	margin-bottom:1em;

	}

p.caption {
	font-size:1em;
	line-height:1.5em;
	margin:0 0 1em 0;
	}

em {
	font-style:italic;
	}

strong {
	font-weight:bold;
	}
	
a {
	color:#098ebf;
	}

a:hover{
	text-decoration:none;
	}

a:active {
	color:#7ed8f9;
	}

a:visited {
	color:#098ebf;
	}

#main h1 {
	font-size:2.3em;
	margin:0 0 0.3em 0;
	color:#777777;
	font-weight:bold;
	}

#main h2 {
	font-size:1.6em;
	color:#000;
	margin:0 0 1.5em 0;
	}
	
#main p {
	font-size:1.2em;
	line-height:1.6em;
	color:#777777;
	margin:0 0 20px 0;
	}

#main strong {
	font-weight:bold;
	color:#809500;
	}

p.noentries {
	color:#bbb;
	margin:0 0 10px 0;
	}

/* Link back to previous / related page */
.backlink {
	margin:10px 0 10px 0;
	}

/*link to external site, only works in compliant browsers, but degrades gracefully */
.ext_link:after {
	content: url(/images/external_link.png);
	}

ul.bullets {
	list-style:url(/images/bullet.png);
	list-style-position:inside;
	}

	ul.bullets li {
	margin:0 0 0.2em 0;}
	
ul.bullets.outside {
    list-style:url(/images/bullet.png);
    list-style-position:outside;
    left: 20px;
    position: relative;
}

    ul.bullets li {
    margin:0 0 0.2em 0;}

.meta {
	color:#717171;
	font-size:11px;}

/* ------------------------------------------
---------- BREADCRUMB -----------------------
--------------------------------------------*/
#breadcrumb { 
	font-size:0.9em;
	padding:0 0 5px 0;
	border-bottom:1px solid #ddd;
	/*background-color:#dbf2f9;*/
	}
	
#breadcrumb a,
#breadcrumb a:visited {
	background:#d1f1fb; 
	display:block; 
	float:left; 
	color:#00a1cd; 
	text-decoration:none; 
	padding-left:5px;
	}
	
#breadcrumb a:hover {
	color:#e89403;
	}

/* There is IE5 fix for this style*/	
#breadcrumb a span {
	background:url(/images/breadc_middle.png) top right no-repeat; 
	padding:3px 15px 0px 3px; 
	display:inline-block; 
	height:17px;
	}
	
#breadcrumb a.root, 
#breadcrumb a.root_single {
	background:transparent url(/images/breadc_root.png) top left scroll no-repeat; 
	}
	
#breadcrumb a.end span, 
#breadcrumb a.root_single span {
	background:transparent url(/images/breadc_end.png) top right no-repeat;
	}

/* There is IE5 fix for this style*/	
#breadcrumb span {
	padding:3px 15px 0px 5px; display:block; font-weight:bold;
	}

	
/* ------------------------------------------
---------- FORMS ----------------------------
--------------------------------------------*/

form{
	}	

fieldset{
	margin:2em 0 0 0;
/*	border:1px solid black;*/
	}

fieldset.line{
	border-top:1px solid #d1d1d1;
	}

/*fieldset.divider{
	margin:1em 0 1em 0;
	padding:0.3em 0 0.3em 0;
	border-top:1px solid #d1d1d1;
	border-bottom:1px solid #d1d1d1;
	}*/
	
	div.blue_bg fieldset.divider{
		border-top:1px solid #abe2f4;
		border-bottom:none;
		}
	
	

legend{
	display:block;
	padding:0 0 1em 0;
	
	}

.field_group {
	/*border:1px solid #ddd;*/
	margin:0 0 2px 0;
	padding:3px 5px;
	width:100%;
	min-width:400px;
	}
	
/*clearfix for field_group*/
/* There is IE6 fix for this style*/
.field_group:after { 
	content: "."; 	display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } /* overflow: hidden kills any autocomplete DIVs */
	

.field {
	float:left; 
	/*border:1px solid red;*/
	/*width:400px;*/
	}
	
label{
	float:left; 
	width:140px; 
	text-align:right; 
	padding:0 6px 0 0; 
	display:block;
	color:#717171;
	} 
	
input{ 
	width:150px;
	font-size:1.2em;
	padding:1px 5px 0 5px;
	}
	
	input.text{ 
		border:1px solid #ddd;
		height:1.4em;
		}
	
	input.text:focus{ 
		background-color:#FFFFCC;
		}

	input.browse {
		border:1px solid #ddd;
		width:auto;
		}

	input.browse:focus{ 
		background-color:#FFFFCC;
		}
	
	input.chooseService{
		width:auto;
		margin:0;
		}
	
	input.radio{ 
		width:12px;
		margin:10px 10px 0 0;
		}
		
	input.checkbox{ 
		width:26px;
		margin:0px 10px 0 0;
		}
	
	select{
		width:auto;
		font-size:1.2em;
	/*	height:1.6em;*/
		border:1px solid #ddd;
		}
		
		select.standard_width{
		width:160px;
		}
		
		select.multi_select{
		height:120px;
		}
		
		select:focus {
			background-color:#FFFFCC;
			}

.textarea{ 
	font-family:lucida sans, verdana, myriad pro, arial, sans serif;
	font-size:1em;
	border:1px solid #717171;
	height:8em;
	width:250px;
	margin:0 5px 0 0;
	}
	
.textarea:focus{ 
	background-color:#FFFFCC;
	}

.user_form_img {
	/*border:1px solid #ddd;*/
	margin:0px 0 0 0;
	}
	
.user_profile_img {
	/*border:1px solid #ddd;*/
	margin:0px 0 0 0;
	width:176px;
	}
	
	
.service_form_img {
	/*border:1px solid #ddd;
	margin:5px 0 0 0;*/
	}

.service_provider_logo_form_img {
	margin:5px 0 0 0;
	}

/*select {
	background-color:white;
	border:1px solid #ddd;
	}*/
	
/* There is IE5 fix for this style*/
.helpText {
	font-size:1em;
	color:#666666;
	margin:0 0 0 315px;
	font-family:Arial, Helvetica, sans-serif;
	overflow:hidden;
	}
	
	/*prevents file browse input from extending over helptext*/
	.helpText.browse {
		margin:0 0 0 5px;
		float:left;
		width:200px;
		}
	
	.helpText strong {
		color:#00a1cd;
		font-weight:bold;
		}	

	.longHelp{
		width:100px;
		}
	
form span.error-message {
	color:#990000;
	display:block;
	background-color:#FFCCCC;
	text-align:center;
	padding:2px;
	margin:2px 4px 0 0;
	}

form input.required_field{
	border-right:5px solid #e89403;
	}

p.required_field{
	border-left:5px solid #e89403;
	padding:0px 0 0 5px;
	margin:3px 0 0 151px ;
/*	margin:5px 0 0 342px;*/
	}
	
form.rowForm {
	display:inline;
	}

.forgot_password {display:block;margin:5px 0 0 103px;}


/* ------------------------------------------
---------- COMPONENTS -----------------------
--------------------------------------------*/


/*----------- BOX ------------------------*/
/* box container*/
.box {	
	/*float:left;*/
	/*width:55%;*/
	margin:10px 0 0 0;
	
	}

	/* box header */
	.box h3 {
	margin:0 0 0 0;
	font-size:1.1em;
	font-weight:bold;
	margin:0;
	padding:4px 0 3px 5px;
	color:#000;
		}
		
.box h3 a{
	color:#000;	
	text-decoration:none;
/*	border-bottom:1px dotted #000;*/
		}

.box h3 a:hover{
	border-bottom:none;	
		}

.box h3 a:visited{
	color:#000;	
		}
	
	.box.box_blue {
		background:#dbf2f9 url(/images/box_blue_tl.png) top left no-repeat;	
		}
	
	.box_blue h3 {
		background-image: url(/images/box_blue_tr.png);
		background-position: top right ;
		background-repeat:no-repeat;
		}
	
	.box.box_yellow {
		background:#ffce25 url(/images/box_yellow_tl.png) top left no-repeat;	
		}
		
	.box_yellow h3 {
		background-image: url(/images/box_yellow_tr.png);
		background-position: top right ;
		background-repeat:no-repeat;
		}
		
	.box p {
		line-height:1.4em;
		}

	.box_content {
		padding:5px;
		border:1px solid #ddd;
		background:#fff;
		overflow:hidden;
		}
		
		.box_content a {
			color:#098ebf;
			}
			
	.box_action {
		background:#fff;
/*		border:1px dotted #ddd; */
		border-top:none;
		padding: 3px;
		}
			
/*------------ VIEW OPTIONS ---------------------*/
a.view_options_btn {
	border:1px solid #ccc;
	padding:2px 10px 2px 10px;
	color:#aaa;
	text-decoration:none;
	cursor:pointer;}

	a.view_options_btn.inactive {
		background-color:#eee;
		color:#666;}
	
a.view_options_btn:hover {
	background-color:#ffff99;
	border:1px solid #ccc;
	padding:2px 10px 2px 10px;
	color:#aaa;
	text-decoration:none;}


/* ----------- NOTIFICATIONS ------------- */
#notifications {
	background-color:#ffce25;
	padding:0.5em;
	margin-bottom:10px;
	border:1px solid #e89403;
	}
	
#errors {
	background-color:#ffce25;
	margin-bottom:10px;
	padding:0.5em;
	border:1px solid #e89403;
	}

/* ----------- GUIDE TEXT ---------------- */
.guide {
	padding:0.5em;
	border:1px solid #ddd;
	/*ackground:#fff url(/images/guide_bg.png) top left repeat-x;*/
	}
	
/* ---------- MISCELLANNOUS STYLES, possibly move into separate css file -----*/
.field.code {
    background-color:#ffc;
        padding:5px;
    white-space:pre-wrap;
    width:600px;
    }

#faq strong {
	color:#000;
	}
#faq h2 {
	border-top:1px solid #ddd;
	padding:15px 0 0 0;}

.user_profile_img {
		float:left;
		margin:0 10px 0 0;

	/*border:1px solid #aaa;*/
		}
	
.user_profile_info {
	width:50%;
	float:left;
	}

.user_profile_info strong {
	font-size:1.4em;
	}

.user_profile_info a {
	color:#e89403;
	font-weight:bold;
	}
	
.user_profile_extra {
	margin:5px 0 5px 0;
	}

.user_profile_action {
	margin: 3px 0 0 0;
	padding: 3px;
/*	border: 1px dotted #ddd; */
	}

#user_activities ul li {
	margin:0 0 0 10px;
	}
		
#user_activities h4 {
	margin:7px 0 0 0;
	font-weight:bold;
	}

#worker_info_panel,
#worker_calendar_panel,
#worker_skill_matrix_panel {
padding:10px;}

/* --------- LISTS --------------------------*/
.list_container {
	}

.list_action {
/*	border:1px dotted #ddd; */
	padding:2px 2px 0 2px;
	margin:10px 0 0 0;
	}

dl {}
dt {float:left; width:70px; clear:left; color:#717171;}
dd {float:left;}
dt, dd {margin:0 0 5px 0;}

/* ------ DEMO ------------------------------*/
#demo-notice{
	padding:10px;
	border:3px solid #B8001D;
	background-color:#F7BEA9;
	text-align:center;}

/* --------- WORKER/NEW ------------------- */
#user_type_selection {
	padding:5px 10px;}

#user_type_selection fieldset{
	margin-top:0.5em;}
	
/* ---------- DEBUG ------------- */
.d {
	border:1px solid black;}

.b {
	background-color:#66FF99;}
	
/********* RATING, STARS, REVIEWS *******/
.star-rating {
    background:transparent url(/images/stars.png) repeat-x scroll 0pt -16px;
    height:16px;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
    margin:0px;
    padding:0px;
    position:relative;
    width:80px;
}
.star-rating li {
    float:left;
    margin:0px;
    padding:0px;
}
.star-rating li a:link, .star-rating li a:visited {
    border:medium none;
    display:block;
    height:16px;
    outline-color:-moz-use-text-color;
    outline-style:none;
    outline-width:medium;
    padding:0px;
    position:absolute;
    text-decoration:none;
    text-indent:-9000px;
    width:16px;
    z-index:20;
}
.star-rating li a:hover {
    background:transparent url(/images/stars.png) repeat scroll 0pt -32px;
    left:0px;
    z-index:1;
}
.star-rating a.star-rate1 {
    left:0px;
}
.star-rating a.star-rate1:hover {
    width:16px;
}
.star-rating a.star-rate2{
    left:16px;
}
.star-rating a.star-rate2:hover {
    width:32px;
}
.star-rating a.star-rate3 {
    left:32px;
}
.star-rating a.star-rate3:hover {
    width:48px;
}
.star-rating a.star-rate4 {
    left:48px;
}
.star-rating a.star-rate4:hover {
    width:64px;
}
.star-rating a.star-rate5 {
    left:64px;
}
.star-rating a.star-rate5:hover {
    width:80px;
}
.star-rating li.current-rating {
    background:transparent url(/images/stars.png) repeat scroll 0pt 0pt;
    display:block;
    height:16px;
    position:absolute;
    text-indent:-9000px;
    z-index:1;
}
	


.review-list {}	
	
.review-item {padding:5px 0; border-bottom:1px solid #ddd;}
.review-item-property {padding:0 4px 0 0;}
.review-item-information {float:left; width:124px; border-right:1px solid #ddd;	margin-right:5px;}
.review-label {color:#717171; float:left; width:65px;}
.review-user-input {float:left;	width:70%;}	
.review-item-date {margin:0 0 5px 0;}
.review-item-user {margin:5px 10px 5px 0;}
.review-item-comment {margin:3px 0 0 0;}
.review-item-service-rating, .review-item-worker-rating {float:left;}

.review-list-vertical .review-item {border:none;}
.review-list-vertical .review-item-information{border:none; width:96%; border:1px solid #ccc; border-bottom:none; background-color:#fcfcfc; padding:2%;}
.review-list-vertical .review-item-user-image {}
.review-list-vertical .review-item-username {margin-bottom:5px;}
.review-list-vertical .review-user-input {width:96%; padding:2%;}

.resource_img {float:left; width:150px;}
.resource_img img {width:100%;}
.resource_text_infos {float:left; width:500px; border-left:1px solid #ddd; padding-left:10px; margin-left:10px;}
ul.skills{list-style-type:disc; list-style-position:inside;}

.time_select select{margin:0 0 3px 0;}

#choose_calendar_date{width:50%; margin:10px auto; float:none;}
#choose_calendar_date_inner{}
#choose_calendar_date div, #choose_calendar_date form{float:left;}
#choose_calendar_date form{margin-right:10px;}

.ajax_hover {}
.ajax_hoverdestination {position:absolute; border:1px solid #ddd;/* width:500px;*/ background:transparent url(/images/white_85transp_bg.png) repeat; padding:10px 10px 10px 10px; z-index:1000;}

.ajax_hoverdestination #service_show_info {width:250px;}

/* -------------- Utilization data graph ---------------- */
#graph_component {
    padding: 10px;
    margin: 5px;
    border: 1px solid #ddd;
    height: 300px;
}

td.legendLabel {
    cursor: pointer;  
}

.hidden {
    display: none;
}

#show_whole_calendar {
}

.print-link {
    margin-top: 10px;
    float: none;
}

.add-user-to-group {
    padding : 5px;
}

.imageBtn{ 
    width:auto;
    margin: 10px 0 0 152px;
    /*border:1px solid black;*/
    }

.action-button .imageBtn {
    margin: 0 0 0 0;
    }

/* cross browser rounded buttons */
.button {
    display: inline-block;
    background-color: #fe5;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #E89403;
    margin: 5px;
    background: url("/images/btn_bg.png") repeat-x scroll;
    padding: 3px;
/*    behavior: url("/styles/ie-css3.htc"); /* This lets IE know to call the script on all elements which get the 'box' class */
}

a.button,input.button {
    width: auto;
    color: #000;
    text-decoration: none;
    font-weight: bold;
    font-size: 11px;
}


form.button-form {
	border: 0px none;
    display: inline;   
}

/* quite stealth button (gray no background..) */
.button.ninja {
    background-color: #fff !important;
    border: 1px solid #bbb !important;
    background: none !important;
    color: #bbb !important;
    font-weight: normal !important;
}

.group-info {
    width : 190px;
    float : left;
}

.group-tabs {
	width : 740px;
    float : left;
}

input.datepicker {
    width : 90px;
}

/* Cross browser shadowed box */
.future-shadow-box {
  -moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari and Chrome */
  border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */
  -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
  -webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */
  box-shadow: 10px 10px 20px #000; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
  behavior: url("/styles/ie-css3.htc"); /* This lets IE know to call the script on all elements which get the 'box' class */
  border: 1px solid #bbb;
  padding: 10px;
}