/* 
 * Stylesheet for FotoWeb 6.0. Copyright (C) FotoWare a.s. 1997-2008. All rights reserved. 
 *
 * This stylesheet controls both elements that are placed on the page through pure html,
 * and elements that are produced in code. The elements produced in code expects the classes
 * to be named exactly as they are in this stylesheet, so do not rename any elements.
 *
 *
 *
 * 3.0 palette colors:
 *
 * #000000 - black
 *
 * color variant                         grayscale variant
 * #025170 - darkest                     #393939
 * #007EB1 - dark                        #585858
 * #02AAE9 - normal                      #757575
 * #8FD1F3 - lighter                     #C1C1C1
 * #D0EDFD - lightest                    #E6E6E6
 * #EDF8FE - background                  #F5F5F5
 *
 * #FFFFFF - white
 *
 * #708090 - gray
 * #000099 - warning (blue)
 * #990000 - error (red)
 *
 * */


/* *******************************************************************
 * 
 * Basic formatting of background and text style 
 * This section controls the general html on the pages that
 * does not have any special formatting requirements and also
 * provides generic appearance that is inherited by the specialized
 * controls.
 *
 * */
body
{
	color                : #000000;
	background-color     : #FFFFFF;
	padding              : 0px;
	margin               : 0px;
}

body, p, br, nobr, div, span, td, textarea, input, select, option
{
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : normal;
	text-decoration      : none;
}

a, a:link, a:visited, a:active, a:hover
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : normal;
	text-decoration      : none;
}

a:hover
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : normal;
	text-decoration      : underline;
}

h1
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 16px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : bold;
	text-decoration      : none;
}

h2
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 14px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : bold;
	text-decoration      : none;
}

.Label
{
	background-color     : inherit;
	color                : #000000;
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : bold;
	text-decoration      : none;
}

.ThumbnailIcons
{
	vertical-align       : middle;
	border               : 0px;
	width                : 16px;
	height               : 16px;
}

/* *******************************************************************
 * 
 * Generic classes used by many controls in FotoWeb.
 * These can be specialized, but these definitions should
 * generally be enough.
 *
 * */

/* Text input field used in all forms */
.InputControl, .EmphasizedInputControl
{
	height               : 24px;
	vertical-align       : baseline;
	padding-top          : 2px;
	padding-left         : 3px;
}

/* Input of an important field in a form */
.EmphasizedInputControl
{
	font-weight          : bold;
	color                : inherit;
	background-color     : #D0EDFD;
}

/* The choice (usually a command) is disabled (but not hidden).
 * Grayed out is the default (as with dimmed buttons in the native gui) */
.Disabled
{
	color                : #000000;
	background-color     : inherit;
}

/* The choice (usually a command) should be emphasized as an important
 * choice to attract the user's attention. Bold is the default */
.Emphasized
{
	font-weight          : bold;
}

/* Set for a text label or control if the user needs to be specially warned
 * or notified about anything. Note that this is not an error, then the .Error
 * class is used */
.Warning
{
	color                : #000099;
	background-color     : inherit;
}

/* Used for a text label or control when the user must be notified about
 * an error */
.Error
{
	color                : #990000;
	background-color     : inherit;
}

.SimpleBorder
{
	border               : 1px solid #8FD1F3;
}

/* A multiline text edit field */
.MultiLineInputControl
{
	width                : 250px;
	height               : 150px;
}

/* A listbox with multiple items (as a list of keywords */
.ListBoxControl
{
	width                : 250px;
	height               : 150px;
}

/* A button */
.ButtonControl, .EmphasizedButtonControl
{
	padding-top          : 2px;
	padding-bottom       : 3px;
}

/* An exceptionally important button */
.EmphasizedButtonControl
{
	font-weight          : bold;
	color                : inherit;
	background-color     : #D0EDFD;
} 

/* *******************************************************************
 * 
 * Classes that control the appearance of elements that appear on all
 * FotoWeb pages, e.g. the title of the page, the toolbars, status line
 * and page navigators
 *
 * */

/* The body pane of the page (by default the white area that contains
 * data and information */
.PageBody
{
	height               : 400px;
	color                : #000000;
	background-color     : #FFFFFF;
}

