/* LiBlue, DaGrey, White,  DarkBl, LiGrey
/* B5D3FF, 808080, FFFFFF, 596880, CCCCCC */

/*--------------------
  	GENERAL CSS
--------------------*/

body {
	font-family: "Lucida Grande", verdana, arial, helvetica, sans-serif;
	background-color:	#E9E9E9;
}

strong {
	font-weight:		bold;
}

a {
	font-weight:		bold;
	color:				#596880;
}

/*--------------------
  	HEADER
--------------------*/

#header {
	background-color: 	#596880;
	color:				#CCCCCC;
	padding-top:		10px;
	margin-bottom:		20px;
}

#header h1 {
	margin-left:		30px;
	margin-bottom:		20px;
	
}

#header h1 a{
	font-weight:		normal;
	font-size:			30px;
	color:				#B5D3FF;
}

/*--------------------
  	HEADER
--------------------*/

#right_navigation {
	position:			absolute;
	left:				680px;
	width:				300px;
	
}


#left_navigation {
	margin-left:		20px;
}

.navigation {
	height:				23px;
}

.navigation li {
	float:				left;
	font-size:			12px;
	margin-left:		10px;
	padding:			5px 10px;
	background-color:	#CCCCCC;
	height:				13px;
}

.navigation li a {
	color:				#596880;
}

.navigation li:hover {
	background-color:	#808080;
	cursor: 			pointer;
}

.navigation li:hover a {
	color:				#B5D3FF;
}

.navigation li.active {
	background-color:   #E9E9E9;
}

.navigation li.active a {
	color:				#596880;
}

.subnavigation {
	padding-top:		5px;
	background-color:	#E9E9E9;
	padding-left:		20px;
}

.subnavigation li {
	background-color:	#E9E9E9;
}

.subnavigation li a{
	font-weight:		normal;
}

.subnavigation li:hover {
	background-color:	#E9E9E9;
	cursor: 			pointer;
}

.subnavigation li:hover a {
	text-decoration:	underline;
	color:				#B5D3FF;
}

.subnavigation li.active {
	background-color:   #E9E9E9;
}

.subnavigation li.active a {
	font-weight:   		bold;	
	color:				#596880;
}


/*----------------------------
  	FLASH MESSAGE
----------------------------*/

#flashMessage {
	margin:					20px 30px;
	padding:				10px;
	width:					570px;
	padding-left:			40px;
	-moz-border-radius: 	15px;
	-webkit-border-radius: 	15px;
	background-color:		#B5D3FF;
	color:					#596880;
	background-repeat:		no-repeat;
	background-position:	15px 10px;
	background-image:		url(/images/icons/flag_blue.png);
	
}

#flashMessage.success {
	background-image:		url(/images/icons/flag_green.png);
}

#flashMessage.warning {
	background-image:		url(/images/icons/flag_orange.png);
}

#flashMessage.error {
	background-image:		url(/images/icons/flag_red.png);
}


/*----------------------------
  	BASIC CONTENT STYLES
----------------------------*/

.content {
	background-color:		#FFFFFF;
	margin:					10px 30px;
	padding:				10px;
	width:					600px;
	-moz-border-radius: 	15px;
	-webkit-border-radius: 	15px;
	color:					#333333;
}

.content p {
	margin-bottom:			10px;
	line-height:			1.3;
}

.mouseover {
	cursor:					pointer;
}

.mouseover:hover {
	background-color:		#D9E8F0;
}

h2 {
	margin:					0px 0px 20px 0px;
	font-size:				20px;
	font-weight:			bold;
	color:					#596880;
}

h2.continued {
	margin-top:				20px;
}

h3 {
	padding-top:			2px;
	font-size:				14px;
	font-weight:			bold;
	vertical-align:			middle;
	color:					#596880;
	margin:					0px 0px 15px 0px;
}

h3.subtitle {
	margin:					-15px 0px 10px 0px;
	padding-top:			2px;
	font-size:				10px;
	vertical-align:			middle;
	color:					#596880;
	font-weight:			normal;
}

h3.subtitle span {
	margin-right:			20px;
}

h3.link {
	background-image:		url(/images/icons/link.png);
	background-repeat:		no-repeat;
	margin:					-15px 0px 15px 0px;
	padding-left:			20px;
	padding-top:			2px;
	font-size:				10px;
	vertical-align:			middle;
	color:					#596880;
	font-weight:			normal;
}

