/******************************************************************************
 Global styles for all WebCenter applications. This file should be all skins
 with the same content.

 Contents:
 - Page main layout positioning
 - Headings
 - Links
 - Lists
 - Paragraphs etc.
 - Application menu
 - Login page specific styles
 - Tab Control
 - Footer
 - Footer - debug panels
 - Header and header toolbox
 - Application Tabs
 - Breadcrumb Navigation
 - Tables
 - Table : Content
 - Table : Sorting and filtering
 - Table : Pager
 - Errors displaying
 - Items with picture buttons
 - Picutre buttons
 - Short info tables
 - Full info tables
 - History
 - Calendar
 - Validators
 - Tree notes / comments
 - Form items (inputs, selects, buttons)
 - Theme selector
 - Search
 - DatePicker
 - Install info table
 - Mess to clean
 
******************************************************************************/


/* reset browser margins */
body, html, form
{
	margin: 0;
	padding: 0;
}

/* main style */
body
{
	background: #fff url("layout/page_background.gif") repeat-x;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 1.5em;
	color: #000;
	margin-bottom: 2em;
	/* centering .page element for microsoft browsers */
	text-align: center;
}

/* also style inputs, selects, etc. */
input, select, option, textarea
{
	font-size: 11px;
	font-family: Verdana, Helvetica, sans-serif;
}

/* fixing correcting incorrect rendering of buttons in IE */
input.button
{
	padding: 0 .25em;
	/* only for IE (only [***censored***] IE says: "0!=0") */
	width: 0;
	overflow: visible;
}
input.button[class]
{
	/* IE ignores [class] */
	width: auto;
}

/* HACK: (r.matej) font size in tables should be the same as in body text
  - until we will use strict xhtml and standart browsers, we need this */
table
{
	font-size: 1em;
}

/* no borders for images, thank you */
img
{
	border: 0;
}

/* do not display tiresome hr */
hr
{
	display: none;
}

/* holds whole popup */
.popup
{
	text-align: left;
	padding: 1em;
	/* HACK: (rm) this is a little hack,
	   i don't know, why Firefox overflows
	   out from popup window */
	padding-right: 2.7em;
	_padding-right: 1em;
}


/* cleaner for cleaning floats */
.cleaner
{
	clear: both;
	font-size: 0;
	height: 0;
	width: 0;
	line-height: 0;
	margin: 0;
	padding: 0;
}

/* things which have to be hidden */
.hidden
{
	display: none;
}


/*****************************************************************************/
/* Page main layout positioning */

/* TODO: (r.matej) rename unitedPage to page */
/* ordinary page */
.unitedPage
{
	width: 90%;
	margin: 0 auto;
	padding: 0 0 10px 0;
	text-align: left;
}
/* TODO: (r.matej) rename pageContentNew to content or mainContent */
.pageContentNew
{
	/* padding around content */
	padding: 0 2em 2em 55px;
	/* left margin for menu */
	margin: 0 0 0 195px;
}

/* centered page (login layout etc.) */
div.centeredPage .errorsPanel,
div.centeredPage h2
{
	width: 500px;
	margin-left: auto;
	margin-right: auto;
}
div.centeredPage h2,
div.centeredPage .submitButtons
{
	text-align: center;
}

/* page without menu */
div.noMenu .pageContentNew
{
	padding-left: 2em;
	margin-left: 0;
}

/* TODO: (r.matej) to remove */
/* tables under unitedPage has collapsed borders (including the table conitaining
   menu and content) */
.unitedPage table
{
	border-collapse: collapse;
}
.pageContent
{
	padding: 1em 2em;
}
/* TODO: (r.matej) page should be replaced by unitedPage - can we do it? */
/* holds whole page */
.page
{
	width: 90%;
	border-top: none;
	padding: 0 0 10px 0;
	text-align: center;
}


/*****************************************************************************/
/* Headings */

/* h1 should be used as main heading containing company name / logo */
h1
{
	font-size: 2.5em;
	margin: .7em 0 .7em .5em;
	float: left;
	display: block;
}

h1 a
{
	color: #000;
	display: block;
}


/* h2 should be used as page name = layout name = subtitle */
h2
{
	color: #003888;
	text-align: left;
	/* TODO: (r.matej) em instead px */
	font-size: 1.4em;
	font-weight: bold;
	margin: 1em 0 .5em 1em;
}

/* h2 in popups */
div.popup h2
{
	text-align: center;
	display: block;
	margin: 0 0 .5em 0;
	padding-bottom: .5em;
	border-bottom: 1px solid #c6d6f4;
}

/* TODO: (r.matej) remove this style - style it according to parent classes in html */
/* centered h2 - e.g. login layout name */
h2.center
{
	text-align: center;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
	padding-right: 0;
}


/* h3 should be used as page subsection heading */
h3
{
	background: url("layout/fading_line.png") no-repeat;
	font-weight: bold;
	color: #003888;
	padding: .5em 0 0 .3em;
	margin: 2.5em 0 1em 0;
	font-size: 1.1em;
}


/*****************************************************************************/
/* Links */

a, a:hover, a:visited
{
	text-decoration: underline;
	color: #000;
}