/* The header of the page that contains the title of the page and
 * a description of the page or the current item that the user is
 * working with. */
.PageHeader
{
	padding-right        : 2px;
	padding-left         : 8px;
	padding-bottom       : 10px;
	padding-top          : 8px;
	color                : inherit;
	background-color     : #FFFFFF;
}

.Titlebar
{	
	position             : fixed;
 	top                  : 0;
	z-index              : 999;
	width                : 100%;
	height               : 29px;
}

.TitlebarTable
{
	background-color     : #025170;
	color                : #FFFFFF;
}

.TitlebarLink
{
	background-color     : #025170;
	color                : #FFFFFF;
	text-decoration      : none;
}

.TitlebarLink:hover
{
	background-color     : #025170;
	color                : #FFFFFF;
	text-decoration      : underline;
}


.TitlebarHeading
{
	background-color     : #025170;
	color                : #FFFFFF;
	font-size            : 16px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : bold;
	text-decoration      : none;
}

/* The toolbar with global and page specific links. Note that the
 * links can have the .Emphasized class, so you might want to override
 * this class for the .Toolbar class to turn it off or change it's appearance.
 * You can do this by defining a class ".Toolbar .Emphasized" and give it the
 * attributes you prefer. */
.Toolbar
{

	/* padding-right        : 2px;*/
	/* padding-left         : 8px;*/
	/* padding-bottom       : 2px;*/
	/* padding-top          : 4px;*/
	color                : inherit;
	background-color     : #D0EDFD;
	padding				 : 0px;

}

.PageNavigationTopNavigationPane
{
		position             : relative;
		z-index              : 200;
		left                 : 10px;
		margin-left          : 0px;
		height				 : 20px;

		width                : 78%;
}


.PageNavigationTopNoNavigationPane
{
	left                 : 10px;
}

/* The various divGrids refer to the section starting with the title that is hovering over the 
 * thumbnails, typically displaying the text "You are now browsing archive..."
 *
 * The styles come in four different "flavours" depending on what is on display. The style
 * names should be self-explanatory, with "NP" being the short form for "Navigation Pane"
 */
.divGridNPNotSearchAble, .divGridNPSearchAble 
{
	position             : absolute;
	left                 : 22%;
	width                : 75%;
	overflow             : hidden;
	margin               : 0px;
	padding              : 0px;

	
		
			top          : 125px;
		
		
}

.divGridNotSearchAble, .divGridSearchAble
{
	position             : absolute;
	left                 : 20px;
	width                : 100%;
	overflow             : hidden;
	margin               : 0px;
	padding				 : 0px;
	
	
		
			top          : 115px;
		
	
}

/* The CommandToolbar is the toolbar that appears on certain pages to modify
 * either selected objects in a list or the object that the page is currently
 * displaying, e.g. when viewing an album */
.CommandToolbar, .CommandToolbarBBorder
{
	padding-right        : 2px;
	padding-left         : 8px;
	padding-bottom       : 3px;
	padding-top          : 3px;
	line-height          : 17px;
	height               : 30px;	
	
	color                : inherit;
	background-color     : #EDF8FE;
}

#CommandToolBarDiv
{
	width: 100%;
	height: 30px;
	margin: 3px 0 3px  0
	padding: 0;
}

.CommandToolbarBBorder
{
	color                : inherit;
	border-bottom        : 1px solid #D0EDFD;
}

/* The ControlPanel contains other controls on a page, e.g. buttons, edit fields
 * and so on. By default, it is not visible by itself, and is not rendered if
 * it does not contain any elements. This class is only provided for those who
 * want to change the design and want the panel to be explicitly shown */
.ControlPanel
{
}

/* A line with status information below the data pane. This is not the same
 * as the status line in the browser! This is a html-controlled element, 
 * and stays the same until the user refreshes the page (and the reason for the
 * status message disappears, of course).
 *
 * The StatusLineMessage and StatusLineWarning classes are specializations when 
 * FotoWeb needs to signal a message or an extra important message. See below */
.StatusLineEmpty, .StatusLineMessage, .StatusLineWarning
{
	padding-right        : 8px;
	padding-left         : 8px;
	padding-bottom       : 2px;
	padding-top          : 2px;
	/*border-top           : 1px solid #D0EDFD;*/
	color                : inherit;
	background-color     : #FFFFFF;
	margin-top           : 2px;
}