.content hr {
	clear: 					both;
	border:					1px solid #FFF;
	border-top:				2px dotted 	#596880;
}

.content a.more {
	border:					1px solid #DDD;
	background-color:		#EEEEEE;
	-moz-border-radius-topleft: 			15px;
	-webkit-border-top-left-radius: 		15px;
	-moz-border-radius-bottomright:			15px;
	-webkit-border-bottom-right-radius: 	15px;
	margin-right:			2px;
	padding:				5px 10px;
	font-size:				12px;
	color:					#999;
}

.content .calendar {
	margin-bottom:			5px;
	float:					left;
	height:					45px;
	width:					45px;
	margin-right:			10px;
	border:					1px solid #808080;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
}

.content .calendar .month {
	text-align:				center;
	padding:				1px;
	padding-bottom:			4px;
	font-size:				10px;
	background-color:		#596880;
	color:					#B5D3FF;	
}


.content .calendar .day {
	text-align:				center;
	padding-top:			4px;
	color:					#596880;
	font-size:				20px;
}


.content .title {
	margin-left:			60px;
}


.content .warning {
	font-size:				12px;
	color:					#666;
	padding:				10px 30px;
	margin:					0px 0px;
	width:					470px;
	-moz-border-radius: 	15px;
	-webkit-border-radius: 	15px;
	background-image:		url(/images/icons/information.png);
	background-position:	8px 8px;
	background-repeat:		no-repeat;
	background-color:		#B5D3FF;
	min-height:				0px;
}



.content .details {
	font-style: 			italic;
	font-weight:			bold;
	color:					#555;
	background-image:		url(/images/icons/information.png);
	height:					20px;
	background-repeat:		no-repeat;
	padding-left:			20px;
	margin-bottom:			10px;
}


.content .info {
	color:					#555;
	margin-bottom:			10px;
}

.content .options {
	text-align:				right;
	width:					100%;
	padding:				0px 10px;
}

.content .options input[type=button]{
	width:					100%;
	border:					none;
	float:					right;
	padding:				5px 10px;
	margin-bottom:			10px;
	background-color:		#CCCCCC;
	color:					#596880;
	font-size:				14px;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
	cursor: 				pointer;
}

.content .button {
	border:					none;
	padding:				5px 10px;
	margin:					10px 0px;
	background-color:		#CCCCCC;
	color:					#596880;
	font-size:				14px;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
	cursor: 				pointer;
}


.content .button:hover {
	background-color:		#333333;
	color:					#E9E9E9;
}

.content .options input[type=button]:hover {
	background-color:		#333333;
	color:					#E9E9E9;
}



.content .info div {
	margin-bottom:			5px;
}

.content .info div label{
	font-weight:			bold;
	float:					left;
	width:					50px;
	color:					#666;
}

.content .info div span{
	margin-left:			50px;
}

.description{
	font-size:				13px;
	line-height:			1.3;
	margin-bottom:			10px;
	color:					#666;
	text-align:				justify;
	line-height:			140%;
}


/*--------------------
  	CONTROLS
--------------------*/

#controls {
	float:					left;
	position:				absolute;
	margin:					0px 10px 20px 10px;
	width:					230px;
	left:					680px;
	min-height:				400px;
	overflow: 				hidden;
}

#controls h2 {
	font-size:				14px;
	width:					200px;
	border-bottom:			1px dashed #596880;
	padding-bottom:			5px;
}

#controls .button {
    display: 				block;
    float: 					left;
    font: 					normal 12px arial, sans-serif;
    height: 				35px;
    margin-right: 			6px;
    padding-right: 			18px; /* sliding doors padding */
    text-decoration: 		none;
	margin-bottom:			10px;
}

#controls .button span, #controls .button input[type=submit]  {
	color: 					#666;
	font-size:				14px;
    display: 				block;
	height:					20px;
    line-height: 			14px;
	margin:					0px;
	padding:				10px 0 5px 34px;
}



#controls .button input[type=submit]  {
	height:					35px;
    padding: 				6px 0 9px 34px; 
}

#controls .button:hover {
    background-position: 	bottom right;
    outline: 				none; /* hide dotted outline in Firefox */
}

#controls .button:hover span, #controls .button:hover input[type=submit]  {
	cursor:					pointer;
    background-position: 	bottom left;
    padding: 				11px 0 4px 34px; /* push text down 1px */
}

#controls .button:hover input[type=submit]  {
    padding: 				7px 0 8px 34px; /* push text down 1px */
}

