/* /css/kigo.css */ /* UTF8-Côôkie */

/*

Z-INDEX:

	div#appheader			100			See also kigo.js
	vkPopup.setZIndexBase()	500
	kigoPopup.zIndexBase	510

	.calendar				700
	.calendar .combo		750

	div.kigo_multiselect	800

	div.tooltip				1000
	div.vkDebug				20000

*/



/*********************************************************************************************/
/* BODY */

* { font-family: Arial,Verdana; font-size: 9pt; font-weight: normal; }

body { font-family: Arial,Verdana; font-size: 9pt; font-weight: normal; }

body.page
{
	color: #000000;
	background-color: #F3F3F3;

	text-align: center;

	padding: 0;
	margin: 0;

	overflow-x: hidden;
	overflow-y: scroll;	/* Force, avoids the header bug on dynamic content height change */
}

body.page.ua-msie
{
	overflow-y: auto;
}

body.embed
{
	color: #000000;
	background-color: #FFFFFF;

	text-align: left;

	padding: 0;
	margin: 0;
}

body.embed.app
{
	overflow: hidden;
}

#obsolete_browser
{
	background-color: #EEEE00;

	margin: 0 auto 8px auto;
	width: 900px;

	font-family: Verdana;
	font-size: 8pt;
	font-weight: bold;

	text-align: center;
}


/*********************************************************************************************/
/* PAGE LAYOUT */

/* PAGE */
body.page #global { margin: 0px auto 8px auto; width: 900px; text-align: left; }
body.page #container {
	width: 868px; background-color: #FFFFFF; padding: 16px; display: none;

   /*box-shadow: inset 0px 0px 1px gray;*/
   /*-webkit-box-shadow: inset 0px 0px 1px gray;*/
   /*-moz-box-shadow: inset 0px 0px 1px gray;*/
}
body.page #footer { }
body.page #footer a,
body.page #footer a:visited { font-size: 7pt; color: #999999;
text-decoration: underline; }
body.page #footer a:hover { color: #CCCCCC; }


/* EMBED */
body.embed #container { margin: 0px auto 0px auto; padding: 0px; }


/*********************************************************************************************/
/* TABLE, IMG, A, Hx, FORM, SELECT, BUTTON, INPUT.* */

table { border-spacing: 0px 0px;  border-collapse: collapse;  padding: 0px;  margin: 0px;  empty-cells: show; }
table td { padding: 0px; }

img { border: 0px;  margin: 0px;  padding: 0px; }