/* When there is a message in the status line, this specialization
 * is used. Normally, the status line will change color to draw the
 * user's attention. */
.StatusLineMessage
{
	color                : Black;
	background-color     : #FFFF00;
}

/* If FotoWeb needs to signal something important on the statusline,
 * this class is used. The default is to change the background-color to yellow,
 * which should catch the user's attention. ;) */
.StatusLineWarning
{
	color                : White;
	background-color     : #FF0000;
}

/* The Navigator is the element that allows the user to move between pages
 * in a list or grid. */
.Navigator
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : normal;
	text-decoration      : none;
}

/* Specialization of the A:hover class for the Navigator */
.Navigator A:hover
{
	background-color     : inherit;
	color                : #025170;
	font-size            : 11px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-style           : normal;
	font-weight          : normal;
	text-decoration      : underline;
}

/* The ImageLinkButton is a control that contains an icon and a text and
 * behaves like a link which posts information back to the server.
 * The control has a special disabled state when the button is shown but not active */
.ImageLinkButton
{
}
.ImageLinkButton A:hover
{
	text-decoration      : underline;
}
.DisabledImageLinkButton
{
}

/* *******************************************************************
 * 
 * Basic table look, this is used by all lists and information tables.
 * However, the different main types of tables can be customized by specializing
 * these classes 
 *
 * */

/* Index-card style used as the header for a table. This is a 150-pixel
 * wide cell with the header of the table or section. */
.TableTitle
{
	border-top           : 1px solid #D0EDFD;
	border-right         : 1px solid #D0EDFD;
	border-left          : 1px solid #D0EDFD;
	background-color     : #D0EDFD;;
	color                : inherit;
	background-repeat    : no-repeat;
	height               : 25px;
}

/* Row separating parts of a table containing the header for a section
 * and sometimes the header for the table itself. */
.TitleRow
{
	height               : 25px;
	font-weight          : bold;
	color                : inherit;
	background-color     : #D0EDFD;
	border-top           : 1px solid #D0EDFD;
	border-bottom        : 1px solid #D0EDFD;
}

.TitleCell
{
	font-weight          : bold;
	color                : inherit;
	background-color     : #D0EDFD;
}

/* The row containing the column names */
.ColumnHeaderRow
{
	font-weight          : bold;
	color                : #000000;
	background-color     : #8FD1F3;
	height               : 20px;
	padding-left         : 4px;
}

.ColumnHeaderCell
{
	font-weight          : bold;
	color                : #000000;
	background-color     : #8FD1F3;
}

/* A row with information, the main body of the table */
.DataRow
{
	color                : inherit;
	background-color     : #EDF8FE;
}

/* Every second row of information has this class, to allow different background color
 * to make it easier for the eye to follow the text along a row */
.AlternatingDataRow
{
	color                : inherit;
	background-color     : #F4F2F0;
}

/* A row of information when selected */
.SelectedDataRow
{
	color                : inherit;
	background-color     : #DDD9D1;
}

/* If a row in the table is expanded to show more information, this is the class
 * for that row. This row can contain almost any kind of information, depending
 * on the functionality of the control that uses it. */
.DetailInformationRow
{
}

/*****************************************************************************
*
* The following classes are for the list view control.
*
*****************************************************************************/
.ListViewHeader, .ListViewRow, .ListViewRowAlt
{
	height              : 30px;
}

.ListViewRow
{
}

.ListViewRowAlt
{
}

.ListViewHeader
{
}

.ListViewHeaderItem
{
	padding-left        : 5px;
	vertical-align      : middle;
}

.ListViewItem
{
	padding-left        : 5px;
	vertical-align      : middle;
}

.ListViewItemAlt
{
	padding-left        : 5px;
	vertical-align      : middle;
	border-left         : 1px solid #C1C1C1;
	border-right        : 1px solid #C1C1C1;
}