#controls .button {
    background: 			transparent url(/images/buttons/end.gif) no-repeat scroll top right;
}

#controls .add span, #controls .add input[type=submit]{
	background: 			transparent url(/images/buttons/add.gif) no-repeat;
}

#controls .edit span, #controls .edit input[type=submit]{
	background: 			transparent url(/images/buttons/edit.gif) no-repeat;
}

#controls .deactivate span, #controls .deactivate input[type=submit]{
	background: 			transparent url(/images/buttons/deactivate.gif) no-repeat;
}

#controls .activate span, #controls .activate input[type=submit]{
	background: 			transparent url(/images/buttons/activate.gif) no-repeat;
}

#controls .print span, #controls .print input[type=submit]{
	background: 			transparent url(/images/buttons/print.gif) no-repeat;
}

#controls .email span, #controls .email input[type=submit]{
	background: 			transparent url(/images/buttons/email.gif) no-repeat;
}

#controls .flag span, #controls .flag input[type=submit]{
	background: 			transparent url(/images/buttons/flag.gif) no-repeat;
}

#controls .unflag span, #controls .unflag input[type=submit]{
	background: 			transparent url(/images/buttons/unflag.gif) no-repeat;
}

#controls .money span, #controls .money input[type=submit]{
	background: 			transparent url(/images/buttons/money.gif) no-repeat;
}

#controls .log {
	float:					left;
}

#controls .log a, #controls .log span {
	border:					1px solid #EEEEEE;
	color:					#596880;
	line-height:			18px;
	font-size:				12px;
	display:				block;
	font-weight:			normal;
	background-color:		#FFFFFF;
	padding:				10px 20px;
	margin-bottom:			10px;
	-moz-border-radius: 	20px;
	-webkit-border-radius: 	20px;
	width:					160px;
	text-align:				justify;
}


#controls .log h3 {
	font-weight:			bold;
	margin-bottom:			5px;
}

#controls .log ul {
	list-style: 			disc inside;
}

#controls .log ul li{
	margin-bottom:			5px;
}

#controls .log .bubble1 {
	-moz-border-radius-topleft: 		0px;
	-webkit-border-top-left-radius: 	0px;
}

#controls .log .bubble0 {
	-moz-border-radius-topright: 		0px;
	-webkit-border-top-right-radius: 	0px;
}

#controls fieldset {
	float:					left;
}

/*--------------------
  	FORM CSS
--------------------*/

div.vertical {
	text-align:				right;
}

div.vertical p {
	margin-top:				10px;
}

form.vertical {
	display:				inline;
}

form.vertical fieldset{
	text-align:				right;
	display:				inline;
}

form div {
	min-height:				30px;
}

form div.content {
	width:					580px;
	padding-left:			20px;
}

form div label {
	float: 					left;
	position:				relative;
	top:					3px;
	font-size:				14px;
	width:					150px;
	line-height:			1.5;
}

form div label sup{
	margin:					0px 5px;
	color:					#921913;
}

form div input[type=text], form div input[type=password] {
	border:					1px solid #CCCCCC;
	width:					200px;
	padding:				3px;
	color:					#333333;
}

form div input[type=text].long {
	width:					400px;
}

form div input[type=text].short {
	width:					100px;
}

form div input[type=text].money {
	width:					180px;
}

form div input[type=checkbox] {
	position:				relative;
	top:					3px;
}

form div img {
	vertical-align:			middle;
}

form div .permalink {
	font-size:				12px;
}

form input[type=submit] {
	border:					none;
	float:					right;
	padding:				5px 10px;
	margin-top:				10px;
	background-color:		#CCCCCC;
	color:					#596880;
	font-size:				14px;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
	cursor: 				pointer;
}

form input[type=button] {
	border:					none;
	float:					right;
	padding:				4px 10px;
	margin-top:				10px;
	border:					1px solid #CCCCCC;
	background-color:		#EEEEEE;
	color:					#596880;
	font-size:				14px;
	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;
	cursor: 				pointer;
}

form div textarea {
	border:					1px solid #CCCCCC;
	padding:				3px;
	color:					#333333;
	width:					400px;
	height:					100px;
}

form input[type=submit]:hover {
	background-color:		#333333;
	color:					#E9E9E9;
}

form input[type=button]:hover {
	background-color:		#333333;
	color:					#E9E9E9;
	border:					1px solid #333333;
	
}


form input[type=submit].more, input[type=button].more{
	background-color:		#DDD !important;
	color:					#596880 !important;
}