a, a:visited { color: #000000;  text-decoration: underline; }
a:hover { color: #444444; }
a.disabled { text-decoration: none; color: #CCCCCC; cursor: default; }
a.external_link { padding-right: 12px; }
	a.external_link:hover { background: url(../img/misc/external-link.png) no-repeat center right; }

strong { font-weight: bold; }

h1, h2, h3 { font-weight: bold; border-bottom: 1px solid #DDDDDD; }
h1 span, h2 span, h3 span { font-weight: bold; }
h1, h2 { padding: 0px 0px 7px 0px; margin: 4px 0px 12px 0px; }
h1 { font-size: 15pt; }
h1 span { font-size: 15pt; }
h2 { font-size: 11pt; }
h2 span { font-size: 10pt; }
.form h2 { margin-top: 16px }
h3 { font-size: 8pt; margin: 24px 0px 8px 0px; }
h3 span { font-size: 8pt; }

body.ua-msie-7 span { vertical-align:middle; }

/* 30/08/2010 - for "Set display order" and friends... */
h1 a { font-size: 7pt; margin-left: 12px; }

/* What is this for??? */
h2 a, h2 a:visited, h3 a, h3 a:visited { text-decoration: none; }
h2 a:hover, h3 a:hover { color: #444444; }

small { font-size: 7pt; }
small a {  font-size: 7pt; }
i { font-size: inherit; }

form { padding: 0px;  margin: 0px; }

select
{
	display: inline-block;
	height:24px;
	padding: 2px;
	line-height: 16px;
	color: #222;
	border: 1px solid #ccc;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	margin-bottom:1px;
}

body.ua-msie-7 select {
	vertical-align:middle;
	line-height:13px;
	/* we simply cannot control the height of a native ie7 select element */
	padding:0;
	margin:3px 0 0 0;
}
body.ua-msie-8 select {vertical-align:middle; }

select.disabled { background-color: #EEE;  color: #666; }

select optgroup { font-weight: normal;  font-style: normal;
background-color: #EEEEEE;  margin-top: 5px; }
select optgroup option { font-weight: normal; background-color: #FFFFFF; }

input[type="button"], input[type="reset"], input[type="submit"] {
	height:auto;
	width:auto;
}

input:-moz-placeholder {
	color: #AAA !important;
}

:root .btn {
	border-radius: 0 \0;
}
button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
	padding: 0;
	border: 0;
}

button {
	margin:0;
	background:#e8e8e8;
	background-repeat:no-repeat;
	background-image: -moz-linear-gradient(center top , #fff, #fff 25%, #E8E8E8);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fcfcfc), color-stop(25%, #fcfcfc), to(#E8E8E8));
	background-image: -webkit-linear-gradient(#fcfcfc, #fcfcfc 25%, #E8E8E8);
	background-image: -ms-linear-gradient(#fcfcfc, #fcfcfc 25%, #E8E8E8);
	background-image: -o-linear-gradient(#fcfcfc, #ffffff 25%, #E8E8E8);
	background-image: linear-gradient(#fcfcfc, #fcfcfc 25%, #E8E8E8);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#E8E8E8', GradientType=0);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	border-width:1px;
	border-style:solid;
	border-color:#CCCCCC #CCCCCC #BBBBBB;
	color:#333;
	padding:3px 6px;
	text-shadow:1px 1px 0 rgba(255,255,255,0.75);
	font-size:1em;
	-webkit-transition: 0.1s linear all;
	-moz-transition: 0.1s linear all;
	-ms-transition: 0.1s linear all;
	-o-transition: 0.1s linear all;
	transition: 0.1s linear all;

	line-height:normal;
}

body.ua-firefox button {padding: 2px 4px; }

button.danger{
	background: #c43c35;
	background-repeat: no-repeat;
	background-image: -khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));
	background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
	background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));
	background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
	background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
	background-image: linear-gradient(top, #ee5f5b, #c43c35);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);
	border-width:1px;
	border-style:solid;
	border-color: #c43c35 #c43c35 #882a25;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	color:#FFF;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	font-weight:bold;
	padding:4px 8px;
	font-size:13px;
}

button.success{
	background: #57a957;
	background-repeat: no-repeat;
	background-image: -moz-linear-gradient(top, #62c462, #57a957);
	background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
	background-image: -ms-linear-gradient(top, #62c462, #57a957);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
	background-image: -webkit-linear-gradient(top, #62c462, #57a957);
	background-image: -o-linear-gradient(top, #62c462, #57a957);
	background-image: linear-gradient(top, #62c462, #57a957);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
	border-width:1px;
	border-style:solid;
	border-color: #57a957 #57a957 #3d773d;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	color:#FFF;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	font-weight:bold;
	padding:4px 8px;
	font-size:13px;
}

button:hover{
	background-position: 0 -5px;
	text-decoration: none;
	box-shadow:0 1px 0 rgba(255, 255, 255, 0.2) inset,0 1px 1px rgba(0,0,0,0.1);
}

button:active{
	background:#eee;
	box-shadow: 0 0px 3px rgba(0,0,0,0.1) inset;
	text-shadow:none;
}

div.btnbar button:hover{
	background-position:0 -12px;
}

button[disabled] {
	cursor: default;
	background-image: none;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
	filter: alpha(opacity=65);
	-khtml-opacity: 0.65;
	-moz-opacity: 0.65;
	opacity: 0.65;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

button.disabled {
	cursor: default;
	background-image: none;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
	filter: alpha(opacity=65);
	-khtml-opacity: 0.65;
	-moz-opacity: 0.65;
	opacity: 0.65;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

button.disabled:hover {
	background-color:none;
	color:444;opacity: 0.65;
}

button.primary{
	background:#328DC1;
	background-repeat: no-repeat;
	background-image: -moz-linear-gradient(center top , #389ed9, #389ed9 25%, #328DC1);
	background-image: -khtml-gradient(linear, left top, left bottom, from(#379ad4), to(#328DC1));
	background-image: -ms-linear-gradient(top, #379ad4, #328DC1);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #379ad4), color-stop(100%, #328DC1));
	background-image: -webkit-linear-gradient(top, #379ad4, #328DC1);
	background-image: -o-linear-gradient(top, #379ad4, #328DC1);
	background-image: linear-gradient(top, #379ad4, #328DC1);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#379ad4', endColorstr='#328DC1', GradientType=0);
	border-width:1px;
	border-style:solid;
	border-color:#2b79a6 #2b79a6 #25688f;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	color:#FFF;
	text-shadow:0 -1px 0 rgba(0,0,0,0.25);
	font-weight:bold;
	padding:4px 8px;
	font-size:13px;
}

button.primary:hover,
button.danger:hover,
button.success:hover
{
	background-position:0 -12px;
}
button.success:active{
	background:#57a957;
}
button.danger:active{
	background:#c43c35;
}
button.primary:active{
	background:#328DC1;
}

.ua-msie button,
.ua-msie button[disabled]
{
	line-height: 1em;	/* IE FIX WHEN WITHIN ".form p" */
	/* 15/10/2008 - IE Fix, see:
		http://jehiah.cz/archive/button-width-in-ie
		http://jehiah.cz/archive/an-even-better-ie-button-width-fix
	*/
	width: auto;
	overflow: visible;
}

/*label { font-weight:bold }*/

fieldset {
	padding:0 1.4em 1.4em 1.4em;
	margin:0 0 1.5em 0;
	border:1px solid #ccc
}

legend {
	font-weight:bold;
	font-size:1.2em;
	margin-top:-0.2em margin-bottom:1em
}
fieldset, #IE8#HACK { padding-top:1.4em }

legend, #IE8#HACK {
       margin-top:0;
       margin-bottom:0
}

body.ua-msie-7 input[type="text"],
body.ua-msie-7 input[type="password"],
body.ua-msie-7 input[type="url"],
body.ua-msie-7 input[type="email"],
body.ua-msie-7 input[type="button"],
body.ua-msie-7 input[type="reset"],
body.ua-msie-7 input[type="submit"],
body.ua-msie-7 button
{vertical-align:middle;}

input[type=text],
input[type=password],
input[type=url],
input[type=email],
input.text,
input.title,
textarea
{
	border:1px solid #bbb;
	color:#333;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=url]:focus,
input[type=email]:focus,
input.text:focus,
input.title:focus,
textarea:focus
{
	border-color:#aaa;
}

input,
textarea
{
	display: inline-block;
	height: 18px;
	padding: 2px;
	line-height: 16px;
	color: #444;
	border: 1px solid #ccc;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
	-moz-transition: border linear 0.2s, box-shadow linear 0.2s;
	-ms-transition: border linear 0.2s, box-shadow linear 0.2s;
	-o-transition: border linear 0.2s, box-shadow linear 0.2s;
	transition: border linear 0.2s, box-shadow linear 0.2s;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}

input:focus, textarea:focus {
	outline: 0;
	-webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(82, 168, 236, 0.6);
	-moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(220, 248, 231, 0.6);
	box-shadow:  inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 3px rgba(213, 208, 152, 0.7);
}
input[type=file]:focus, input[type=checkbox]:focus, select:focus {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	outline: 1px dotted #666;
}

textarea { height: 60px; resize: vertical; /* .ua-safari textarea, .ua-chrome textarea */ }

input.checkbox, input.radio { background-color: #FFFFFF; border: none; padding: 0px; vertical-align:middle; height:14px; }
	table.list input.checkbox, input.radio { margin: 0; }

.ua-msie input.checkbox,
.ua-msie input.radio,
.ua-opera input.checkbox,
.ua-opera input.radio
{
	background-color: transparent;
	border: none;
}

.ua-opera input.checkbox,
.ua-opera input.radio
{ padding: 1px; }


input.cal {  width: 130px; cursor: default; }

input.disabled,
textarea.disabled
{
	background-color: #F0F0F0;
	color: #666;
}

input.disabled.discrete,
textarea.disabled.discrete
{
	color: #AAAAAA;
}



/* Other browsers have nice default value */
.ua-opera input.checkbox[disabled]
{
	background-color: #AAAAAA;
	color: #333333;
}

/*********************************************************************************************/
/* MISC/SHARED MODIFIER CLASSES */

div.separator { border-top: 1px solid #AAA; margin: 8px 0px 16px 0px; }

.left { text-align: left; }
.right { text-align: right; }

div.left { float: left; text-align: left; }
div.right { float: right; text-align: right; }



.number { text-align: right; white-space: nowrap; }
.center { text-align: center; }
.nobreak { white-space: nowrap; }

/* See if we can remove this one without breaking anything? I doubt so */
.wide { width: 240px; }

/* 24/02/2010 - Make the 'wide' never exceed 1/3 column... */
div.twocols .wide,
div.threecols .wide,
div.threecols2 .wide
{
	width: 240px;
}

/* 19/04/2010 ... with the exception of textareas ... */
/* 29/03/2011 ... and boxfield2 ... */
div.twocols textarea.wide,
div.twocols div.boxfield2.wide
{
	width: 400px;
}
div.threecols2 textarea.wide,
div.threecols2 div.boxfield2.wide
{
	width: 550px;
}

/* 24/02/2010 ... but do limit it for 1/6 column */
div.sixcols .wide
{
	width: 130px;
}

.missing {
	border-color: #C87872 !important;
	box-shadow: 0 0 3px rgba(171, 41, 32, 0.25) !important;
	background-color: #FBF5F4 !important;
}

/* new labels to call attention */

span.important-label,
span.warning-label,
span.notice-label,
span.info-label,
span.success-label
{
	padding: 1px 3px;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	color: white;
	text-transform: uppercase;
	font-weight:bold;
	font-size: 7.2pt;
}

span.important-label { background: #C43C35; }
span.warning-label { background: #F89406; }
span.notice-label { background: #62CFFC; }
span.info-label { background: #BFBFBF; }
span.success-label { background: #46A546; }


a.important, span.important, input.important, strong.important, small.important
{ color: #C00 !important; }
a.warning, strong.warning, input.warning, span.warning
{ color:  #F89406; }
a.notice, span.notice
{ color: #049CDB; }
a.success, span.success
{ color:#46A546; }



div.important-label,
div.warning-label,
div.notice-label,
div.info-label
{ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 1px 3px; }

div.important-label { background-color: #FDDFDE; border-color: #FBC7C6; }
div.warning-label { background-color: #FDF5D9;  border-color: #FCEEC1; }
div.notice-label { background-color: #DDF4FB; border-color: #C6EDF9; }

/* 27/04/2010 - This was frequently required.. */
.discrete,
a.discrete { color: #888; }

/* div.clear, br.clear */
.clear { clear: both; }

/* Used for short summaries (ie. 2 connected agencies, 1 connection
request from agencies (pending)) */
div.summary, span.summary
{
	font-size: 8pt;
	font-weight: normal;
	margin-bottom: 8px;
	color: #888;
}

span.summary
{
	margin-left: 12px;
}

.print_only { display: none; }
.no_print {}

/*********************************************************************************************/
/* FORM & FORM ELEMENTS */

.form { padding: 0px; margin: 0px; }
.form p { font-weight: bold; line-height: 200%; padding: 0px; margin: 0px 0px 6px 0px; clear: both; }
.form p label { font-weight: normal; line-height: 160%; }
.form p span { font-weight: normal; line-height: 120%; }
.form p a { font-weight: normal; line-height: 140%; color: #000000; text-decoration: underline; }
.form p a:hover { color: #444444; text-decoration: underline; }

.form p.multicolumn { font-weight: normal; margin-top: 0; }
.form p.multicolumn label { font-weight: normal; margin: 0 8px 6px 0px; float: left; }

/* OBSOLETE - USE boxfield2 INSTEAD! */
.form div.boxfield {
	background-color: #FFFFFF;

	border-left: 1px solid #777777;
	border-top: 1px solid #777777;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;

	margin: 0px;
	padding: 2px;

	/* Must have fixed width & height for overflow to work */
	/* Default to wide width, arbitrary height */

	width: 240px;
	height: 100px;

	overflow: auto;
}

.form div.boxfield label { display: block; margin: 4px 0px 4px 0px; }
.form div.boxfield p label { display: block; margin: 4px 0px 4px 16px; }


/* 08/03/2011 - New boxfield implementation */
.form div.boxfield2 {
	background-color: #FFFFFF;
	border: 1px solid #ccc;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
	-moz-transition: border linear 0.2s, box-shadow linear 0.2s;
	-ms-transition: border linear 0.2s, box-shadow linear 0.2s;
	-o-transition: border linear 0.2s, box-shadow linear 0.2s;
	transition: border linear 0.2s, box-shadow linear 0.2s;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);

	margin: 0px;
	padding: 2px;

	/* Width is no longer explicit - use 'wide' class for 240px width */
	/* Height is no longer explicit either - only specify default min & max heights - we don't care about IE6 any more */

	min-height: 30px;
	height: 100px;

	overflow-y: auto;

	resize: vertical; /* .ua-safari textarea, .ua-chrome textarea */
}

.form div.boxfield2 label { display: block; margin: 4px 0px 4px 0px; }
.form div.boxfield2 p label { display: block; margin: 4px 0px 4px 16px; }
.form div.boxfield2 label input { height: 15px; }


/*********************************************************************************************/
/* APPLICATION MENUS (page only) */

body.page div#appheader { z-index: 100; width: 900px; margin: 0px auto
0px auto; padding: 0px; text-align: left; overflow: hidden; }
body.page div#apptitle
{
	background-color: #000000;

	background-image: url(../img/menu/logo.png);
	background-repeat: no-repeat;
	background-position: 8px 6px;

	padding: 7px 16px 7px 5px;
	*padding: 3px 16px 7px 5px;
}

body.page div#apptitle span
{
	margin-left: 28px;
	color: #F3F3F3;
}

body.page div#apptitle span.logo a { color: #fff; font-size: 10pt; text-decoration: none; }

body.page div#appuser { float: right; text-align: right; font-size: 7pt; font-weight: normal; color: #F3F3F3; clear: both; }

body.page div#appuser span
{
	display: block;
	margin-left: 0px;
	float: left;
	font-weight: normal;
	line-height: 16px;
	*line-height: 17px;
}

body.page div#appuser span.separator
{
       margin-left: 5px;
       margin-right: 5px;
	   color: #aaa;
}

body.page div#appuser span.account
{
	/*max-width: 120px;*/
	white-space: nowrap;
	overflow: hidden;
}

body.page div#appuser span.account a {
	padding-left: 16px;
	background: url(/img/misc/gear.png) 0 1px no-repeat;
}

body.page div#appuser span.search_box { display: block; padding:0; }

body.page div#appuser span.search_box input
{
	font-size: 8pt;
	padding: 1px 2px 0 2px;
	border: none !important;
	background-color: #555;
	color: #CCC;
	height: 15px;
}

body.page div#appuser span.search_box input:focus { color: white; }


body.page div#appuser span.search_button { margin-left: 3px; display: block; }
body.page div#appuser span.search_button a { display: block; width: 9px; height: 12px; background-image: url(../img/menu/search.png); margin-top: 2px; }



body.page div#appuser a,
body.page div#appuser a:visited { font-size: 9pt; color: #ccc; text-decoration: none; }
body.page div#appuser a:active,
body.page div#appuser a:hover { color: #fff; }

body.page div#appmenu { width: 888px; height: auto; min-height: 100px; padding: 8px 6px 6px 6px; }

body.page div#appmenu div.group { float: left; width: 14%; margin: 0px 0px 0px 5px; overflow-x: hidden; }
body.page div#appmenu div.group h4 { font-weight: bold; font-size: 11pt; color: #F3F3F3; margin: 0px 0px 8px 0px; }
body.page div#appmenu div.group h5 { display: block; font-weight: normal; font-size: 8pt; color: #dce4e7; margin: 0px 0px 4px 0px; }

body.page div#appmenu div.group a,
body.page div#appmenu div.group a:visited { color: #dce4e7; text-decoration: none; }

body.page div#appmenu div.group a:hover,
body.page div#appmenu div.group a:active { text-decoration: underline; }

body.page div#appmenu div.group h5.selected a { background-color: transparent; text-decoration: underline; color: #F3F3F3; }

body.page div#appmenu div.group span.notification { color: white; font-size: 7.2pt; padding: 0 3px; margin-left: 4px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
	body.page.app.ra div#appmenu div.group span.notification { background: #2376A5; }
	body.page.app.owner div#appmenu div.group span.notification { background: #73a123; }
body.page div#appmenu div.group span.notification.loading { color: #D1D1D1; }

body.page.app.ra div#appmenu div.group.e-4 { width: 236px; }


body.page div#appheadertopspacer { height: 3px; font-size: 0px; background-color: #F3F3F3; }

/* Page-type dependant */

body.page.owner div#appmenu { background-color: #7ab318; }
body.page.ra    div#appmenu { background-color: #328DC1; }

body.page.corp div#appmenu,
body.page.bo div#appmenu
{ background-color: #9E9FA1; }

/* Corp */

body.page.corp div#appheadertopspacer { display: none; }

body.page.corp div#apptitle span { display: none; }


body.page.corp div#apptitle {
	background-color: #FFFFFF;
	background-image: url(../img/menu/logo_corp.png);
	background-repeat: no-repeat;
	background-position: 15px 15px;
	padding: 15px 0px 0px 0px;
	height: 60px;

	border-bottom: 1px solid #F3F3F3;
}

/* 04/01/2010 */
body.page.corp div#apptitle a {
	display: block;
	margin-left: 15px;
	width: 90px;
	height: 47px;
}

body.page.corp div#apptitle a span { display: none; }


body.page.corp div#appmenu { min-height: 75px;}
body.page.corp div#appmenu div.group a,
body.page.corp div#appmenu div.group a:visited { color: #F3F3F3; text-decoration: none; }
body.page.corp div#appmenu div.group a:hover,
body.page.corp div#appmenu div.group a:active { text-decoration: underline; }
body.page.corp div#appmenu div.group a.selected { background-color: transparent; text-decoration: underline; color: #F3F3F3; }




/* Always align right the last menu */
body.page div#appmenu div.single,
body.page div#appmenu div.last { float: right; }

/* Except in BO */
body.page.bo div#appmenu div.single,
body.page.bo div#appmenu div.last { float: left; }




body.page.public div#appmenu { background-color: red; }




/*********************************************************************************************/
/* LIST TABLES */

body.page table.list {
	width: 852px; /* In other page types, width must be set explicitly */
	margin-bottom: 18px;
	padding: 0;
	font-size: 1em;
}

table.list thead tr td,
table.list thead tr th {

	border-collapse: collapse;
	*border-collapse: collapse; /* IE7, collapse table to remove spacing */
	border: 1px solid #ccc;

	font-weight: bold;
	vertical-align: middle;
	text-shadow:1px 1px 0 rgba(255,255,255,0.75);
	background:#f8f8f8;
	background-image:-moz-linear-gradient(center top , #f8f8f8, #f8f8f8 25%, #EEE);
	background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#EEE));
}

table.list tbody tr td {
	border-collapse: collapse;
	*border-collapse: collapse; /* IE7, collapse table to remove spacing */
	border: 1px solid #ccc;
}
table.list tfoot tr td { text-align: right; }
table.list tfoot tr td.left { text-align: left; }

table.list * tr td { padding: 4px; cursor: default; }

table.list th,
table.list td {
	padding: 6px 5px 5px;
	line-height: 18px;
}

table.list td { vertical-align: top; }

table.list th + th,
table.list thead td + td,
table.list tbody td + td { border-left: 1px solid #ccc; }

table.list tr + tr td { border-top: 1px solid #ccc; }

table.list tbody tr.selected td,
table.list tbody tr td.selected { background-color: #FFFFCC !important; }

/* 13/04/2010 */
table.list tbody tr.off td { color: #AAAAAA; }
/* Damn */
table.list tbody tr td.discrete { color: #AAAAAA; }

table.list tbody tr.strong td { font-weight: bold; }

table.list tbody tr.disabled td,
table.list tbody tr td.disabled { background-color: #DDDDDD; }

body.page div.form div.twocols table.list { width: 420px; }             /* In other page types, */
body.page div.form div.threecols2 table.list { width: 560px; }  /* width must be set explicitly */



/*********************************************************************************************/
/* PARAMSBAR, BTNBAR */

div.paramsbar { width: 868px; padding: 0px 0px 8px 0px; margin: 0px 0px 8px 0px; }
div.paramsbar button { margin: 0px 0px 0px 4px; }
div.paramsbar a { line-height: 140%; color: #000000; text-decoration: underline; }
div.paramsbar a { color: #444444; text-decoration: underline; }

div.btnbar { border-top: 1px solid #aaa; text-align: right; margin: 6px 0px 8px 0px; padding: 4px 0px 0px 0px; }
div.btnbar button { margin: 0px 0px 0px 4px; }
div.btnbar div.left button { margin: 0px 4px 0px 0px; }


div.form div.twocols div.btnbar { width: 420px; }
div.form div.threecols2 div.btnbar { width: 560px; }


/*********************************************************************************************/
/* RESULT ITEM (owner's calendar and ra's search) */

table.resitem { width: 868px; margin: 8px 0px 12px 0px; }
table.resitem td { vertical-align: top; padding: 8px; border: 1px solid #444444; }
table.resitem td.info { line-height: 160%; background-color: #EEEEEE; }
table.resitem td.info img { margin: 6px 0px 6px 0px; padding: 0px 0px 0px 0px; }
table.resitem td.info a { text-decoration: underline; color: #000000; }
table.resitem td.info a:hover { text-decoration: underline; color: #666666; }
table.resitem td.cal { text-align: left; width: 654px; }
table.resitem td.cal div.buttons { text-align: right; }
table.resitem td.cal button { margin: 8px 0px 0px 4px; }
table.resitem td.info h4 { font-size: 9pt; font-weight: bold; margin: 4px 0px 8px 0px; }
table.resitem td.info h4 a,
table.resitem td.info h4 a:visited { font-size: 9pt; font-weight: bold; text-decoration: none; }
table.resitem td.info h4 a:hover { color: #444444; }


/*********************************************************************************************/
/* COLUMNS LAYOUT WITH DIVS */

div.twocols { float: left; width: 434px; }
div.threecols { float: left; width: 289px; }
div.threecols2 { float: left; width: 578px; }
div.sixcols { float: left; width: 144px; }

/*********************************************************************************************/
/* TOOLTIPS */

div.tooltip
{
	position: absolute;
	display: none;

	z-index: 1000;

	font-family: Verdana;
	font-size: 8pt;
	font-weight: normal;

	text-align: left;

	color: #000000;

	/* white-space: nowrap; */

	border: 1px solid #888888;

	padding: 3px 3px 3px 3px;
	margin: 0px 0px 0px 0px;

	background-color: #FFFFCC;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

	opacity: .93;
	filter: alpha(opacity=93);

	max-width:500px;
}

div.tooltip div.separator { margin: 8px 0px 8px 0px; }


div.tooltip h3 {
	margin: 8px 0px 8px 0px;
}


/************************/
/* Reservation comments */

div.tooltip.reservation_comment,
body.ua-msie-6 div.tooltip_reservation_comment          /* For IE6... */
{
	text-align:left;
	width:300px;
	padding: 6px;
	overflow: hidden;
	white-space: normal;
}


div.tooltip.reservation_comment h1,
body.ua-msie-6 div.tooltip_reservation_comment h1               /* For IE6... */
{
	font-weight: bold;
	border-width: 0px;
	font-size: 8pt;
	padding: 0px 0px 0px 0px;       /* Kill padding because we don't have a border unlike body h1's */
	margin: 4px 0px 4px 0px;
}


/*********************************************************************************************/
/* TABBED MENUS */

div.tabbedMenu { padding: 0px; margin: 8px 0px 12px 0px; border-bottom: 1px solid #aaa; }
div.tabbedMenu ul { margin: 0px; padding: 5px 5px 0; height: 27px; border-radius:3px 3px 0 0; font-size:1.1em; }
div.tabbedMenu ul li { float: left; text-align: left; height: 28px; overflow: hidden; list-style-image: none;  list-style-type:none; }
div.tabbedMenu ul li.right { float: right; }
div.tabbedMenu ul li div
{
	height: 23px;   /* ul - 2 - padding */

	padding: 6px 10px 0;
	margin: 0px 2px 0px 0px;

	text-align: center;
	vertical-align: middle;

	cursor: pointer;

	color:#328DC1;
	border-radius:3px 3px 0 0;

	font-weight:bold;
}
div.tabbedMenu ul li.right div
{
	margin: 0px 0px 0px 8px;
}


/* Only <6 ? */
/*.ua-msie tabbedMenu ul li div { width: 120px; }*/
.ua-msie-6 div.tabbedMenu ul li div { width: 120px; }

div.tabbedMenu ul li div:hover { color:#48a8de; }

/* sel -> selected */
div.tabbedMenu ul li.sel div,
div.tabbedMenu ul li.selected div { cursor: default; background-color: #FFF; color: #444;font-weight:bold; border:1px solid #aaa; border-bottom:none; padding: 5px 8px 1px }
div.tabbedMenu ul li.sel div:hover,
div.tabbedMenu ul li.selected div:hover { background: #fff; }


/*********************************************************************************************/
/* TINY (JS) MENUS */

div.tinyMenu { padding: 0px; margin: 8px 0px 12px 0px; background-color: #FFFFFF; }
div.tinyMenu ul { margin: 0px; padding: 0px; height: 16px; position: relative; top: 1px; }
div.tinyMenu ul li { float: left; text-align: left; overflow: hidden; }


div.tinyMenu ul li div
{
	margin: 0px 16px 0px 0px;

	color: #328DC1;
	font-size: 8pt;
	font-weight: bold;

	text-align:center;
	vertical-align: middle;

	cursor: pointer;
}
div.tinyMenu ul li div:hover { color: #48A8DE; }

/* sel -> selected */
div.tinyMenu ul li.sel		div,
div.tinyMenu ul li.selected div { cursor: default; color: black; }


/*********************************************************************************************/
/* TINY (JS) MENUS for kigoMenu3 (there is a span in the tab label div) */

div.tinyMenu3 { padding: 0px; margin: 8px 0px 12px 0px; background-color: #FFFFFF; }
div.tinyMenu3 ul { margin: 0px; padding: 0px; height: 26px; position: relative; top: 1px; }
div.tinyMenu3 ul li { float: left; text-align: left; overflow: hidden; }

div.tinyMenu3 ul li div span
{
	margin: 0px 14px 0px 0px;
	display:inline-block;
	color: #328DC1;
	font-size: 8pt;
	font-weight: bold;

	text-align:center;
	vertical-align: middle;

	cursor: pointer;
}
div.tinyMenu3 ul li div span:hover { color: #48A8DE; }

div.tinyMenu3 ul li.sel      div span,
div.tinyMenu3 ul li.selected div span { cursor: default; color: black; }


/*********************************************************************************************/
/* kigoPager */

div.kigo_pager { text-align: right; margin: 16px 0px 8px 0px; }

div.kigo_pager select { margin-left: 4px; margin-right: 4px; }
div.kigo_pager select option { text-align: right; }
div.kigo_pager span.total { margin-left: 4px; margin-right: 12px; }
div.kigo_pager span.sep { margin-left: 4px; margin-right: 4px; display:none; }


div.kigo_pager a { text-decoration: none; padding:3px  7px; border:1px solid #ccc; margin:1px; color:#333;}
div.kigo_pager a:hover { background-color:#888; color:#fff; border-color:#888; text-shadow:0 1px 0 rgba(0,0,0,0.1); }
div.kigo_pager a.disabled { text-decoration: none; color: #AAA; cursor: default; background-color:#F3f3f3; text-shadow:0 1px 0 #FFFFFF; }
div.kigo_pager a.disabled:hover { border-color:#ccc;}


/*********************************************************************************************/
/* kigoUpload */

div.kigo_upload { }
div.kigo_upload div.flash_container
{
       width: 390px;
       height: 24px;
}


/*********************************************************************************************/
/* kigoDatePicker */

input.kigo_datepicker { cursor: pointer; }
input.kigo_datepicker.disabled { cursor: default; }


/*********************************************************************************************/
/* kigoMultiSelect */

input.kigo_multiselect
{
	cursor: pointer;

	background-image: url(../img/misc/arrow_open.png);
	background-repeat: no-repeat;
	background-position: right center;

	padding-right: 12px;
}

input.kigo_multiselect.open
{
	background-image: url(../img/misc/arrow_close.png);
}


input.kigo_multiselect.disabled { cursor: default; }


div.kigo_multiselect
{
	position: absolute;
	z-index: 800;

	overflow-y: auto;
	min-height: 10px;       /* Enough for the user to see there is something */
	max-height: 180px;

	background-color: #FFFFFF;
	color: #000000;

	border-left: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #999999;
	border-bottom: 1px solid #999999;

	margin: 0px;
	padding: 0px;

}

div.kigo_multiselect label
{
	display: block;
	margin: 3px 2px 3px 2px;
}

div.kigo_multiselect label span
{
	margin-left: 4px;
}


/* Same as input.checkbox */
div.kigo_multiselect label input { background-color: #FFFFFF;   border: none; padding: 0px; height: 12px; }


/* IE6 is unaware of min-height and max-height */
body.ua-msie-6 div.kigo_multiselect
{
	height: 150px;
}



/*********************************************************************************************/
/* vkPopup */

div.vkPopupBg { position: absolute; left: 0; top: 0; background-color: white; opacity: .55; filter: alpha(opacity=55); }
div.vkPopup {
	width: 380px;
	position: absolute;
	-webkit-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	-moz-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	box-shadow: 0 4px 16px rgba(0,0,0,.2);
	background: white;
	background-clip: padding-box;
	border: 1px solid #ACACAC;
	border: 1px solid rgba(0, 0, 0, .333);
}
div.vkPopup table { width: 100%; cursor: default; }
div.vkPopup table thead tr { border: 1px solid #fff; border-bottom: 1px solid #eee; }
div.vkPopup table thead td
{
	color: #444;

	font-size: 12pt;
	font-weight: bold;
	line-height: 140%;

	text-align: left;

	white-space: nowrap;

	padding: 8px 8px 8px 16px;
}

div.vkPopup table tbody tr { border: 1px solid #fff; }
div.vkPopup table tbody td
{
	color: #000000;

	font-weight: normal;
	line-height: 140%;

	text-align: left;

	white-space: normal;

	background-color: #FFF;

	padding: 12px;
	border: none;
}

div.vkPopup table tbody td.icon { width: 10%; padding: 16px; }
div.vkPopup table tbody td.buttons { text-align: center; background: #f6f6f6; border-top: 1px solid #DDD; box-shadow: inset 0 1px 0 #fff; }
div.vkPopup table tbody td.buttons button { margin: 0px 8px 0px 8px; }
div.vkPopup table tbody td.icon img { width: 48px; height: 48px; }

/*********************************************************************************************/
/* vkPopupModal */

/*

22/07/2010 - We definetly need to get rid of vkPopupModal table, and
replace it by divs, because the settings conflict with any tables that
are inside the popup
Until then, apply 'vkPopupModalClass' to every table component, to
avoid those conflicts! This should have no visual impact.

*/


div.vkPopupModal {
	position: absolute;
	-webkit-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	-moz-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	box-shadow: 0 4px 16px rgba(0,0,0,.2);
	background: white;
	background-clip: padding-box;
	border: 1px solid #ACACAC;
	border: 1px solid rgba(0, 0, 0, .333);
}
div.vkPopupModal table.vkPopupModal { cursor: default; }

div.vkPopupModal table.vkPopupModal thead.vkPopupModal tr { border: 1px solid #fff; border-bottom: 1px solid #eee; }
div.vkPopupModal table.vkPopupModal thead.vkPopupModal td.vkPopupModal
{
	font-size: 12pt;

	font-weight: bold;
	line-height: 140%;

	text-align: left;

	white-space: nowrap;

	padding: 8px 8px 8px 16px;
}

div.vkPopupModal table.vkPopupModal tbody.vkPopupModal tr { border: 1px solid #fff; }
div.vkPopupModal table.vkPopupModal tbody.vkPopupModal td.vkPopupModal
{
	background-color: #FFFFFF;
	border: none;
}

div.vkPopupModal table.vkPopupModal tbody.vkPopupModal td.vkPopupModal iframe { border: none; padding: 0px; overflow: auto; }

div.vkPopupModal table.vkPopupModal tbody.vkPopupModal td.vkPopupModal div.localmodalcontainer {
	text-align: left; color: #000000; background-color: #FFFFFF; line-height: 1.4em; padding: 0px; margin: 0px; overflow: auto;
}


.ua-safari .localmodal
{
	/* these browsers ignore container's bottom padding when scroll is active... */
	padding-bottom: 4px;
}



/*********************************************************************************************/
/* vkDebug */


div.vkDebug { position: absolute; left: 0px; top: 0px;
background-color: #CCCCCC; padding: 1px; margin: 0px; z-index: 20000;
opacity: .80; filter: alpha(opacity=80); }
div.vkDebug div.log
{
	width: 400px; height: 30px;
	font-family: 'Courier New', monospace; font-size: 7pt; font-weight: normal; background-color: #3333FF; color: #FFFFFF; text-align: left;
	white-space: nowrap; overflow: auto;
	padding: 2px; margin: 2px;
}

div.vkDebug div.buttons { width: 400px; background-color: red; padding: 2px; margin: 2px; text-align: right; }
div.vkDebug div.buttons button,
div.vkDebug div.buttons button[disabled]
{
	font-family: Verdana; font-size: 7pt; font-weight: normal; background-color: #CCCCCC; font-weight: normal;

	border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF; border-bottom: 1px solid #333333; border-right: 1px solid #333333;

	white-space: nowrap; padding: 1px 6px 1px 6px; margin: 0px 0px 0px 2px;
}




/*********************************************************************************************/
/* calendar */


/* The main calendar widget.  DIV containing a table. */

body.app .calendar {
	position: relative;
	display: none;
	border: 1px solid #206A9B;
	font-size: 11px;
	color: #000;
	cursor: default;
	background: #F1F8FC;

	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;

	z-index: 700;
}

body.app .calendar * {
	font-size: 11px;
}

body.app .calendar table {

	/* KIGO */
	border-collapse: separate;

	border: 1px solid #206A9B;
	font-size: 11px;
	color: #000;
	cursor: default;
	background: #F1F8FC;
}


/* Header part -- contains navigation buttons and day names. */

body.app .calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
	text-align: center;
	padding: 2px;
}

body.app .calendar .nav {
	background: #328DC1 url(../img/calendar/menuarrow.gif) no-repeat 100% 100%;
}

body.app .calendar thead .title { /* This holds the current "month, year" */
	font-weight: bold;   /* Pressing it will take you to the current date */
	text-align: center;
	background: #000;
	color: #fff;
	padding: 2px;
}

body.app .calendar thead tr { /* Row <TR> containing navigation buttons */
  background: #328DC1;
  color: #fff;
}

body.app .calendar thead .headrow { /* Row <TR> containing navigation buttons */
	background: #328DC1;
	color: #fff;
}

body.app .calendar thead .daynames { /* Row <TR> containing the day names */
	background: #C7E1F3;
}

body.app .calendar thead .name { /* Cells <TD> containing the day names */
	border-bottom: 1px solid #206A9B;
	padding: 2px;
	text-align: center;
	color: #000;
}

body.app .calendar thead .weekend { /* How a weekend day name shows in header */
	color: #C43C35;
}

body.app .calendar thead .hilite { /* How do the buttons in header appear when hover */
	background-color: #34ABFA;
	color: #000;
	border: 1px solid #016DC5;
	padding: 1px;
}

body.app .calendar thead .active { /* Active (pressed) buttons in header */
	background-color: #006AA9;
	border: 1px solid #008AFF;
	padding: 2px 0px 0px 2px;
}

/* The body part -- contains all the days in month. */

body.app .calendar tbody .day { /* Cells <TD> containing month days dates */
	width: 2em;
	color: #456;
	text-align: right;
	padding: 2px 4px 2px 2px;
}
body.app .calendar tbody .day.othermonth {
	font-size: 80%;
	color: #bbb;
}
body.app .calendar tbody .day.othermonth.oweekend {
	color: #fbb;
}

body.app .calendar table .wn {
	padding: 2px 3px 2px 2px;
	border-right: 1px solid #000;
	background: #C7E1F3;
}

body.app .calendar tbody .rowhilite td {
	background: #def;
}

body.app .calendar tbody .rowhilite td.wn {
	background: #F1F8FC;
}

body.app .calendar tbody td.hilite { /* Hovered cells <TD> */
	background: #def;
	padding: 1px 3px 1px 1px;
	border: 1px solid #8FC4E8;
}

body.app .calendar tbody td.active { /* Active (pressed) cells <TD> */
	background: #cde;
	padding: 2px 2px 0px 2px;
}

body.app .calendar tbody td.selected { /* Cell showing selected date */
	font-weight: bold;
	border: 1px solid #000;
	padding: 1px 3px 1px 1px;
	background: #fff;
	color: #000;
}

body.app .calendar tbody td.weekend { /* Cells showing weekend days */
	color: #C43C35;
}

body.app .calendar tbody td.today { /* Cell showing today date */
	font-weight: bold;
	color: #D50000;
}

body.app .calendar tbody .disabled { color: #999; }

body.app .calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
	visibility: hidden;
}

body.app .calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
	display: none;
}

/* The footer part -- status bar and "Close" button */

body.app .calendar tfoot .footrow { /* The <TR> in footer (only one right now) */
	text-align: center;
	background: #206A9B;
	color: #fff;
}

body.app .calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
	background: #000;
	color: #fff;
	border-top: 1px solid #206A9B;
	padding: 1px;
}

body.app .calendar tfoot .hilite { /* Hover style for buttons in footer */
	background: #B8DAF0;
	border: 1px solid #178AEB;
	color: #000;
	padding: 1px;
}

body.app .calendar tfoot .active { /* Active (pressed) style for buttons in footer */
	background: #006AA9;
	padding: 2px 0px 0px 2px;
}

/* Combo boxes (menus that display months/years for direct selection) */

body.app .calendar .combo {
	position: absolute;
	display: none;
	top: 0px;
	left: 0px;
	width: 4em;
	cursor: default;
	border: 1px solid #655;
	background: #def;
	color: #000;
	font-size: 90%;
	z-index: 750;
}

body.app .calendar .combo .label,
body.app .calendar .combo .label-IEfix {
	text-align: center;
	padding: 1px;
}

body.app .calendar .combo .label-IEfix {
	width: 4em;
}

body.app .calendar .combo .active {
	border-top: 1px solid #46a;
	border-bottom: 1px solid #46a;
	background: #F1F8FC;
	font-weight: bold;
}

body.app .calendar .combo .hilite {
	background: #34ABFA;
	border-top: 1px solid #46a;
	border-bottom: 1px solid #46a;
	font-weight: bold;
}

body.app .calendar td.time {
	border-top: 1px solid #000;
	padding: 1px 0px;
	text-align: center;
	background-color: #E3F0F9;
}

body.app .calendar td.time .hour,
body.app .calendar td.time .minute,
body.app .calendar td.time .ampm {
	padding: 0px 3px 0px 4px;
	border: 1px solid #889;
	font-weight: bold;
	background-color: #F1F8FC;
}

body.app .calendar td.time .ampm {
	text-align: center;
}

body.app .calendar td.time .colon {
	padding: 0px 2px 0px 3px;
	font-weight: bold;
}

body.app .calendar td.time span.hilite {
	border-color: #000;
	background-color: #267DB7;
	color: #fff;
}

body.app .calendar td.time span.active {
	border-color: red;
	background-color: #000;
	color: #A5FF00;
}







/*********************************************************************************************/
/* KIGO POPUP */

div.kigo_popup.mask{
	position:absolute;
	left:0;
	top:0;
	background-color: white;
	opacity:.55;
	filter:alpha(opacity = 55);
}

div.kigo_popup.outline
{
	position:absolute;
	overflow:hidden;

	text-align:left;
	-webkit-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	-moz-box-shadow: 0 4px 16px rgba(0,0,0,.2);
	box-shadow: 0 4px 16px rgba(0,0,0,.2);
	background: white;
	background-clip: padding-box;
	border: 1px solid #ACACAC;
	border: 1px solid rgba(0, 0, 0, .333);
}

div.kigo_popup div.title
{
	width:auto;
	cursor:default;
	position:relative;

	padding:8px 8px 8px 16px;
	border: 1px solid #fff;
	border-bottom: 1px solid #eee;
}

div.kigo_popup div.innertitle
{
	overflow:hidden;

	font-size:12pt;
	font-weight:bold;
	line-height:140%;
	text-align:left;
	white-space:nowrap;
}

div.kigo_popup div.container{
	position:relative;
	line-height: 1.4em;
}

div.kigo_popup a.focustrap{
	position:absolute;
	top:-10000px;
	left:-10000px;
}

/* specific to dialog factories: */

div.kigo_popup div.container div.message
{
	color:black;
	background-color:#fff;
	line-height:140%;

	/* fixed height */
	/* height:96px; */

	/* flexible height */
	overflow-y:auto;
	min-height:50px;
	max-height:210px;

	_height:16px; /* "height" works as "min-height" in this case in IE6. */
	padding: 16px 8px 16px 110px;
	background-repeat:no-repeat;
	background-position:32px 24px;
}


div.kigo_popup div.container div.buttons,
div.kigo_popup div.container div.btnbar,
.vkPopupModal div.buttons,
.vkPopupModal div.btnbar
{
	background: #f6f6f6;
	border-top: 1px solid #DDD;
	box-shadow: inset 0 1px 0 #fff;
	text-align:center;
	clear:both;
	padding:8px;
	margin:0px;
}

.ua-chrome .vkPopupModal div.buttons,
.ua-chrome .vkPopupModal div.btnbar
{
	padding:9px;
}

div.kigo_popup div.container div.buttons button{
	margin:0 8px 0 8px;
}

.vkPopup span.loading,
div.kigo_popup div.container span.loading {
height: 21px;
display: block;
background: url(../img/popup/loading.gif) no-repeat center center;
text-indent: -9999px;
}

div.kigo_popup div.container div.message.yesno{ background-image:url("../img/popup/Question.png"); }
div.kigo_popup div.container div.message.info { background-image:url("../img/popup/Info.png"); }
div.kigo_popup div.container div.message.warn { background-image:url("../img/popup/Warning.png"); }
div.kigo_popup div.container div.message.error{ background-image:url("../img/popup/Error.png"); }
div.kigo_popup div.container div.message.wait { /*background-image:url("../img/popup/icon-wait.gif");*/ }
div.kigo_popup div.container div.message.ok   { background-image:url("../img/popup/Good.png"); }


/* EMBED FORM - use old kigo styles */

body.embed * { font-family: Verdana; font-size: 8pt; font-weight: normal; }

body.embed { font-family: Verdana; font-size: 8pt; font-weight: normal; }

body.embed input,
body.embed textarea
{
	background-color: #FFFFFF;
	color: #000000;

	border-left: 1px solid #333333;
	border-top: 1px solid #333333;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;

	margin: 0px;
	padding: 2px;

	line-height: normal;
	height: 13px;
	border-radius:0px;
	box-shadow:none;
}

body.embed textarea { height: 60px; }

body.embed textarea
{
	resize: none;
}

body.embed input.checkbox,
body.embed input.radio {	background-color: #FFFFFF;	border: none; padding: 0px; }

body.embed select
{
	border-left: 1px solid #333333;
	border-top: 1px solid #333333;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
}
body.embed select.disabled { background-color: #F0F0F0;  color: #666666; }

body.embed .form p { font-weight: bold; }


body.embed select
{
	border-left: 1px solid #333333;
	border-top: 1px solid #333333;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
	height: 18px;
	padding:0;
	color:black;
	margin:0;
}
body.embed select.disabled { background-color: #F0F0F0;  color: #666666; }

body.embed select optgroup { font-weight: normal;  font-style: normal;	 background-color: #EEEEEE;  margin-top: 5px; }
body.embed select optgroup option { font-weight: normal; background-color: #FFFFFF; }

body.embed .form p.multicolumn label {
font-weight: normal;
margin: -4px 8px 6px 0px;
float: left;
}

body.embed .form p.multicolumn {
font-weight: normal;
margin-top: -4px;
}


body.embed button,
body.embed button[disabled]
{
	margin: 0px 0px 0px 0px;
	padding: 2px 6px 2px 6px;
}

/* datePicker CALENDAR widget (for EMBED and PUBLIC pages) */
body.public .calendar,
body.embed .calendar {
  position: relative;
  display: none;
  border-top: 2px solid #fff;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  border-left: 2px solid #fff;
  font-size: 11px;
  color: #000;
  cursor: default;
  background: #c8d0d4;
  font-family: tahoma,verdana,sans-serif;

  z-index: 700;
}

body.public .calendar *,
body.embed .calendar * {
	font-size: 11px;
	font-family: tahoma,verdana,sans-serif;
}

body.public .calendar table,
body.embed .calendar table {

	/* KIGO */
	border-collapse: separate;


  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
  font-size: 11px;
  color: #000;
  cursor: default;
  background: #c8d0d4;
  font-family: tahoma,verdana,sans-serif;
}


/* Header part -- contains navigation buttons and day names. */

body.public .calendar .button,
body.embed .calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
  text-align: center;
  padding: 1px;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
}

body.public .calendar .nav,
body.embed .calendar .nav {
  background: transparent url(/img/calendar/menuarrow.gif) no-repeat 100% 100%;
}

body.public .calendar thead .title,
body.embed .calendar thead .title { /* This holds the current "month, year" */
  font-weight: bold;
  padding: 1px;
  border: 1px solid #000;
  background: #788084;
  color: #fff;
  text-align: center;
}

body.public .calendar thead .headrow,
body.embed .calendar thead .headrow { /* Row <TR> containing navigation buttons */
}

body.public .calendar thead .daynames,
body.embed .calendar thead .daynames { /* Row <TR> containing the day names */
}

body.public .calendar thead .name,
body.embed .calendar thead .name { /* Cells <TD> containing the day names */
  border-bottom: 1px solid #000;
  padding: 2px;
  text-align: center;
  background: #e8f0f4;
}

body.public .calendar thead .weekend,
body.embed .calendar thead .weekend { /* How a weekend day name shows in header */
  color: #f00;
}

body.public .calendar thead .hilite,
body.embed .calendar thead .hilite { /* How do the buttons in header appear when hover */
  border-top: 2px solid #fff;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  border-left: 2px solid #fff;
  padding: 0px;
  background-color: #d8e0e4;
}

body.public .calendar thead .active,
body.embed .calendar thead .active { /* Active (pressed) buttons in header */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
  background-color: #b8c0c4;
}

/* The body part -- contains all the days in month. */
body.public .calendar tbody .day,
body.embed .calendar tbody .day { /* Cells <TD> containing month days dates */
  width: 2em;
  text-align: right;
  padding: 2px 4px 2px 2px;
}

body.public .calendar tbody .day.othermonth ,
body.embed .calendar tbody .day.othermonth {
  font-size: 80%;
  color: #aaa;
}
body.public .calendar tbody .day.othermonth.oweekend,
body.embed .calendar tbody .day.othermonth.oweekend {
  color: #faa;
}

body.public .calendar table .wn,
body.embed .calendar table .wn {
  padding: 2px 3px 2px 2px;
  border-right: 1px solid #000;
  background: #e8f4f0;
}

body.public .calendar tbody .rowhilite td,
body.embed .calendar tbody .rowhilite td {
  background: #d8e4e0;
}

body.public .calendar tbody .rowhilite td.wn,
body.embed .calendar tbody .rowhilite td.wn {
  background: #c8d4d0;
}

body.public .calendar tbody td.hilite,
body.embed .calendar tbody td.hilite { /* Hovered cells <TD> */
  padding: 1px 3px 1px 1px;
  border: 1px solid;
  border-color: #fff #000 #000 #fff;
}

body.public .calendar tbody td.active,
body.embed .calendar tbody td.active { /* Active (pressed) cells <TD> */
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: #000 #fff #fff #000;
}

body.public .calendar tbody td.selected,
body.embed .calendar tbody td.selected { /* Cell showing selected date */
  font-weight: bold;
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: #000 #fff #fff #000;
  background: #d8e0e4;
}

body.public .calendar tbody td.weekend,
body.embed .calendar tbody td.weekend { /* Cells showing weekend days */
  color: #f00;
}

body.public .calendar tbody td.today,
body.embed .calendar tbody td.today { /* Cell showing today date */
  font-weight: bold;
  color: #00f;
}

body.public .calendar tbody .disabled,
body.embed .calendar tbody .disabled { color: #999; }

body.public .calendar tbody .emptycell,
body.embed .calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
  visibility: hidden;
}

body.public .calendar tbody .emptyrow,
body.embed .calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
  display: none;
}

/* The footer part -- status bar and "Close" button */

body.public .calendar tfoot .footrow,
body.embed .calendar tfoot .footrow { /* The <TR> in footer (only one right now) */
}

body.public .calendar tfoot .ttip,
body.embed .calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  background: #e8f0f4;
  padding: 1px;
  border: 1px solid #000;
  background: #788084;
  color: #fff;
  text-align: center;
}

body.public .calendar tfoot .hilite,
body.embed .calendar tfoot .hilite { /* Hover style for buttons in footer */
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  padding: 1px;
  background: #d8e0e4;
}

body.public .calendar tfoot .active,
body.embed .calendar tfoot .active { /* Active (pressed) style for buttons in footer */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

/* Combo boxes (menus that display months/years for direct selection) */

body.public .calendar .combo,
body.embed .calendar .combo {
  position: absolute;
  display: none;
  width: 4em;
  top: 0px;
  left: 0px;
  cursor: default;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  background: #d8e0e4;
  font-size: 90%;
  padding: 1px;
  z-index: 750;
}

body.public .calendar .combo .label,
body.public .calendar .combo .label-IEfix,
body.embed .calendar .combo .label,
body.embed .calendar .combo .label-IEfix {
  text-align: center;
  padding: 1px;
}

body.public .calendar .combo .label-IEfix,
body.embed .calendar .combo .label-IEfix {
  width: 4em;
}

body.public .calendar .combo .active,
body.embed .calendar .combo .active {
  background: #c8d0d4;
  padding: 0px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

body.public .calendar .combo .hilite,
body.embed .calendar .combo .hilite {
  background: #048;
  color: #aef;
}

body.public .calendar td.time,
body.embed .calendar td.time {
  border-top: 1px solid #000;
  padding: 1px 0px;
  text-align: center;
  background-color: #e8f0f4;
}

body.public .calendar td.time .hour,
body.public .calendar td.time .minute,
body.public .calendar td.time .ampm,
body.embed .calendar td.time .hour,
body.embed .calendar td.time .minute,
body.embed .calendar td.time .ampm {
  padding: 0px 3px 0px 4px;
  border: 1px solid #889;
  font-weight: bold;
  background-color: #fff;
}

body.public .calendar td.time .ampm,
body.embed .calendar td.time .ampm {
  text-align: center;
}

body.public .calendar td.time .colon,
body.embed .calendar td.time .colon {
  padding: 0px 2px 0px 3px;
  font-weight: bold;
}

body.public .calendar td.time span.hilite,
body.embed .calendar td.time span.hilite {
  border-color: #000;
  background-color: #667;
  color: #fff;
}

body.public .calendar td.time span.active,
body.embed .calendar td.time span.active {
  border-color: #f00;
  background-color: #000;
  color: #0f0;
}