/* *******************************************************************
 * 
 * Specialization classes. By extending these classes, you can easily
 * change the appearance of one control only.
 *
 * Example                                                            : If you want to make the AlbumList table look different
 * than all other tables, create and fill the following classes:
 *		.AlbumListTable .TitleRow
 *		.AlbumListTable .ColumnHeaderRow
 *		.AlbumListTable .DataRow
 *		.AlbumListTable .AlternatingDataRow
 *		.AlbumListTable .SelectedDataRow
 *		.AlbumListTable .DetailInformationRow
 *
 * All classes below identify a single control each, and all can be
 * specialized as described above.
 *
 * */

/* Control is displaying a list of albums */
.AlbumListTable
{
}

/* Control is showing all properties of an album */
.AlbumDetailForm
{
}

/* Control is mainly showing lists of groups and users */
.ReportViewTable
{	
}

/* Online registration form */
.RegistrationForm
{
}

/* *******************************************************************
 * 
 * DocumentMatrix classes.
 *
 * This is the class that is used by the .aspx pages that display
 * image lists and grids. It is now called DocumentMatrix since we 
 * are not only dealing with images :)
 *
 * Note: The abbrev. 'DocMtx' is used in stead of 'DocumentMatrix'
 * in all child-definitions
 *
 * */

/* When in grid mode, this is used as the default class for the outermost table */
.DocumentMatrixGrid
{
}

/* When in list mode, this is used as the default class for the outermost table */
.DocumentMatrixList
{
}

/* Each of the main rows in the grid or list */
.DocMtxRow
{
}

/* Every second row in the grid or list */
.DocMtxAltRow
{
}

/* A cell with image information. In grid, there are more than one on each row,
 * when in list mode, there is only one per row. */
.DocMtxCell, .DocMtxSelectedCell
{
	padding              : 0 0 0 10px;
	margin-left          : 1px;
	margin-top           : 1px;
	font-family          : Arial, Helvetica, Sans-Serif;
	font-size            : 11px;
	font-weight          : bold;
	font-style           : normal;
	text-decoration      : none;
	color                : #000000;
	background-color     : #FFFFFF;
	border               : 1px solid #D0EDFD;
}

/* Every second cell in the grid. When in list mode, this class is not used */
.DocMtxAltCell
{
	padding              : 0 0 0 10px;
	color                : #000000;
	background-color     : #FFFFFF;
	border-right         : 1px solid #D0EDFD;
	border-bottom        : 1px solid #D0EDFD;
}

/* A cell in the grid when the image within has been selected */
.DocMtxSelectedCell
{
	color                : inherit;
	background-color     : #D0EDFD;
	border               : 1px solid #FFFF00;
}

/* The filename */
.DocMtxFilename
{
	font-family          : Arial, Helvetica, Sans-Serif;
	font-size            : 11px;
	font-weight          : bold;
	font-style           : normal;
	text-decoration      : none;
	color                : #000000;
}

/* The custom iptc-field (if any) displayed in the grid/list */
.DocMtxIptc
{
}

/* The class used for the img-tag holding the thumbnail or preview in the matrix */
.DocMtxPreviewImg
{
	color                : inherit;
	background-color     : #FFFFFF;
}

/* The cell that holds the thumbnail or preview in the matrix */
.DocMtxPreviewCell, .DocMtxSelectedPreviewCell
{
	color                : inherit;
	background-color     : #D0EDFD;
	border               : 1px solid #FFFF00;
}

/* The cell that holds the thumbnail in the matrix when the file is selected. */
.DocMtxSelectedPreviewCell
{
	border               : 3px solid #FFFF00;
}

/* The checkbox shown with each thumbnail to allow multiple selection */
.DocMtxItemCheckBox
{
	margin               : 0px 0px 0px -4px;
}

/* *******************************************************************
 *
 * TABSTRIP CONTROL
 *
 * These classes control the appearance of the tabstrip control
 * that is used to present different controls as if they were on 
 * separate pages behind eachother.
 *
 * */

/* The class set on the tabstrip table itself */
.TabStrip
{
}

/* The link in each cell */
.TabStripText
{
}

/* A normal tab (not selected) */
.TabStripNormalTab, .TabStripDisabledTab
{
	color                : #000000;
	background-color     : #D0EDFD;
}

/* The one (and only) selected tab in the strip */
.TabStripSelectedTab
{
	color                : #000000;
	background-color     : #8FD1F3;
	
}