form input[type=submit].more:hover, input[type=button].more:hover {
	background-color:		#CCCCCC !important;
	color:					#FFFFFF !important;
}

div.submit {
	border-top:				1px dashed #CCCCCC;
	padding-top:			5px;
	margin-top:				20px;
	text-align:				right;
}

form div.submit {
	margin-top:				10px;
	height:					40px;
	margin-right:			20px;
}

form .form_error {
	margin-top:				0.5em;
	color:					#921913;
	font-size:				0.7em;
}

form .error_list li {
	margin-top:				10px;
	margin-bottom:			10px;
	font-size:				12px;
	color:					#921913;
}

form .date_select {
	cursor:					pointer;
	vertical-align: 		middle;
}


/*--------------------
  	LOGIN FORM CSS
--------------------*/

form#login div label {
	width:					100px;
}

form#login div.submit{
	width:					305px;
}
/*--------------------
  	TABLE CSS
--------------------*/

table {
	width:					100%;
	font-size:				12px;
	margin-bottom:			10px;
}

table th {
	padding:				5px 5px;
	font-weight:			bold;
	background-color:		#808080;
	color:					#B5D3FF;
}

table th.id {
	width:					30px;
}

table th.date {
	width:					60px;
}

table td {
	line-height:			18px;
	vertical-align: 		top;
	padding:				5px 5px;
}

table td.counter {
	font-weight:			bold;
	width:					20px;
}

table td.zoom {
	background-image:		url(/images/icons/zoom.png);
	background-repeat:		no-repeat;
	background-position:	5px 3px;
	padding-left:			28px;
}

table td.title, table th.title {
	font-weight:			bold;
	width:					240px;
}

table td.center, table th.center {
	max-width:				50px;
	text-align:				center;
}

table tr:hover, table tr.even:hover {
	background-color:		#B5D3FF;
	color:					#333333;
}

table.clickable tr:hover, table.clickable tr.even:hover {
	cursor:					pointer;
}

table.clickable tr th:hover, table.clickable tr.even th:hover {
	cursor: 				default;
}

table tr.even {
	background-color:		#EEEEEE;
}

table tr.guest {
	background-color:		#FBF0C7;
}

table td textarea {
	width:					310px;
	padding:				5px;
	height:					100px;
}

table td span.guest{
	font-size:				10px;
	color:					#F1B964;
}

/** Simple Table **/


table.simple th {
	font-size:				16px;
	background-color:		#FFF;
	color:					#999;
}

table.simple tr {
	font-size:				13px;
	background-color:		#FFF;
	color:					#666;
}


/*--------------------
  	NOTES
--------------------*/

.note {
   	position:				relative; /*this is the key*/
    z-index:				24; 
	width:					20px;
	left:					50%;
	margin-left:			-10px;
}

.note:hover {
	z-index:				25; 
}

.note div h3{
   	font-weight:			bold;
	margin-bottom:			5px;
}


.note div {
	float:					left;
	display:				none;
	-moz-border-radius: 	10px;
	-webkit-border-radius: 	10px;
	padding:				10px;
	width:					300px;
    border:					2px solid #E5CC70;
    background-color:		#FDFEA2; 
	color:					#666;
	text-align:				left;
}

.note:hover div {
	display:				block;
    position:				absolute;
   	left:					-340px; 
}

/*----------------------------
    VCARD
----------------------------*/

.vcard .fn {
	font-size:				14px;
	font-weight:			bold;
	color:					#666;
}

.vcard .url {
	font-size:				10px;
	font-weight:			normal;
	color:					#aaa;
}

/*--------------------
  	PAGER
--------------------*/

.pager {
	margin:					20px 0px;
	color:					#333;
	font-size:				12px;
	text-align:				right;
	display:				block;
}

.pager.top {
	width:					400px;
	float:					right;
	margin:					10px 0px;
}

.pager a, .pager span {
	padding:				5px 6px;
	margin:					0px;
}

.pager a:hover {
	background-color:		#B5D3FF;
}

.pager .first {
	border-left:			4px solid #CCCCCC;
}

.pager .previous {
	border-left:			2px solid #CCCCCC;
}

.pager .last {
	border-right:			4px solid #CCCCCC;
}

.pager .next {
	border-right:			2px solid #CCCCCC;
}

/*--------------------
  	FOOTER
--------------------*/

#footer {
	color:					#808080;
	padding:				10px 40px 40px 40px;
	font-size:				10px;
}