a:hover
{
	text-decoration: none;
}


/*****************************************************************************/
/* Lists */

/* permissions list's part heading */
dl.permissionsList dt
{
	color: #003888;
	margin-top: 2em;
}
dl.permissionsList dt:after
{
	content: ":";
}

/* permissions list's part */
dl.permissionsList dd
{
	margin: 0 0 0 1em;
}

/* TODO: (r.matej) here should be some nice image instead list-style */
/* actions and permissions list */
ul.actionsList,
dl.permissionsList ul
{
	margin: 1em 0;
	padding-left: 0;
	list-style: circle none inside;
}
ul.actionsList li,
dl.permissionsList ul li
{
	margin: .5em 0 0 0;
	padding-left: 0;
}

/* actions list in tables */
table ul.actionsList,
table ul.horizontalActionsList
{
	margin: 0;
	padding: 0;
	list-style: none;
	list-style-position: outside;
	white-space: nowrap;
}
table ul.actionsList li,
table ul.horizontalActionsList li
{
	margin: 0;
	padding: 0;
}
table ul.actionsList li a, table ul.horizontalActionsList li a { display: block; }
table ul.actionsList li a:hover, table ul.horizontalActionsList li a:hover { background-color: #ecf4fb; }

/* vertical list of actions in table */
table ul.actionsList li a { padding: .3em 1em; }

/* horizontal listo of actions in table */
table ul.horizontalActionsList li a { padding: .5em; }
table ul.horizontalActionsList li { float: left; }

/* list, which doesn't seems to be a list */
ul.invisible
{
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.invisible li
{
	margin: 0;
	padding: 0;
}


/*****************************************************************************/
/* Paragraphs etc. */

/* paragraphs
   - use this instead more <br/> tags to separate text (inline) parts
   - to separate block (no text) parts , use <div class="moreSpace"> tag */
p
{
	margin: 1em 0;
}

/* TODO: (r.matej) maybe delete this class */
/* more space around block elements
   - like paragraph, but to make more space around block elements e.g. controls
   - left margin because we dont want to stick block elements to left side */
div.moreSpace
{
	margin: 2em 0 3em 1em;
}

fieldset div.moreSpace
{
	margin: 1.5em 0 0 0;
}


/*****************************************************************************/
/* Application menu */

/* TODO: (r.matej) used only on some layouts common with NFR */
/* menu placeholder */
td.menuContent
{
	width: 220px;
}

/* whole application menu */
dl.appMenu
{
	width: 195px;
	margin-top: 2em;
	color: #003888;
	text-align: left;
}

/* application menu part heading */
dl.appMenu dt
{
	background: transparent url("layout/menupart_bullet.gif") no-repeat 0 center;
	margin: 0 0 .4em 10px;
	padding: 0 0 0 8px;
}

/* application menu part */
dl.appMenu dd
{
	margin: 0 0 1.5em 0;
}

/* application menu link */
/* HACK: (r.matej) Microsoft guys doesn't understand CSS so we must set also a:hover and a:visited */
dl.appMenu a, dl.appMenu a:hover, dl.appMenu a:visited
{
	text-decoration: none;
	display: block;
	height: 33px;
	line-height: 33px;
	/* TODO: (r.matej) this padding makes link a little bit bigger in all browsers but ie7 and ie6 */
	padding-left: 10px;
	background: url("layout/menu_item.png") no-repeat;
	color: #003888;
	margin-bottom: -1px;
}


/*****************************************************************************/
/* Login page specific styles */

/* table containing login control and two company editable parts */
table.loginGrid { width: 100%; }
table.loginGrid td { width: 50%; }

/* centered box containing login control */
table.loginGrid td.loginBox
{
	width: 0%;
	text-align: center
}

/* login textbox surrounding div */
/* TODO: (r.matej) divs aroud textboxes should be moved to GxTextbox control later */
.loginTextBox
{
	width: 12em;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

/* login textbox input */
.loginTextBox input
{
	width: 100%;
}

/* centered logout box with message */
.logoutBox
{
	width: 30em;
	margin: 0 auto;
	text-align: center;
}


/*****************************************************************************/
/* Tab Control */

/* TODO: (r.matej) clean this out a little bit (rename classes, minimalize
   styles, add comments) */

.MultiViewArea
{
	margin: 10px 0px;
	border-bottom: 1px solid #c6d6f4;
}

.StripButton
{
	font-weight: normal;
	margin: 3px;
	color: #000;
	text-decoration: none
}

.StripButtonSelected
{
	font-weight: normal;
	margin: 3px;
	color: #000;
	text-decoration: none
}

a.StripButton { color: #000; text-decoration: none }
a.StripButton:hover { color: #000; text-decoration: none }
a.StripButton:visited { color: #000; text-decoration: none }
a.StripButtonSelected { color: #000; text-decoration: none }
a.StripButtonSelected:hover { color: #000; text-decoration: none }
a.StripButtonSelected:visited { color: #000; text-decoration: none }
.StripButtonSelected { font-weight: bold }
.StripButton-LeftPart
{
	background-position: left top;
	background-image: url("tabcontrol/left.gif");
	width: 5px;
	background-repeat: no-repeat;
	height: 20px
}
.StripButtonSelected-LeftPart
{
	background-position: left top;
	background-image: url("tabcontrol/left.gif");
	width: 5px;
	background-repeat: no-repeat;
	height: 20px
}

.StripButtonSelected-LeftPart { background-image: url("tabcontrol/left-selected.gif") }
.StripButton-MiddlePart { background-image: url("tabcontrol/center.gif") }
.StripButtonSelected-MiddlePart { background-image: url("tabcontrol/center-selected.gif") }

.StripButton-RightPart
{
	background-position: right top;
	background-image: url("tabcontrol/right.gif");
	width: 5px;
	background-repeat: no-repeat
}

.StripButtonSelected-RightPart
{
	background-position: right top;
	background-image: url("tabcontrol/right.gif");
	width: 5px;
	background-repeat: no-repeat
}

.StripButtonSelected-RightPart { background-image: url("tabcontrol/right-selected.gif") }

.StripLeftSpacer { width: 7px }
.StripRightSpacer { width: 7px }


/*****************************************************************************/
/* Footer */

/* footer div style */
div.footer
{
	text-align: left;
	border-top: 1px solid #c6d6f4;
	/* HACK: (r.matej) footer must have same width as page - in future footer should be contained in the page */
	width: 90%;
	padding-top: .7em;
	margin: 0 auto 2em auto;
	color: #003888;
}

/* footer link styles */
div.footer a, div.footer a:hover, div.footer a:visited
{
	color: #003888;
	text-decoration: none;
}

/* surround floated content */
div#copyright
{
	overflow: auto;
}

/* spans in copyright are blocks floated left (because of image replacement technique) */
div#copyright span
{
	display: block;
	float: left;
}

/* copyright separator */
div#copyright span.separator
{
	margin-left: .7em;
	margin-right: .7em;
	text-indent: -5000px;
	overflow: hidden;
	background: url("layout/footer_separator.gif") no-repeat;
	height: 9px;
	width: 1px;
	margin-top: .4em;
}


/*****************************************************************************/
/* Footer - debug panels */

/* debug panels - panel for quick logins and panel for xml=true redirection
  (hidden for release) */
div.xmlTruePanel,
div.quickLoginPanel
{
	border: 1px solid #c6d6f4;
	border-bottom: none;
	padding: .3em .5em .5em .5em;
	margin: 0 .2em;
	position: fixed;
	bottom: 0;
	color: #000;
	background-color: #fff;
	/* explorer hacks */
	_border: none;
	_padding: .3em;
	_margin: 0;
}

/* quick login panel position and background */
div.quickLoginPanel
{
	right: 8em;
	background: #fff url("decoration/user.gif") no-repeat left center;
	padding-left: 18px;
}

/* xml=true panel position */
div.xmlTruePanel
{
	right: 1em;
}

/* debug panels links */
div.quickLoginPanel a, div.quickLoginPanel a:visited, div.quickLoginPanel a:hover,
div.xmlTruePanel a, div.xmlTruePanel a:visited, div.xmlTruePanel a:hover
{
	color: #000;
}


/*****************************************************************************/
/* Header and header toolbox */

/* header container on login pages */
.centeredPage .headerNew
{
	border-bottom: 1px solid #c6d6f4;
}

/* toolbox in header containing user informations and menu */
div.headerToolbox
{
	color: #003888;
	float: right;
}

/* some space between toolbox parts */
div.headerToolbox div,
div.headerToolbox ul
{
	margin-top: 1em;
	text-align: right;
}

ul#topMenu
{
	font-weight: bold;
	list-style: none;
}

ul#topMenu li
{
	display: inline;
}

ul#topMenu li a
{
	color: #003888;
	text-decoration: none;
	padding: 0 1.5em;
	background: url("layout/topmenu_separator.gif") right center no-repeat;
}

ul#topMenu li a.last
{
	padding-right: 0;
	background-image: none;
}

div#topSearch input
{
	margin-left: .5em;
}


/*****************************************************************************/
/* Application Tabs */

/* TODO: (r.matej) if it will be used in the future, it should be reworked
   - making tabs scalable and make bottom border better way
   (http://alistapart.com/articles/slidingdoors/) */

/* application tabs block with line on the bottom */
.appTabs
{
	float: left;
	width: 100%;
	background: #ecf4fb url("apptab/line.gif") repeat-x bottom;
	margin: 0;
	padding: 1em 0 0 0;
	vertical-align: bottom;
	border-top: 1px solid #c6d6f4;
}

/* list of application tabs */
.appTabs ul
{
	margin: 0 0 0 .5em;
	padding: 0;
	list-style: none;
}

/* application tabs */
.appTabs li
{
	float: left;
	margin: 0;
	padding: 0;
	/* the same color as image on the background of appTabs div (hack) */
	border-bottom: 1px solid #c6d6f4;
}

.appTabs li#appTabSelected
{
	/* selected tab has white bottom border (hack) */
	border-bottom: 1px solid #fff;
}

/* link in application tabs */
.appTabs a,
.appTabs a:hover,
.appTabs a:visited
{
	color: #003888;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	display: block;
	line-height: 32px;
	width: 120px;
	margin: 0;
	padding: 0;
	background: url("apptab/tab.gif") no-repeat;
}

li#appTabSelected a,
li#appTabSelected a:hover,
li#appTabSelected a:visited
{
	background: url("apptab/tab-active.gif") no-repeat;
	cursor: default;
}


/*****************************************************************************/
/* Breadcrumb Navigation */

/* only holds breadcrumbs and adds line */
div.breadcrumbsContainer
{
	padding-bottom: 1em;
}

/* ul containing breadcrumbs */
ul#breadcrumbs
{
	margin: .5em 0 0 .5em;
	padding: 0;
	float: left;
	clear: left;
	list-style: none;
	color: #616161;
	/* this is here only because of IE6 double margin bug
	   http://ie-brouci.dero.name/double-margin.html */
	display: inline;
}

/* li with one breadcrumb */
ul#breadcrumbs li
{
	display: inline;
	padding-right: 1.7em;
	margin-right: 1.0em;
	font-weight: normal;
	background: url("layout/breadcrumb_separator.gif") no-repeat right center;
}

/* last breadcrumb has no image */
ul#breadcrumbs li.last
{
	background: none;
}


/*****************************************************************************/
/* Tables */

/* TODO: (r.matej) rename this classes (no grid, camelcase) */

.BasicGridHeader,
.BasicGridHeader a,
.BasicGridHeader a:hover,
.BasicGridHeader a:visited,
.BasicGrid th, .WiderBasicGrid th, .WidestBasicGrid th
{
	background-color: #f2f7fb;
	color: #000;
	text-decoration: none;
	font-weight: bold;
}

/* TODO: (r.matej) header should be only th */
.BasicGridHeader td,
.BasicGrid th, .WiderBasicGrid th, .WidestBasicGrid th
{
	text-align: center;
}

.BasicGrid, .WiderBasicGrid, .WidestBasicGrid
{
	border-collapse: collapse;
	border-style: solid;
	border: 1px solid #c6d6f4;
	margin: 0px;
	padding: 0px;
	font-size: 11px;
}

.WiderBasicGrid, .WiderBasicWidth
{
	width: 85%;
}

.WidestBasicGrid
{
	width: 100%;
}


/*****************************************************************************/
/* Table : Content */

/* TODO: (r.matej) this should be set to the whole column */
/* workflow action links */
a.actionLink
{
	display: block;
	text-align: center;
	white-space: nowrap;
}

.BasicGrid td, .WiderBasicGrid td, .WidestBasicGrid td,
.BasicGrid th, .WiderBasicGrid th, .WidestBasicGrid th
{
	border: 1px solid #c6d6f4;
	padding: 5px;
}

/* true and false signs */
/* NOTE: (r.matej) CSS classes in XHTML Strict are case sensitive and there are two types of true/false signs */
span.true, span.false,
span.True, span.False,
span.TrueNoImage, span.trueNoImage, span.truenoimage,
span.falseWithImage, span.FalseWithImage, span.falsewithimage
{
	display: block;
	width: 16px;
	height: 16px;
	text-indent: -5000px;
	overflow: hidden;
	background-repeat: no-repeat;
	/* centering image */
	margin-left: auto;
	margin-right: auto;
}
span.true, span.True { background-image: url("decoration/true.gif"); }
/* no image for false value now */
span.false, span.False { background-image: none; }
span.falseWithImage, span.FalseWithImage, span.falsewithimage { background-image: url("decoration/false.gif"); }


/*****************************************************************************/
/* Table : Sorting and filtering */

.SortArrowEmpty, .SortArrowAsc, .SortArrowDesc,
.FilterSign, .FilterSignActive
{
	background-color: Transparent;
	background-repeat: no-repeat;
	text-decoration: none;
	border: 0;
	float: right;
	cursor: pointer;
	/* TODO: (r.matej) remove outline somehow
	   http://jlaine.net/2007/1/23/hidden-css-stuff-the-outline-property */
	outline: 0;
}

.FilterSign, .FilterSignActive
{
	width: 9px;
	height: 8px;
}

.SortArrowEmpty, .SortArrowAsc, .SortArrowDesc
{
	width: 7px;
	height: 8px;
}

/* images for sort signs */
.SortArrowAsc { background-image: url("items_listing/header/sort_asc.gif"); }
.SortArrowDesc { background-image: url("items_listing/header/sort_desc.gif"); }
/* images for filter signs */
.FilterSign { background-image: url("items_listing/header/filter-inactive.gif"); }
.FilterSignActive { background-image: url("items_listing/header/filter-active.gif"); }

/* filter container */
div.RelativeFilterContainer
{
	position: relative;
	float: left;
	width: 100%;
}

div.FilterList
{
	background-color: #f2f7fb;
	display: none;
	position: absolute;
	top: 2.5em;
	left: 0;
	padding: 1em;
	border: 1px solid #c6d6f4;
	text-align: left;
}

/* filter link */
a.FilterLink, a.FilterLink:hover, a.FilterLink:visited
{
	font-weight: normal;
	display: block;
	clear: both;
	margin-bottom: .5em;
	white-space: nowrap;
}


/*****************************************************************************/
/* Table : Pager */

/* pager parts - items counter, page switcher and go to page */
div.pagerLeftBox, div.pagerCenterBox, div.pagerRightBox
{
	width: 33%;
	float: left;
	text-align: center;
}
div.pagerLeftBox { text-align: left; }
div.pagerRightBox { text-align: right; }

/* links to pages and actual page */
.actualPage, .pageLink
{
	margin-left: 2px;
	margin-right: 2px;
	width: 18px;
	text-align: center;
	font-weight: normal;
	font-size: 11px;
	color: #989898;
}
.pageLink
{
	font-weight: bold;
	color: #000;
}
.pageLink:hover, .pageLink:visited
{
	color: #000;
}

/* common pager icons styles */
.tablePager .first, .tablePager .previous, .tablePager .next, .tablePager .last,
.tablePager .nofirst, .tablePager .noprevious, .tablePager .nonext, .tablePager .nolast
{
	width: 16px;
	height: 16px;
	border: 0;
	background-color: Transparent;
	background-repeat: no-repeat;
	cursor: pointer;
}
.tablePager .nofirst, .tablePager .noprevious, .tablePager .nonext, .tablePager .nolast
{
	cursor: default;
}

/* pager enabled icons */
.tablePager .first { background-image: url("items_listing/pager/first.gif"); }
.tablePager .previous { background-image: url("items_listing/pager/back.gif"); }
.tablePager .next { background-image: url("items_listing/pager/next.gif"); }
.tablePager .last { background-image: url("items_listing/pager/last.gif"); }

/* pager disabled icons */
.tablePager .nofirst { background-image: url("items_listing/pager/nofirst.gif"); }
.tablePager .noprevious { background-image: url("items_listing/pager/noback.gif"); }
.tablePager .nonext { background-image: url("items_listing/pager/nonext.gif"); }
.tablePager .nolast { background-image: url("items_listing/pager/nolast.gif"); }

/* text boxes width */
.goToPage,
.itemsPerPage
{
	width: 3em;
}


/*****************************************************************************/
/* Errors displaying */

/* red validator message */
.errorMessage
{
	color: #f00;
	margin-top: 2em;
	display: block;
}

/* panel containing more errors (on error pages) */
.errorsPanel
{
	border: 1px solid #c6d6f4;
	background-color: #f2f7fb;
	padding: .5em;
}


/*****************************************************************************/
/* Items with picture buttons */

/* div containing name of item above buttons */
div.itemName
{
	/* left margin to align with buttons */
	margin-left: 2px;
}

/* div containing item picture buttons below */
div.itemButtons
{
	/* top margin to make space above buttons */
	margin: 5px 0;
}


/*****************************************************************************/
/* Picutre buttons */

/* common styles for all picture buttons */
a.detailsButton,
a.notesButton,
a.historyButton,
a.datafileButton,
a.attachmentsButton,
a.revisionButton,
a.userinfoButton
{
	display: block;
	height: 16px;
	width: 16px;
	float: left;
	margin: 2px 6px 2px 0;
	text-indent: -5000px;
	overflow: hidden;
	background-repeat: no-repeat;
	background-color: transparent;
}

a.detailsButton { background-image: url("items_listing/content/detail.gif"); }
a.notesButton { background-image: url("items_listing/content/notes.gif"); }
a.datafileButton { background-image: url("items_listing/item_types/files/data.gif"); }
a.attachmentsButton { background-image: url("items_listing/content/attachments.gif"); }
a.historyButton { background-image: url("items_listing/content/history.gif"); }

a.userinfoButton { background-image: url("items_listing/content/userinfo.gif"); }
a.revisionButton { background-image: url("items_listing/content/revision.gif"); }


/*****************************************************************************/
/* Progresses */
/* not used yet, can be removed if stands in the way */

#cover
{
	background-image: url("../../Img/Progress/cover.png");
}

* html #cover
{
	background-color: #000;
	back\ground-color: transparent;
	background-image: url("blank.gif");
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="Img/Progress/cover.png", sizingMethod="scale");
}


/*****************************************************************************/
/* Short info tables */

/* border around table */
table.shortInfo
{
	border: 1px solid #c6d6f4;
}

/* cell settings */
table.shortInfo  td, table.shortInfo  th
{
	padding: 0 1em 0 .5em;
}

/* header cell settings */
table.shortInfo  th
{
	text-align: left;
	font-weight: bold;
}


/*****************************************************************************/
/* Full info tables */

table.fullInfo
{
	border-spacing: 0;
	border-collapse: collapse;
}

/* cell settings */
table.fullInfo td, table.fullInfo th
{
	padding-right: 10px;
	vertical-align: top;
	padding: 1em 2em 1em 1em;
	text-align: left;
}

/* header cell settings */
table.fullInfo th
{
	background-color: #f2f7fb;
}


/*****************************************************************************/
/* History */

/* one history item */
div.historyItem
{
	margin: 2em 0;
}

/* history header and comment */
div.historyHeader, div.historyComment
{
	border: 1px solid #c6d6f4;
	float: left;
	padding: .4em .4em .4em 22px;
	margin: 1px 0;
}
div.historyHeader 
{
	background: #f2f7fb url("decoration/user.gif") no-repeat 2px center;
}
span.historyCreator { font-weight: bold; }
div.historyComment { background: #fffff5 url("decoration/note.gif") no-repeat 2px 2px; }

/* table with history changes */
table.historyChanges
{
	margin: 1px 0;
	border-collapse: collapse;
}
table.historyChanges td
{
	border: 1px solid #c6d6f4;
	padding: .5em;
}

/* action and location are italic */
td.type, td.location
{
	font-style: italic;
}

/* image instead border between old and new value */
table.historyChanges td.oldValue
{
	border-right: 0;
	padding-right: 10px;
	vertical-align: top;
}
table.historyChanges tr.update td.newValue,
table.historyChanges tr.create td.newValue,
table.historyChanges tr.delete td.newValue
{
	border-left: 0;
	background: transparent url("decoration/change.gif") no-repeat 3px center;
	padding-left: 30px;
	vertical-align: top;
}
table.historyChanges tr.actionRun td
{
}
table.historyChanges tr.actionRun td.actionName
{
}


/*****************************************************************************/
/* Calendar */

/* full width */
table.calendar { width: 100%; }

/* no decoration for a elements */
table.calendar a, table.calendarTitle a, .event a { text-decoration: none; }

/* borders */
table.calendar td, table.calendar tr { border: 1px solid #c6d6f4; }
table.calendar tr { border: 0; }

/* title */
table.calendarTitle
{
	height: 2em;
	background-color: #f2f7fb;
	font-weight: bold;
	
}
table.calendarTitle td
{
	border: none;
	text-align: center;
}

/* header */
th.dayHeader
{
	height: 1.8em;
	vertical-align: middle;
	text-align: center;
	background-color: #f2f7fb;
	border: 1px solid #c6d6f4;
}

/* normal table cells */
td.day, td.otherMonthDay, td.today, td.selectedDay
{
	height: 5em;
	padding: 4px;
	border: 1px solid #c6d6f4;
	padding: 0.3em;
	vertical-align: top;
	text-align: right;
}

/* today */
td.today
{
	background-color: #f2f7fb;
	font-weight: bold;
}

/* days in other months */
td.otherMonthDay
{
	background-color: #f5f5f5;
}

/* events */
.event
{
	margin-left: 0.2em;
	text-align: left;
}

.event ul
{
	list-style-type: none;
	padding: 0;
	margin: 0;
}

.event li
{
	background-position: 0 0.1em;
	background-repeat: no-repeat;
}

.event a
{
	padding-left: 1.4em;
	display: block;
	color: #000;
}

/* TODO: (r.matej) add missing icons
/* event icons */
.event li.ok { background-image: url("Icon_yes.gif"); }
.event li.okbw { background-image: url("Icon_yes_bw.gif"); }
.event li.no { background-image: url("Icon_no.gif"); }


/*****************************************************************************/
/* Validators */

/* validators color */
.inlineValidator, .validationSummary
{
	color: #ff0000;
}

/* inline validator displayed behind textbox */
.inlineValidator
{
	margin: 0;
}

/* validation summary displayed near buttons */
.validationSummary
{
	margin: .5em 0;
}

/* remove bullets from validation summary list */
div.validationSummary ul
{
	list-style-type: none;
}

/* remove margin from validation summary list */
div.validationSummary ul li, div.validationSummary ul
{
	margin: 0;
}



/*****************************************************************************/
/* Tree notes / comments */

/* tree note (contains none single note with all information) */
.treeNote
{
	display: block;
	position: relative;
	padding: .5em 0;
	margin: .5em 0;
}

/* checkbox for adding the note location */
.treeNote input
{
	margin: 0 3px;
	padding: 0;
	display: block;
	float: left;
}

/* tree note icons */
.MakePrivateNoteIcon,
.MakePublicNoteIcon,
.ReplyNoteIcon,
.SaveNoteIcon,
.GrabNoteIcon
{
	display: block;
	float: left;
	width: 16px;
	height: 16px;
	margin: 0 3px;
	background-repeat: no-repeat;
}

/* tree note icons' images */
.MakePrivateNoteIcon { background-image: url("treenotes/unlock.gif"); }
.MakePublicNoteIcon { background-image: url("treenotes/lock.gif"); }
.ReplyNoteIcon { background-image: url("treenotes/reply.gif"); }
.SaveNoteIcon { background-image: url("treenotes/save.gif"); }
.GrabNoteIcon { background-image: url("treenotes/target.gif"); }

/* note content (text) */
.treeNoteContent, .treeNotePrivateContent
{
	display: block;
	padding: .4em;
	margin-top: .4em;
	border: solid 1px #c6d6f4;
	background-color: #fffff5;
}

/* private note content (text) */
.treeNotePrivateContent
{
	font-style: italic;
}


/*****************************************************************************/
/* Form items (inputs, selects, buttons) */

/* form item - div containing all parts of input (label, input itself, tooltip, required sign, hidden fields, etc.) */
.formItem
{
	margin: 1.2em 0;
}

/* TODO: (r.matej) why this doesn't work? */
/*.formItem.shorterInput*/

/* input sizes (for nice design of inputs, they can not have any size by developer's choice */
.shortInput input { width: 3em; }
.shorterInput input { width: 5em; }
.longerInput input { width: 20em; }
.longInput input { width: 30em; }

/* TODO: (r.matej) maybe convert this class to fieldset and use legend to display form part name
   (but there are some troubles with styling fieldsets) */
/* part of form - serves as container for more form items (something like fieldset but more adjustable by css) */
div.formPart
{
	/* some space above and under form part */
	margin: .8em 0;
	/* NOTE: no horizontal padding - let contained items make place above and under
	   (cause is that padding doesn't overlap with margin) */
}

/* table for form items side by side in one line */
table.horizontalFormItems
{
	margin: 0;
	padding: 0;
}
table.horizontalFormItems td
{
	vertical-align: top;
	/* right padding to make space between form items */
	padding: 0 2em 0 0;
}
/* move button to same horizontal position as form items */
table.horizontalFormItems td input.button
{
	margin-top: 2.7em;
}

/* fake textbox - adds border, padding, etc. for simulating disabled textbox (rendering readonly values) */
div.fakeTextBox
{
	 border: 1px solid #c6d6f4;
	 float: left;
	 padding: 1px .5em 1px .2em;
}

/* fieldsets */
fieldset
{
	margin: 1.5em .5em;
	padding: 1em;
}

/* popup fieldsets has not enouhg place */
div.popup fieldset
{
	margin: .5em 0;
	padding: .3em;
}

/* buttons which submits or rejects informations filled
   in forms, mainly on the bottom of page */
div.submitButtons
{
	margin-top: 1em;
	margin-bottom: 1em;
}
div.submitButtons input
{
	margin-right: .2em;
}

/* submit buttons in the popup windows are centered and has no bottom margin */
div.popup div.submitButtons
{
	text-align: center;
	margin-bottom: 0;
}

/* tabs content:
 - mixed tab content = not only form items (tables, buttons, etc.)
 - tabContent = only form items */
div.tabContentMixed, div.tabContent
{
	border: 1px solid #c6d6f4;
	border-top: none;
	margin: 0 0 1em 0;
	/* NOTE: no horizontal padding - let contained items make place above and under (cause is that padding doesn't
	   overlap with margin)
	   BUT: there is problem with no padding & no border (not-null top margin of first contained item overlaps with
	   top null margin of this container and makes unwanted space between tabs and content) */
	padding: 1px 1.5em 0 1.5em;
}
div.tabContent { background-color: #ecf4fb; }

/* form part inside mixed content tab */
div.tabContentMixed div.formPart
{
	/* no border */
	border: none;
	/* NOTE: see note in tabContent class */
	padding-top: 1px;
	padding-bottom: 1px;
	/* negate margin and padding of mixed tab content */
	margin: -1px -1.5em 0 -1.5em;
}

/* listpair styles */
table.listPair { margin: 1em 0; }
table.listPair input, table.listPair select { display: block; }

/* display top labels as block with top margin */
label.topLabel,
div.shortInfoLabel
{
	display: block;
	margin: 0 0 0 .2em;
	white-space: nowrap;
}

/* form with form items in two or more columns to spare place */
table.formColumns td
{
	vertical-align: top;
	padding-right: 5em;
}
/* caused problems e.g. on page for user creation: asterisk following input element was not 
directly behind input, but it was shifted to new row behind the input */
table.formColumns div.formItem
{
	white-space:nowrap;
}


/*****************************************************************************/
/* Theme selector */

/* container of theme select */
.themeSelect
{
	width: 250px;
}

/* list with selected / all available themes */
.themeSelect ul
{
	list-style: none;
	margin: 0 0 1em 0;
	padding: 0;
	border: 1px solid #c6d6f4;
	border-bottom: none;
	font-weight: bold;
}

/* one list item with selected / available theme */
.themeSelect ul li
{
	margin: 0;
	padding: 5px;
	height: 70px;
	border-bottom: 1px solid #c6d6f4;
	cursor: pointer;
	text-align: right;
}

/* aditional info about theme */
.themeSelect ul li span
{
	display: block;
	font-weight: normal;
}

/* special styles for no-theme */
.themeSelect ul li#th
{
	font-style: italic;
}

/* chnage background color on hover */
.themeSelect ul li:hover
{
	background-color: #ecf4fb;
}

/* image is floated left and has fixed size */
.themeSelect ul img
{
	margin: 0 2em 0 0;
	width: 100px;
	height: 70px;
	float: left;
}


/*****************************************************************************/
/* Search */

/* TODO: (r.matej) search should be reworked to use the unified wrappanel/visibility-switcher */

/* container of search */
div.search
{
	margin: 2em 0;
}

/* search header */
div.searchHeader,
div.searchHeaderActive
{
	position: relative;
	top: 1px;
	width: 18em;
	margin: 0;
	padding: 0;
	border-bottom: solid 1px #c6d6f4;
	background: transparent url("vswitch/right.gif") no-repeat right top;

}
div.searchHeaderActive
{
	background: transparent url("vswitch/right-active.gif") no-repeat right top;
	border-bottom: solid 1px #ecf4fb;
}

/* a:visited have to be here because in IE6 a:visited doesn't take styles from a */
div.searchHeader a,
div.searchHeader a:visited,
div.searchHeaderActive a,
div.searchHeaderActive a:visited
{
	display: block;
	background: transparent url("vswitch/left.gif") no-repeat left top;
	padding: .1em 1em;
	text-decoration: none;
	outline: none;
}

/* do not display checkbox in search header */
div.searchHeader input, div.searchHeaderActive input { display: none; }
div.searchHeader { height: 19px; }

/* search body containing the search form */
/* TODO: (r.matej) stolen from the tabContent class for now */
div.searchBody
{
	border: 1px solid #c6d6f4;
	margin: 0 0 1em 0;
	/* NOTE: no horizontal padding - let contained items make place above and under (cause is that padding doesn't
	   overlap with margin)
	   BUT: there is problem with no padding & no border (not-null top margin of first contained item overlaps with
	   top null margin of this container and makes unwanted space between tabs and content) */
	padding: 1px 1em 0 1.5em;
	background-color: #ecf4fb;
}

/* search submit buttons */
div.searchBody div.submitButtons
{
	text-align: center;
	padding: 0;
	margin: 0;
}


/*****************************************************************************/
/* DatePicker */

.dpTable
{
	border: 1px solid #aaa;
	font-family: tahoma, arial, helvetica, sans-serif;
	font-size: 12px;
	text-align: center;
	color: #505050;
	background-color: #f2f7fb;
}

.dpTableNavig,
.dpNavigButtonsTR,
.dpButtonNavigLeftTD,
.dpButtonNavigRightTD
{
	margin: 0;
	padding: 0; 
}

/* pointer cursor on all days */
.dpTD,
.dpDayHighlightTD
{
	cursor: pointer;
}

.dpDayHighlightTD
{
	border: 1px solid #aaa;
	background-color: #ccc;
}

.dpTodayButtonTD
{
	text-align: center;
	width: 100%;
}

.dpCloseButtonTD
{
	text-align: right; 
}

.dpButtonNavigLeftTD
{
	text-align: left;
}

.dpButtonNavigRightTD
{
	text-align: right;
}

.dpDayTD
{
	border: 1px solid #aaa;
	color: white;
	background-color: #ccc;
	margin: 0;
	padding: 0 2px;
}

.dpTitleText
{
	margin-left: 16px;
	font-weight: bold;
	font-size: 12px;
	color: #808080;
}

.dpDayHighlight
{
	font-weight: bold;
}

.dpButtonBack,
.dpButtonBack2,
.dpButtonNow,
.dpButtonNext,
.dpButtonNext2,
.dpButtonClose
{
	height: 18px;
	border: 0;
	background-repeat: no-repeat;
	text-decoration: none;
	color: #fff;
	background-color: #f2f7fb;
	cursor: pointer;
}

/* icons' sizes */
.dpButtonBack,
.dpButtonNext,
.dpButtonBack2,
.dpButtonNext2
{
	margin: 2px;
	width: 16px;
}

.dpButtonNow
{
	width: 29px;
}

.dpButtonClose
{
	width: 16px;
	height: 16px;
}

/* icons' background images */
.dpButtonBack { background-image: url("datepicker/previous.gif"); }
.dpButtonBack2 { background-image: url("datepicker/pprevious.gif"); }
.dpButtonNow { background-image: url("datepicker/today.gif"); }
.dpButtonNext { background-image: url("datepicker/next.gif"); }
.dpButtonNext2 { background-image: url("datepicker/nnext.gif"); }
.dpButtonClose { background-image: url("datepicker/close.gif"); }


/*****************************************************************************/
/* Install info table */

/* TODO: (r.matej) this should be generalized and used on all info tables */

/* some space between rows */
table.aboutInfo th, table.aboutInfo td { padding-bottom: .7em; }

/* table inside this table (modules info) has no space between rows */
table.aboutInfo table td { padding-bottom: 0; }

/* table heading style */
table.aboutInfo th
{
	vertical-align: top;
	text-align: left;
	padding-right: 1em;
}


/*****************************************************************************/
/* Misc */

/* image map with customizable areas */
img.customizableAreas
{
	display: block;
	margin: 1em 0;
	border: 1px solid #000;
}

/* table cell with the theme preview */
td.themePreviewCell
{
	width: 120px;
	text-align: center;
}

.instructions
{
	font-style: italic;
}
p.instructions em
{
	font-style: normal;
	font-weight: bold;
}


/*****************************************************************************/
/* Mess to clean */

/* TODO: (r.matej) remove this styles */

.layout { border: 0; margin: 0; padding: 0; text-align: left; }
#DataViewTable { border-style: solid; border-color: #d0d0d0; }
#DataViewTable TD { padding: 3 3 3 3; }
.BoldLabel { font-weight: bold; }
.InlineFileUpload { display: inline; }