/* A disabled (but visible) tab */
.TabStripDisabledTab
{
}

.TabStripNormalTab, .TabStripSelectedTab, .TabStripDisabledTab
{
	border-top           : 1px solid #8FD1F3;
	border-right         : 1px solid #8FD1F3;
	border-left          : 1px solid #8FD1F3;
	padding-right        : 7px;
	padding-left         : 7px;
	padding-bottom       : 2px;
	padding-top          : 2px;
}

.TabStripSelectedTab .TabStripText
{
}

/* The line below the tabstrip (that the tabs are attached to)
 * Should have the same background color as the TabStripSelectedTab */
.TabStripEdgeBelowCell
{
	color                : inherit;
	background-color     : #8FD1F3;
	height               : 6px;
	padding-right        : 7px;
	padding-left         : 7px;
}
/* This is the last cell on the filler line which is only used to
 * fill space in the control;hence it has no tabs above it. */
.TabStripEdgeEmpty
{
	color                : inherit;
	background-color     : #8FD1F3;
	border-top           : 1px solid #8FD1F3;
	height               : 6px;
	padding-right        : 7px;
	padding-left         : 7px;
}

/* *******************************************************************
 * 
 * Table style for the search word highlight table
 *
 * */

/* Main table */
.SearchHighlight
{
	border-top           : #D0EDFD 1px solid;
	border-bottom        : #D0EDFD 1px solid;
	border-right         : #D0EDFD 1px solid;
	border-left          : #D0EDFD 1px solid;
	color                : #000000;
	background-color     : #02AAE9;
	background-repeat    : no-repeat;
}

/* Title row */
.SearchHighlightX TR
{
	color                : inherit;
	background-color     : #D0EDFD;
}

/* A row with information, the main body of the table */
.SearchHighlightX TD
{
	color                : inherit;
	background-color     : #F5F5F5;
}

/* Horizontal splitter lines, as seen in preview.fwx  */
.fwSeparatorLine
{
	color				: #D0EDFD;
	background-color	: #D0EDFD;
}

/***************************************************************************************************
*
*
* Alerts.css
*
***************************************************************************************************/

/* CSS Document */

.AlertsControl
{
	border               : 0px none;
	border-collapse      : collapse;
}

.AlertsControl tr
{
	height               : 30px;
}

.AlertsControl th
{
	text-align           : left;
	margin               : 0px;
	padding              : 2px 4px;
}

.AlertsControl td
{
	margin               : 0px;
	border-bottom        : 1px solid #CCCCCC;
	padding              : 2px 4px;
}

.SearchTermsHeader
{
	width                : 300px;
}

.ArchiveHeader
{
	width                : 150px;
}

.FrequencyHeader
{
	width                : 150px;
}

.ActionHeader
{
	width                : 150px;
}

.SearchTermsCell
{
}

.ArchiveCell
{
}

.FrequencyCell
{
}

.ActionCell
{
}

.ActionCell a
{
	margin-right         : 5px;
}

/***************************************************************************************************
*
*
* QuickText.css
*
***************************************************************************************************/

/*Stylesheet for the QuickText controls in FotoWeb 6.0
. These styles control the appearance of the QT control that is rendered by the tag QuickTextControl.

For further customization of this control (thatcannot be achieved using CSS, consider creating your own form in Html).

These styles have been put in a separate file to make it easier to use them together with stylesheets that have been customized for earlier versions of FotoWeb.*/

.quickTextControl 
{ 
	width                : 100%;
	padding              : 10px;
	margin-top           : 5px;
	color                : inherit;
	background-color     : #D0EDFD;
	border-top           : 1px solid #D0EDFD;
	border-bottom        : 1px solid #D0EDFD;
}

.qtHideableControlArea 
{ 
}

.quickTextControl .label 
{ 
	font-weight          : normal;
	margin-right         : 3px;
	margin-left          : 10px;
}

.quickTextControl .qtShowHideBtn 
{ 
	font-weight          : bold;
}

.qtInputSection 
{ 
	clear                : left;
	margin-top           : 5px;
}

.qtFieldSelection 
{ 
	float                : left 
}

.qtModeSelection 
{ 
	float                : left;
}

.qtTextInput 
{ 
	float                : left;
}
.qtTextInput input 
{ 
	width                : 250px;
}

.qtPlusMinusBtn 
{ 
}

.qtSubmitBtn 
{ 
	font-weight          : bold;
}

.qtControlButtons 
{ 
	float                : left;
	margin-left          : 10px;
}

.qtSubmitButtons 
{ 
	clear                : left;
	padding-top          : 10px;
}

/***************************************************************************************************
*
*
* TopMenu.css
*
***************************************************************************************************/

/*
	Visual styling of top menu.
*/

/* Css classes for top menu. */
.fwTopMenuHolder
{
	position             : fixed;
	z-index              : 999;
	top                  : 29px;
	width                : 100%;
	height               : 21px;
	color                : inherit;
	background-color     : #D0EDFD;
	display              : block;
	border               : 0px;
}

.fwTopMenuContainerRoot
{
}

.fwTopMenuContainer
{
}

.fwTopMenuItem, .fwTopMenuItemSelected
{
	cursor               : default;
	width                : 110px;
	height               : 20px;
	padding-left         : 4px;
	padding-top          : 0px;
}

.fwTopMenuItem
{
	color                : #000000;
	background-color     : #D0EDFD;
	border               : 1px solid #8FD1F3;
}

.fwTopMenuItemSelected
{
	color                : #000000;
	background-color     : #8FD1F3;
	border               : 1px solid #8FD1F3;
}

/***************************************************************************************************
*
*
* ImageMenu.css
*
***************************************************************************************************/
/*
	Visual styling of image menus.
*/
.fwImageMenuContainerRoot
{
}

.fwImageMenuContainer
{
}

.fwImageMenuItem, .fwImageMenuItemSelected
{
	cursor               : default;
	width                : 130px;
	height               : 20px;
	padding-left         : 4px;
	padding-top          : 0px;
}

.fwImageMenuItem
{
	color                : #000000;
	background-color     : #D0EDFD;
	border               : 1px solid #8FD1F3;
}

.fwImageMenuItemSelected
{
	color                : #000000;
	background-color     : #8FD1F3;
	border               : 1px solid #8FD1F3;
}

/***************************************************************************************************
*
*
* Menu items in general
*
***************************************************************************************************/
.NormalMenuItem
{
	color                : #000000;
	background-color     : #D0EDFD;
	border               : 1px solid #8FD1F3;
}

.SelectedMenuItem
{
	color                : #000000;
	background-color     : #8FD1F3;
	border               : 1px solid #8FD1F3;
}

/***************************************************************************************************
*
* The following classes are for the tab strip control.
*
***************************************************************************************************/
.TabStripSelected
{	
	color                : #000000;
	background-color     : #8FD1F3;
}

.TabStripUnselected
{
	color                : #000000;
	background-color     : #D0EDFD;
}

.TabStripSelected, .TabStripUnselected
{
	padding-bottom      : 2px;
	padding-top         : 2px;
	padding-left        : 8px;
	padding-right       : 8px;
	border-top          : solid 1px #8FD1F3;
	border-left         : solid 1px #8FD1F3;
	border-right        : solid 1px #8FD1F3;
	cursor              : default;
}

.TabStripPane
{
	padding-top         : 5px;
	padding-bottom      : 15px;
	padding-left        : 5px;
	padding-right       : 5px;
	border              : solid 1px #8FD1F3;
}

/***************************************************************************************************
*
*
* Marquee.css
*
***************************************************************************************************/
.fwMarquee
{
	width                : 100%;
	overflow             : hidden;
	display				 : block;
	height               : 230px;
}

.fwMarqueeElement a, a:hover
{
	cursor               :default;
}

.fwMarqueeElement
{
	position             : absolute;
}

/***************************************************************************************************
*
*
* FotoWeb30.css
*
***************************************************************************************************/
.pageFooter
{
	font-size            : xx-large;
	background-color     : #FFFFFF;
	position             : fixed;
	top                  : 100%;
	width                : 100%;
	height               : 80px;
	z-index              : 500;
	margin-top           : -50px;
	border-top           : 1px solid #8FD1F3;
}

.pageFooter .logoImage 
{ 
	vertical-align       : middle;
	float                : left;
	margin-top           : 5px;
	margin-right         : 15px;
	margin-left          : 15px;
}
.pageFooter .legalText 
{
	clear                : both;
	float                : left;
	margin-top           : 6px;
	margin-left          : 15px;
}
.pageFooter .pbInfo
{ 
	float                : left;
	margin-top           : 6px;
	color                : Green;
	background-color     : inherit;
	font-weight          : bold;
}
.pageFooter .pbWarning
{ 
	float                : left;
	margin-top           : 6px;
	color                : rgb(255,0,255);/* Magenta */ 
	background-color     : inherit;
	font-weight          : bold;
}
.pageFooter .pbError
{ 
	float                : left;
	margin-top           : 6px;
	color                : Red;
	background-color     : inherit;
	font-weight          : bold;
}
.tabStrip2
{
	margin-top           : 3px;
	margin-bottom        : 10px;
}
.tabHeader, .tabHeaderActive
{
	padding-top          : 2px;
	padding-bottom       : 2px;
	padding-left         : 4px;
	padding-right        : 4px;
	text-align           : center;
	vertical-align       : middle;
	height               : 15px;
	min-width            : 60px;
	float                : left;
	margin               : 3px;
}
.tabHeader
{
	border               : 1px solid #8FD1F3;
	color                : #000000;
	background-color     : #D0EDFD;
}
.tabHeaderActive
{
	border               : 1px solid #8FD1F3;
	color                : #000000;
	background-color     : #8FD1F3;
}

.tabHeaderLabel
{
}

.tabHeaderLink
{
}

.NavigationPane
{
	position             : fixed;
	/* top                  : 105px;*/
	
	bottom               : 40px;
	left                 : 1px;
	overflow             : auto;
	padding              : 3px;
	float                : left;
	width                : 20%;
	margin-top           : 15px;
	margin-left          : 10px;
	color                : inherit;
	background           : #F5F5F5;
	border               : solid 1px #E6E6E6;
	
	

		

			top          : 118px;

		

	
}

.gridTable 
{	
	margin-bottom        : 10px;	
}

.fwTreeView img
{
	border               : none;
}
.firstSearchGroup
{
	margin-top           : 30px;
	font-weight          : bold;
	display              : block;
}
.nextSearchGroup, .sgOnlyList, .sgRange
{
	margin-top           : 10px;
	font-weight          : bold;
	display              : block
}
.sgOnlyList select
{
	position             : absolute;
	left                 : 150px;
	width                : 80px;
}
.sgRange .min, .sgRange .max
{
	position             : absolute;
}
.sgRange select
{
	position             : absolute;
	left                 : 150px;
	width                : 80px;
}
.sgRange .min
{
	left                 : 250px;
	width                : 150px;
}
.sgRange .max
{
	left                 : 400px;
	width                : 150px;
}
#archiveSelect select
{
	width                : 250px;
}
#mediaType select
{
	width                : 250px;
}

.firstSearchGroup .matchTypeSelector, .nextSearchGroup .matchTypeSelector
{
	position             : absolute;
	left                 : 150px;
	width                : 150px;
}
.firstSearchGroup .textInput, .nextSearchGroup .textInput
{
	position             : absolute;
	left                 : 305px;
	width                : 180px;
}
.firstSearchGroup .fieldSelector, .nextSearchGroup .fieldSelector
{
	position             : absolute;
	left                 : 490px;
}
#advancedOptions, #dropDownOptions
{
	margin-top           : 30px;
}
#byline select, #credit select, #source select, #country select, #city select, #supplementalCategory select, #keyword select,
#storage select, #color select, #orientation select, #textStatus select
{
	width                : 350px;
}
/*
#dateRange
{
	background-color     : cyan;
	width                : 800px;
}

#dateRange select
{
	width                : 250px;
}

#dateRange .min, dateRange .max
{
 	// position            : auto;
	// left                : auto;
	
}
*/

.fwSelectionList .fwSelectedImage
{
	position             : relative;
	float                : left;
}

.fwSelectedImage
{
	padding              : 5px;
}


/********************************************************************************************************
*
* CSS classes for FotoWeb drop down control.
*
*/

.fwDropDown
{
	border               : 1px solid black;
}

.fwDropDown_Selection
{
	color                : inherit;
	background-color     : white;
}

.fwDropDown_Items
{
	border               : 1px solid black;
}

.fwDropDown_Item
{
	color                : inherit;
	background-color     : white;
}



/********************************************************************************************************
*
* CSS classes for FotoWeb message box control.
*
*/


.fwMessageBox
{
	border               : 1px solid black;
	width                : 500px;
	height               : 300px;
	color                : inherit;
	background-color     : white;
}

.fwMessageBoxTitle
{
	color                : white;
	background-color     : #025170;
	padding              : 5px;
	font-weight          : bold;
}

.fwMessageBoxMessage
{
	padding              : 5px;
	color                : inherit;
	background-color     : white;
	text-indent          : 10px;
}


.fwMessageBoxButtons
{
	color                : inherit;
	background-color     : white;
	padding              : 5px;
	text-align           : center;
}



/********************************************************************************************************
*
* CSS classes for FotoWeb preview size list control.
*
*/

span.PreviewSizeList
{
	font-weight          : bold;
	padding              : 5px;
}

select.PreviewSizeList
{
}

img.PreviewSizeList
{
}





/********************************************************************************************************
*
* CSS classes for File Actions page.
*
*/

.FileActionButton
{
	width                : 100px;
}




/********************************************************************************************************
*
* Browser-dependant styles for the div boxes in default.fwx
*
*/
.Search, .Login
{
	border               : solid 0px red;
	width                : 450px;
	height               : 130px;
	padding              : 15px;
	position             : relative;
	
	text-align           : center;
	vertical-align		 : top;
	margin               : 15px;
	position			 : relative;
	
	
	
	

		margin-top   : -40px;

	
	
}




/********************************************************************************************************
*
* Page top offset
*
*/

.OffsetWithMenu
{
	

		height           : 50px;

		
}

.OffsetWithoutMenu
{	
	
	
		height           : 30px;
		
	
}



/********************************************************************************************************
*
* Server Error Page
*
*/

.ServerErrorPage
{
	border               : solid 1px #E6E6E6;
	padding              : 5px;
}

.ServerErrorAssistance
{
	border               : solid 1px #E6E6E6;
	background-color     : #FFFFCC;
	margin               : 5px;
	padding              : 15px;
}

/********************************************************************************************************
*
* System Log Page
*
*/

.SystemLogPage
{
	padding              : 5px;
}


/********************************************************************************************************
*
* Sessions List Page
*
*/

.SessionListPage
{
	padding              : 5px;
}




/********************************************************************************************************
*
* Album controls
*
*/


.AlbumListControl
{
}

.AlbumListControlEx
{
}

.AlbumPropertiesControl
{
}

.AlbumNameEdit
{
}

.AlbumDescriptionEdit
{
}

.AlbumPropertiesControlEx
{
}

.AlbumSelectionControl
{
}

.AlbumSharingControl
{
}

.AlbumPageContents
{
}

.AlbumInvitationControl
{
	padding           :5px;
}

.AlbumInvitationListControl
{
}

.AlbumContactSheetControl
{
	padding           :5px;
}

.EmailSubject
{
	width             : 200px;
}

.EmailMessage
{
	width             : 200px;
	height            : 100px;
}

.EmailRecipientSelectionControl
{
}



/********************************************************************************************************
*
* Thumbnail list control
*
*/

.ThumbListControl
{
	border           : 1px solid gray;
}

.ThumbListControlFirstImage
{
	border           : 2px dashed #02AAE9;
}

.ThumbListControlNextImage
{
	padding          :5px;
}



/*****************************************************************************
*
* The following classes are for the tool bar control.
*
*****************************************************************************/

.ToolbarControl
{
	height              : 45px;
	display             : block;
	cursor              :default;
}

.ToolbarButton, .ToolbarSeparator
{
	float               : left;
}
.ToolbarButton
{
	padding-right       : 8px;
	padding-left        : 8px;
	padding-top         : 15px;
	height              : 30px;
}

.ToolbarSeparator
{
	padding-top         : 5px;
	height              : 40px;
}


.CheckedOutFileTab
{
	width               : 500px;
}


.fwTECheckedOutWarning
{
	color               : #FF0000;
	background-color    : inherit;
}