/**
 * Stylesheet for FotoWeb 7.0. Copyright (C) FotoWare a.s. 1997-2009. 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                : #3A4249;
    background-color     : #F4F4F4;
    padding              : 0px;
    margin               : 0px;
}

body, p, br, nobr, div, span, td, textarea, input, select, option
{
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : normal;
    text-decoration      : none;
}

a, a:link, a:visited, a:active, a:hover
{
    background-color     : inherit;
    color                : #3399CC;
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : normal;
    text-decoration      : underline;
}

a:hover
{
    background-color     : inherit;
    color                : #4C67A1;
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : normal;
    text-decoration      : underline;
}

h1
{
    background-color     : inherit;
    color                : #3A4249;
    font-size            : 16px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : bold;
    text-decoration      : none;
}

h2
{
    background-color     : inherit;
    color                : #3A4249;
    font-size            : 14px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : bold;
    text-decoration      : none;
}

.Label,
label /* added normal label tag */
{
    background-color     : inherit;
    color                : #3A4249;
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : bold;
    text-decoration      : none;
}

.ThumbnailIcons
{
    vertical-align       : middle;
    border               : 0px;
    width                : 16px;
    height               : 16px;
}

/********************************************************************************************************
*
* 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;
}

/* *******************************************************************
 *
 * 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;
}

/* 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                : #3A4249;
    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;
}

/* 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     : #2D3737;
}

/* *******************************************************************
 *
 * 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                : #3A4249;
    background-color     : #F4F4F4;
}

/* 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     : #F4F4F4;
}

.Titlebar
{
    position             : fixed;
    top                  : 0;
    z-index              : 999;
    width                : 100%;
    height               : 29px;
}

.TitlebarTable
{
    background-color     : #39444F;
    color                : #E4E7EA;
}

/* 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     : #2D3737;
    padding				 : 0px;

}

/* 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
{
    padding-right        : 2px;
    padding-left         : 8px;
    padding-bottom       : 3px;
    padding-top          : 3px;
    line-height          : 17px;
    height               : 30px;

    color                : inherit;
    background-color     : #6E7681;
}

#CommandToolBarDiv
{
    width: 100%;
    height: 30px;
    margin: 3px 0 3px  0;
    padding: 0;
}

/* 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 #F4F4F4;*/
    color                : inherit;
    background-color     : #F4F4F4;
    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                : #3399CC;
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    font-style           : normal;
    font-weight          : normal;
    text-decoration      : underline;
}

/* Specialization of the A:hover class for the Navigator */
.Navigator A:hover
{
    background-color     : inherit;
    color                : #4C67A1;
    font-size            : 12px;
    font-family          : Arial, Sans-Serif, Verdana;
    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 #F4F4F4;
    border-right         : 1px solid #F4F4F4;
    border-left          : 1px solid #F4F4F4;
    background-color     : #F4F4F4;;
    color                : #000000;
    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                : #000000;
    background-color     : #F4F4F4;
    border-top           : 1px solid #F4F4F4;
    border-bottom        : 1px solid #F4F4F4;
}

.TitleCell
{
    font-weight          : bold;
    color                : #000000;
    background-color     : #F4F4F4;
}

/* The row containing the column names */
.ColumnHeaderRow
{
    font-weight          : bold;
    color                : #000000;
    background-color     : #6E7681;
    height               : 20px;
    padding-left         : 4px;
}

.ColumnHeaderCell
{
    font-weight          : bold;
    color                : #000000;
    background-color     : #6E7681;
}

/* A row with information, the main body of the table */
.DataRow
{
    color                : #000000;
    background-color     : #F4F4F4;
}

/* 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                : #000000;
    background-color     : #F4F4F4;
}

/* 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;
}

/* *******************************************************************
 *
 * 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, Sans-Serif, Verdana;
    font-size            : 12px;
    font-weight          : bold;
    font-style           : normal;
    text-decoration      : none;
    color                : #4B4B4B;
    background-color     : #F4F4F4;
    border               : 1px solid #8593C7;
}

/* Every second cell in the grid. When in list mode, this class is not used */
.DocMtxAltCell
{
    padding              : 0 0 0 10px;
    color                : #4B4B4B;
    background-color     : #F4F4F4;
    border-right         : 1px solid #8593C7;
    border-bottom        : 1px solid #8593C7;
}

/* A cell in the grid when the image within has been selected */
.DocMtxSelectedCell
{
    color                : inherit;
    background-color     : #FFFFFF;
    border               : 1px solid #CAD0D6;
}

/* The filename */
.DocMtxFilename
{
    font-family          : Arial, Sans-Serif, Verdana;
    font-size            : 12px;
    font-weight          : bold;
    font-style           : normal;
    text-decoration      : none;
    color                : #4B4B4B;
}

/* 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     : #F4F4F4;
}

/* The cell that holds the thumbnail or preview in the matrix */
.DocMtxPreviewCell, .DocMtxSelectedPreviewCell
{
    color                : inherit;
    background-color     : #FFFFFF;
    border               : 1px solid #CAD0D6;
}selectedThumbnail

/* The cell that holds the thumbnail in the matrix when the file is selected. */
.DocMtxSelectedPreviewCell
{
    border               : 3px solid #CAD0D6;
}

/* 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
{
    cursor:pointer;
}

/* A normal tab (not selected) */
.TabStripNormalTab, .TabStripDisabledTab
{
    color                : #3399CC !important;
}

/* The one (and only) selected tab in the strip */
.TabStripSelectedTab
{
    color                : #000000 !important;
    background-color     : #CAD0D6 !important;
}

/* A disabled (but visible) tab */
.TabStripDisabledTab
{
}

.TabStripNormalTab, .TabStripSelectedTab, .TabStripDisabledTab
{
    border-top           : 1px solid #6E7681;
    border-right         : 1px solid #6E7681;
    border-left          : 1px solid #6E7681;
    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     : #6E7681;
    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     : #6E7681;
    border-top           : 1px solid #6E7681;
    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;
}

/***************************************************************************************************
*
*
* 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;
}

/***************************************************************************************************
*
* The following classes are for the tab strip control.
*
***************************************************************************************************/
.TabStripSelected
{
    color                : #000000;
    background-color     : #CAD0D6;
}

.TabStripUnselected
{
    color                : #3399CC;
    /*background-color     : #2D3737;*/
}

.TabStripSelected, .TabStripUnselected
{
    padding-bottom      : 6px;
    padding-top         : 6px;
    padding-left        : 10px;
    padding-right       : 10px;
    font-weight			: bold;
    border-top          : solid 1px #BFBFBF;
    border-left         : solid 1px #BFBFBF;
    border-right        : solid 1px #BFBFBF;
    cursor              : default;
    margin-right: 1px;
}

.TabStripPane
{
    padding-top         : 5px;
    padding-bottom      : 15px;
    padding-left        : 5px;
    padding-right       : 5px;
    background-color:	#FFFFFF;
    border              : solid 1px #BFBFBF;

}

#_tbstrp
{
    margin:	10px;

}

.tabHeaderLabel
{
}

.tabHeaderLink
{
}

.gridTable
{
    margin-bottom        : 10px;
}

.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                 : 400px;
    width                : 80px;
}

.sgOnlyList input
{
    position             : absolute;
    left                 : 450px;
    width                : 200px;
}
.sgRange .min, .sgRange .max
{
    position             : absolute;
}
.sgRange select
{
    position             : absolute;
    left                 : 400px;
    width                : 80px;
}
.sgRange .min
{
    left                 : 500px;
    width                : 150px;
}
.sgRange .max
{
    left                 : 650px;
    width                : 150px;
}
#archiveSelect select
{
    width                : 250px;
}
#mediaType select
{
    width                : 250px;
}

.firstSearchGroup .matchTypeSelector, .nextSearchGroup .matchTypeSelector
{
    position             : absolute;
    left                 : 400px;
    width                : 150px;
}
.firstSearchGroup .textInput, .nextSearchGroup .textInput
{
    position             : absolute;
    left                 : 555px;
    width                : 180px;
}
.firstSearchGroup .fieldSelector, .nextSearchGroup .fieldSelector
{
    position             : absolute;
    left                 : 740px;
}
#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;

}
*/


/********************************************************************************************************
*
* 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 preview size list control.
*
*/

span.PreviewSizeList
{
    font-weight          : bold;
    padding              : 5px;
}

select.PreviewSizeList
{
}

img.PreviewSizeList
{
}




/********************************************************************************************************
*
* 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;

    

}

/********************************************************************************************************
*
* 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             : 400px;
}

.EmailMessage
{
    width             : 400px;
    height            : 100px;
}

.EmailRecipientSelectionControl
{
}

/*****************************************************************************
*
* The following classes are for the tool bar control.
*
*****************************************************************************/

.CheckedOutFileTab
{
    width               : 500px;
}

/******************************************************************************/
/******************************************************************************/
/* Xenario - overrides */
/******************************************************************************/
/******************************************************************************/

/*body, p, br, nobr, div, span, td, textarea, input, select, option, a
{
    color: #4b4b4b;
    font-family: "Trebuchet MS", Arial;
    font-size: 11px;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;

}
body
{
    background-color: #F4F4F4;
}
*/

body{
    /* preview page creates Problems with min-width: 1100 */
    /*min-width: 1100px; /* left some space for IE scroll bars */

    /* forcing high resolution */
    min-width: 1255px; /* left some space for IE scroll bars */
    /* !jpg! mod resize for 1024px width */JPouterContainer
	min-width: 999px;
}
/* special rules for the image note popup */
body.page-imagenote{
    min-width: 1px;
}
body.page-imagenote #MainFrame{
    padding-top: 15px;
}

body.page-imagenote .TopRow{
    width: 350px;
}

body.page-imagenote .ImageNodeEditField textarea{
    width: 350px;
}

body.loading{
    /*
        Indicates that the program is busy and the user should wait.
        Often rendered as a watch or hourglass.
    */
    cursor: progress;
}

form
{
    margin: 0px;
    padding: 0px;
}
/*
h1, h2, h3, h4, h5, h6
{
    color: #999c9e;
    font-family: "Trebuchet MS", Arial;
}

a, a:link, a:visited
{
    color: #4b4b4b;
    background-color: transparent;
    font-family: "Trebuchet MS", Arial;
}

a:hover
{
    color: #1a9ccd;
    background-color: transparent;
    cursor: pointer;
    font-family: "Trebuchet MS", Arial;
}
*/
a:hover{
    cursor: pointer;
}
/* Nodes with the class "node-tpl" will be hidden nodes in HTML used by
   javascript to add new code dynamically. Therefore logical javascript code is
   separated from nearly all HTML. Additionally the Template-Designer could
   work on the Template further on.
*/
.node-tpl{
    display: none;
}

/* overrides */
.CommandToolbar
{
    border: none;
    height: auto;
    width: auto;
    padding: 0px;
    margin: 0px;
}

.TitlebarTable{
    background-image: url(/fotoweb/rsrc/header_gradient_t.png);
    background-repeat: repeat-x;
    background-position: bottom left;
}

.Titlebar
{
    position: relative;
    height: auto;
    margin-bottom: 15px;
}

a.TitleBarCloseMe:hover,
a.TitleBarLogin:hover,
a.TitleBarLogout:hover,
a.TitleBarCheckout:hover
a.TitleBarOutbox:hover
{
    background-color:transparent;
    text-decoration: underline;
}

a.TitleBarLogin,
a.TitleBarLogout{
    background: transparent url(/fotoweb/rsrc/icon_logout.png) left center no-repeat;
    padding-left: 20px;
    height: 17px;
    line-height: 17px;
    color: #E4E7EA;
    display: inline-block;
}

a.TitleBarCloseMe{
    padding-left: 20px;
    padding-right: 5px;
    height: 17px;
    line-height: 17px;
    display: inline-block;
}

a.TitleBarCheckout{
    background: transparent url(/fotoweb/rsrc/checkout_bu.png) no-repeat scroll 0 0;
    display: inline-block;
    font-size: 1em;
    font-weight: bold;
    height: 26px;
    line-height: 26px;
    padding: 0 5px 0 30px;
    text-align: left;
    width: 90px;
    color: #ddd;
}

a.TitleBarCheckout:hover{
    background-position: 0 -28px;
    color: #eee;
    text-decoration: none;
}
a.TitleBarOutbox{
    background: transparent url(/fotoweb/rsrc/outbox_bu.png) no-repeat scroll 0 0;
    display: inline-block;
    font-size: 1em;
    font-weight: bold;
    height: 26px;
    line-height: 26px;
    padding: 0 5px 0 30px;
    text-align: left;
    width: 90px;
    color: #ddd;
}
a.TitleBarOutbox:hover{
    background-position: 0 -28px;
    color: #eee;
    text-decoration: none;
}

.TitleBarActions{
    float: right;
    padding-right: 20px;
}

#Logo
{
    /*background: url(/fotoweb/cmdrequest/GetAppearanceLogoMain.fwx) no-repeat;*/
    /*background: url(/fotoweb/rsrc/fotoware_logo.png) no-repeat;*/
    margin: 15px;
    /*
        height: 27px;
        width: 137px;*/
}

.Toolbar
{
    background: url(/fotoweb/rsrc/bar_gradient.png) top repeat-x;
    height: 50px;
    padding: 5px;
    position: relative;
}

.CommandToolbar{
	/* background-color: purple; */

    height: 36px;
}

#CommandToolBarDiv
{
	/* background-color: gray; */ 
    float: left;
    margin: 0 0 0 8px;
    padding: 0px;
    width: auto;
    position: relative;
    z-index: 100;
}

.KeywordsAndExtSearch a{
    line-height:12px;
    color: #E4E7EA;
}

.SearchFieldContainer,
.KeywordsAndExtSearch
{
    float: left;
}

.KeywordsAndExtSearch
{
	/* background-color: red; */

	padding-left: 10px;
}

.TopMenuContainer{
/*
	background-color: cyan;

	
*/
    position:absolute;
    top:5px;
	left:352px;
	width:auto;
	right:0px;
	padding:0px 260px 0px 0px;
	margin: 0;
	}

.TopMenuTableContainer {
/* 

	background-color: red;
	width:auto; 
	width:800px;

*/

	min-width: 650px;
	
}	

/*	
.TopMenuContainer a.homeButton {
	text-decoration: none;	
}
*/

/* we need a table for browsers, who don't care about 'display="table"' */
.TopMenuContainer table{
	margin: 0 auto;
	/* 
	padding:0;
	float:left; 
	*/
}

.TopMenuContainer .TopMenu 
{
    margin:0;
    padding:0;
    position:relative;
    z-index:10;
    float: left;
}

.TopMenuContainer .TopMenu li,
.TopMenuContainer .TopMenu li a
{
    background-color: transparent;
    cursor: pointer;
    color: #000000;
    z-index: 500;
    display: block;
    font-size: 12px;
}

/* !jpg! highlight menu elements when tabbing (added/removed onfocus/blur in JS) */
.TopMenuContainer .TopMenu li .menuButtonTabHighlight,
.TopMenuContainer .TopMenu li a.menuTabHighlight {
    background-color: #CAD0D6;
    color: #000000;
}

.TopMenuContainer .TopMenu li a
{
    padding:4px 4px 0 10px;
}

.TopMenuContainer .TopMenu li > ul li:first-child
{
    background: transparent url(/fotoweb/images/topNaviBg_t_.png) no-repeat top center;
    padding-top: 11px;
    width: 188px;
    /* !jpg! shrunk top menus */
	width: 140px;
}

.TopMenuContainer .TopMenu li > ul li span
{
    display: block;
    background: transparent url(/fotoweb/images/topNaviBg_c_.png) repeat-y;
    padding: 1px 7px;
    width: 174px;
    /* !jpg! shrunk top menus */
	width: 126px;
}

.TopMenuContainer .TopMenu li > ul{
    background: transparent url(/fotoweb/images/topNaviBg_b_.png) no-repeat bottom center;
    padding-bottom: 11px;
    width: 188px; /* for an ie graphic bug*/
    /* !jpg! shrunk top menus */
	width: 140px;
    left: 95%;
}
.TopMenuContainer .TopMenu > li > ul,
.multilvl-menu .scroller{
    top: 75% !important;
    left: -5px !important;
}

.TopMenuContainer .TopMenu li > ul > li + li a
{
    background: url(/fotoweb/rsrc/separator.gif) top center repeat-x;
}

.TopMenuContainer .TopMenu li a:hover
{
    background-color: #1A9CCD;
    background-color: #CAD0D6;
    text-decoration: none;
    color: #000000;
}

.TopMenuContainer .TopMenu .TopMenu-Header
{
    background:transparent url(/fotoweb/images/top_button.png) no-repeat scroll 0 0;
    font-size:14px;
    font-weight:bold;
    height:26px;
    line-height:23px;
    margin:0 2px;
    padding:0;
    width:144px;
    /* !jpg! shrunk top menus */
	width: 132px;
    list-style-image:none;
    list-style-position:outside;
    list-style-type:none;
}
/* !jpg! changed archiveMenu width */
.TopMenuContainer .TopMenu #ArchiveMenu
{
    background:transparent url(/fotoweb/images/archiveMenu_top_button.png) no-repeat scroll 0 0;
    width:168px;
}

/* !jpg! changed homemenu width */
.TopMenuContainer .TopMenu #HomeMenu
{
    background:transparent url(/fotoweb/images/homeMenu_top_button.png) no-repeat scroll 0 0;
    width:65px;
}

.TopMenuContainer .TopMenu .hover
{
    background-position: 0 -30px;
}

.TopMenuContainer .TopMenu-Header-Label
{
    color:#ECEAEB;
    display:inline-block;
    font-weight:bold;
    height:26px;
    line-height:26px;
    margin-left:6px;
    padding-left:20px;
}

.TopMenu .isCurrent{
    font-weight: bold;
}

/*
.multilvl-menu ul, 
.scroller {
	display: block;
}
*/

.multilvl-menu .scroller{
	background: transparent url(/fotoweb/rsrc/topNaviBg_t.png) no-repeat scroll 0 0; 
	/* increased archiveMenu width */
	background: transparent url(/fotoweb/images/topNaviBg_t.png) no-repeat scroll 0 0;
    padding: 11px 0px;
}

.multilvl-menu .scroller .scrollContainer {
    background-color:cyan;
	height:299px;
    width: 144px;
	/* increased archiveMenu width */
    width: 164px;
	background: transparent url(/fotoweb/rsrc/topNaviBg_c.png) repeat-y scroll 0 0;
	/* increased archiveMenu width */
    background: transparent url(/fotoweb/images/topNaviBg_c.png) repeat-y scroll 0 0;
    padding: 0 7px;
    overflow: hidden;
    position: relative;
	margin:0;
}

.multilvl-menu .scroller .bottom{
	background: transparent url(/fotoweb/rsrc/topNaviBg_b.png) no-repeat scroll 0 0;
	/* increased archiveMenu width */
    background: transparent url(/fotoweb/images/topNaviBg_b.png) no-repeat scroll 0 0;
    position: absolute;
    bottom: 0px;
    height: 11px;
    width: 100%;
}

.multilvl-menu .scroller li{
	width: 144px;
	/* increased archiveMenu width */
	width: 164px;
}

.multilvl-menu .scroller li a{
    background: transparent url(/fotoweb/rsrc/separator.gif) repeat-x scroll 50% 100%;
    padding: 4px 4px 3px 10px;
}

.multilvl-menu .scroller li{
    background: transparent url(/fotoweb/rsrc/separator.gif) repeat-x scroll 50% 0;
}
.multilvl-menu .scroller li + li{
    background: none;
}

.multilvl-menu .scroller .scrollUp,
.multilvl-menu .scroller .scrollDown{
    width: 158px;
	/* increased archiveMenu width */
    width: 178px;
    height: 16px;
}

.multilvl-menu .scroller .scrollUp{
    background: transparent url(/fotoweb/rsrc/topNaviBg_c.png) repeat-y scroll 0 0;
	/* increased archiveMenu width */
    background: transparent url(/fotoweb/images/topNaviBg_c.png) repeat-y scroll 0 0;
}

.multilvl-menu .scroller .scrollDown{
    background: transparent url(/fotoweb/rsrc/topNaviBg_c.png) repeat-y scroll 0 0;
	/* increased archiveMenu width */
    background: transparent url(/fotoweb/images/topNaviBg_c.png) repeat-y scroll 0 0;
}

.multilvl-menu .scroller .scrollUp span,
.multilvl-menu .scroller .scrollDown span{
    position: relative;
    padding: 0px;
    margin: 0 0 0 45px;
    width: auto;
    display: block;
    height: 16px;
    line-height: 16px;
    text-indent: -9999px;
}

.multilvl-menu .scroller .scrollUp span{
    background: transparent url(/fotoweb/rsrc/up_arrow.png) no-repeat 36px 0;
}

.multilvl-menu .scroller .scrollDown span{
    background: transparent url(/fotoweb/rsrc/down_arrow.png) no-repeat 36px 0;
}

.multilvl-menu .scroller .scrollUp:hover span,
.multilvl-menu .scroller .scrollDown:hover span{
    background-position: 36px -16px;
}

.multilvl-menu .scroller .goRight span,
.multilvl-menu .scroller .goBack span{
	/* background-color: cyan; */
    display: none;
}

.multilvl-menu .scroller .goRight,
.multilvl-menu .scroller .goBack{
    position: absolute;
    background: transparent;
    width: 37px;
}
.multilvl-menu .scroller .goRight{
    background:transparent url(/fotoweb/images/right_arrow.png) no-repeat scroll -26px 50%;
    /* !jpg! added grey (#EDEDED) bgd to isolate button */
	background: #EDEDED url(/fotoweb/images/right_arrow.png) no-repeat scroll -26px 50%;
    border-left:1px solid #BABABA;
    border-bottom:1px solid #BABABA;
    border-top:1px solid #BABABA;
    height:27px;
    width: 30px;
	right:0px;
    top:-2px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 3px 0px;
}
.multilvl-menu .scroller .goRight:hover{
    background-position: 6px 50%;
}
.multilvl-menu .scroller .goBack:hover{
    background-position: -19px 3px;
}

.multilvl-menu .scroller .goBack{
    height: 20px;
    top:7px;
    left:6px;
    border-right: 1px solid #BABABA;
	background: url(/fotoweb/images/left_arrow.png) no-repeat 13px 3px;
}

/* !jpg! */
.TopMenu .Home{
    background: url(/fotoweb/rsrc/icon_archive.png) no-repeat left;
}

.TopMenu .Archives{
    background: url(/fotoweb/rsrc/icon_archive.png) no-repeat left;
}

.TopMenu .Views{
    background: url(/fotoweb/rsrc/icon_view.png) no-repeat left;
}

.TopMenu .Tools{
    background: url(/fotoweb/rsrc/icon_tool.png) no-repeat left;
}

.TopMenu .Administration{
    background: url(/fotoweb/rsrc/icon_config.png) no-repeat left;
}

#KeywordCloud .popdiv-content div{
    padding: 10px;
    text-align: justify;
}

#KeywordsPopUpTrigger{
    display: none;
}

#searchInputField
{
    border: none;
    margin: 0px;
    padding: 0;
    width: 185px;
    height: 15px;
    padding: 4px 5px 6px 6px;
    position: relative;
    float: left;
    font-family: "Trebuchet MS";
    font-size: 13px;
    color: #333333;
}

.searchInputField_Inactive
{
    background: url(/fotoweb/rsrc/searchInput_bg_i.png) no-repeat;
}

.searchInputField_Active
{
    background: url(/fotoweb/rsrc/searchInput_bg_a.png) no-repeat;
}

#SearchSubmit
{
    float: left;
    background: url(/fotoweb/rsrc/searchButton_bg.gif) no-repeat;
    border: none;
    margin: 0;
    padding: 0;
    font-size: 11px;
    font-family: "Trebuchet MS";
    font-weight: bold;
    width: 34px;
    height: 24px;
    color: #e2e2e2;
}

.SearchFieldContainer
{
    position: relative;
}

#SearchPopUp
{
    background: url(/fotoweb/rsrc/searchPanel_bg.png) no-repeat;
    width: 178px;
    height: 101px;
    display: none;
    position: absolute;
    padding: 15px;
    z-index: 500;
    left: 0px;
    top: 100%;
}

#SearchPopUp .OverallAndResults > div
{
    width: 65px; /* for dipshit IE7 */
}

#SearchPopUp .OverallAndResults
{
    overflow: hidden;
    margin: 5px 0 10px 0;
    padding-bottom: 10px;
    background: url(/fotoweb/rsrc/fp_seperator.gif) repeat-x bottom;
}

#SearchPopUp .OverallAndResults label
{
    float: left;
    line-height: 18px;
}

#SearchPopUp .OverallAndResults div
{
    float: left;
    margin-left: 10px;
}

#SearchPopUp .Type
{
    clear: both;
}

#SearchPopUp .Type label
{
    float: left;
    width: 50px;
}
#SearchPopUp .Date
{
    clear: both;
}
#SearchPopUp .Date label
{
    float: left;
    width: 55px;
}

#SearchPopUp .Type select,
#SearchPopUp .Date select
{
    padding: 1px;
    width: 120px;
    font-size: 11px;
}

#MainFrame
{
    padding: 0;
    margin: 0 12px 15px;
	/* !jpg! make previewinfo wrap for 1024px width browsers (but not for 1280px) */
	    min-width: 989px;
		overflow: auto;
	
}

/* common grid class*/
.Grid{
    clear: none;
}

#MainFrameOpacityLayer
{
    /*
    display: none;
    background-color: #000;
    position:absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 5000;
    */
}

.TopRow
{
    padding-right: 7px;
    position: relative;
    margin-bottom: 5px;
    z-index: 5;
}

.TopRow .content h1, /* FIXME: backward compatibility for inaccessable resources provided by cmdrequest */
.TopRow .TopRow-Content h1{
    float: left;
    margin: 0 10px 0 12px;
    font-size: 14px;
    font-weight: bold;
    padding: 0 0 0 12px;
    margin: 0px;
    overflow: hidden;
    white-space: nowrap;
    width: 40%;
}

.TopRow .content, /* FIXME: backward compatibility for inaccessable resources provided by cmdrequest */
.TopRow .TopRow-Content
{
    background:transparent url(/fotoweb/rsrc/grid_headnavi_bg.png) no-repeat scroll 0 0;
    height:33px;
    line-height:33px;
    position:relative;
    z-index:10;
    padding: 3px 0 3px 7px;
}

/* will be used for the bar closer */
.TopRow .extra1{
    background:transparent url(/fotoweb/rsrc/grid_headnavi_end_bg.png) no-repeat scroll 100% 0;
    height:39px;
    left:auto;
    position:absolute;
    right:0;
    top:0;
    width:7px;
}

.TopRowSub{
    clear: both;
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 20px;
    margin-left:12px;
}

/* TopRowDropDown */

.TopRowDropDownContainer
{
    position: relative;
    float: left;
}

.TopRowDropDownContainer
{
    margin-right: 40px
}

.TopRowDropDown
{
    background:transparent url(/fotoweb/rsrc/layoutPanel_bg.png) no-repeat scroll 0 0;
    display:none;
    height:192px;
    position:absolute;
    right:-1px;
    top:29px;
    width:228px;
    z-index:10;
}

.TopRowDropDown-Content{
    padding: 15px;
}

.TopRowDropDownButton
{
    background:transparent url(/fotoweb/rsrc/general_bu.png) no-repeat scroll 0 0;
    border:medium none;
    color:#FFFFFF;
    cursor:pointer;
    display:block;
    height:26px;
    line-height:27px;
    margin:0 auto;
    overflow:hidden;
    width:100px;
}
.TopRowDropDownButton span{
    background:transparent url(/fotoweb/rsrc/icon_disk.png) no-repeat scroll 0 50%;
    display:inline-block;
    line-height:25px;
    margin:0 0 0 9px;
    padding-left:20px;
    width:60px;
}

.TopRowDropDown-Content input{
    margin-left:35px;
}

.TopRowDropDown .Actions{
    background: transparent url(/fotoweb/rsrc/separator.gif) repeat-x 0 0;
    margin-top: 8px;
    padding-top: 15px;
    clear: both;
}


.labeledLeft span
{
    display:block;
    float:left;
    padding:0 4px 0 4px;
    text-align:right;
    width:100px;
}

.labeledRight span
{
    display:block;
    float:right;
    padding:0 4px 0 4px;
    text-align:left;
    width:100px;
}

.downloadpopup-images{
    height: 220px;
    overflow: auto;
    position: relative;
}
.downloadpopup-image-container{
    float: left;
    margin: 14px;
    height: 82px;
    width: 82px;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.downloadpopup-image-wrapper{
    position: absolute;
    width: 100%;
    bottom: 0px;
    left: 0px;
}

.downloadpopup-profile-container{
    margin-top: 10px;
    border-top: 1px solid #c6c6c6;
    clear: both;
    padding:11px 1px;
    overflow: hidden;
}

a.downloadpopup-profile{
    display: block;
    float: left;
    width: 215px;
    height: 38px;
    background: url(/fotoweb/rsrc/download_profile_bg.png) 0 0 transparent no-repeat;
    line-height: 38px;
    padding-left: 20px;
    padding-right: 35px;
    font-size: 12pt;
    font-weight: bold;
    color: #fff;
    overflow: hidden;
    margin: 2px;
}
a.downloadpopup-profile:hover,
/* !jpg! accessibility onfocus */
a.downloadpopup-profileHilite{
    background-position: 0 -38px;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    font-size: 12pt;
}

.single .downloadpopup-image-container{
    float: none;
    margin: 0px auto;
    height: 240px;
    width: 220px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.downloadpopup-images.single {
    height: auto;
    overflow: hidden;
}

.DownloadPopUp .content-container{
    width: 560px;
}
.KeywordCloudPopUp .content-container{
    width: 400px;
}

.KeywordCloudPopUp .content{
    text-align: justify;
}

.PreviewSizePopUp{
}

.AlbumCreateControl{
    display: table;
    margin: 0 auto;
}

.AlbumCreateControl .AlbumNameEdit,
.AlbumCreateControl .AlbumDescriptionEdit{
    width: 200px;
}

/*
* Column classes
*/

.Column{
    /* standard column will float left */
    float:left;
    /* possibly rules for all columns */
}
.right{
    float:right;
}
.left{
    float:left;
}
.SmallCol{
    width: 150px;
}
.MediumCol{
    width: 250px;
}
.BigCol{
    width: 350px;
}

#PreviewFrame, /* for backward compatibility to cmdrequest templates */
.rightOf{
    padding-left: 10px;
    overflow: hidden;
}

.leftOf{
    padding-right: 10px;
    overflow: hidden;
}

/* NavigationPaneControl (start)*/
#NavigationPaneControl
{
    clear: both;
    width: 233px;
    float: left;
}

#NavigationPaneControl .InnerContainer
{
    /* backward compatibillity */
    background: url(/fotoweb/rsrc/navigationPanel_bg.png) no-repeat bottom center;
    position: relative;
    display: none;
    padding: 5px 10px;
    max-height: 700px;
	/* !jpg! */
	max-height: 400px;
    overflow: auto;
}

#NavigationPaneControl .Container{
    background: url(/fotoweb/rsrc/navigationPanel_bg.png) no-repeat bottom center;
}

/* backward compatibillity */
#NavigationPaneControl .Container .InnerContainer{
    background: none;
}

#NavigationPaneControl .PanelHeader
{
    display: block;
    background: url(/fotoweb/rsrc/naviPane_bu_i.png) no-repeat;
    color: #e2e2e2;
    margin: 0;
    padding: 0;
    height: 34px;
    line-height: 34px;
    padding:0 30px 0 12px;
    cursor: pointer;
    font-size: 12px;
    font-weight:bold;
    text-decoration: none;
    position: relative;
}

#NavigationPaneControl a.PanelHeader:hover
{
    background: url(/fotoweb/rsrc/naviPane_bu_o.png) no-repeat;
    color: #FFF;
}

#NavigationPaneControl .DisabledPanel .PanelHeader {
    color: #e2e2e2;
    cursor: default;
}
#NavigationPaneControl .DisabledPanel .PanelHeader:hover {
    background: url(/fotoweb/rsrc/naviPane_bu_i.png) no-repeat;
    color: #e2e2e2;
}

#NavigationPaneControl .OpenedPanel .PanelHeader,
#NavigationPaneControl .OpenedPanel .PanelHeader:hover
{
    background: url(/fotoweb/rsrc/naviPane_bu_a.png) no-repeat;
    color: #FFF;
}

#NavigationPaneControl .Actions .InnerContainer{
    overflow: visible; /* accomplishing the overlapping submenus */
    z-index: 10;
    padding: 5px 3px;
}

#NavigationPaneControl .Actions .InnerContainer li{
    background: transparent;
    width: auto;
    height: 22px;
}

#NavigationPaneControl .Actions .InnerContainer a
{
    display: block;
    padding-left: 25px;
    padding-right: 25px;
    height: 22px;
    line-height: 22px;
    margin: 0px 0px;
    text-decoration: none;
    background-repeat: no-repeat;
    background-position: 5px 50%;
    position: relative;
}

#NavigationPaneControl .Actions .InnerContainer a:hover,
/* !jpg! accessibility */
#NavigationPaneControl .Actions .InnerContainer a.hilite
{
    background-color: #DADADA;
}

#NavigationPaneControl .Actions .InnerContainer .submenu-indicator{
    background:transparent url(/fotoweb/rsrc/icon_arrow.png) no-repeat scroll 0 0;
    height:16px;
    position:absolute;
    right:5px;
    top:3px;
    width:16px;
    display: none;
}

#NavigationPaneControl .Actions .InnerContainer .submenu-indicator.active{
    display: block;
}

#NavigationPaneControl .Actions .InnerContainer .hover .submenu-indicator{
    background-image: url(/fotoweb/rsrc/icon_arrow_o.png);
}

#NavigationPaneControl .ActionsList.multilvl-menu ul li a
{
    margin: 0px;
    text-decoration: none;
}

#NavigationPaneControl .ActionsList.multilvl-menu li > ul
{
    background:transparent url(/fotoweb/rsrc/topNaviBg_b.png) no-repeat scroll bottom center;
    padding-bottom:11px;
    left: 98%;
    top: -10px;
    width:158px;
/* !jpg! increased width of actions menu drop-downs */
    background:transparent url(/fotoweb/images/Actions_topNaviBg_b.png) no-repeat scroll bottom center;
    width:285px;
}

#NavigationPaneControl .ActionsList.multilvl-menu li > ul li:first-child
{
    background:transparent url(/fotoweb/rsrc/topNaviBg_t.png) no-repeat scroll top center;
    padding-top:11px;
    width:158px;
/* !jpg! increased width of actions menu drop-downs */
    background:transparent url(/fotoweb/images/Actions_topNaviBg_t.png) no-repeat scroll top center;
    width:285px;
}

#NavigationPaneControl .ActionsList.multilvl-menu li > ul span
{
    background:transparent url(/fotoweb/rsrc/topNaviBg_c.png) repeat-y scroll 0 0;
    display:block;
    padding:0px 7px;
    width:158px;
/* !jpg! increased width of actions menu drop-downs */
    background:transparent url(/fotoweb/images/Actions_topNaviBg_c.png) repeat-y scroll 0 0;
    width:271px;
}

#NavigationPaneControl .MenuSeperator
{
    background: transparent url(/fotoweb/rsrc/seperator.gif) repeat-x 0 50%;
    height: 100%;
    width: auto;
    margin: 0px 4px;
}

#NavigationPaneControl .Actions .rating
{
    text-indent: -9999px;
}

#NavigationPaneControl .SelectionItem
{
    margin: 0 4px 10px 0;
    float: left;
    height: 76px;
    width: 63px;
    position: relative;
}

#NavigationPaneControl .SelectionItem.loading
{
    background: url(/fotoweb/rsrc/load_selection-item.gif) no-repeat 50% 30% transparent;
}

#NavigationPaneControl .SelectionItem img
{
    height: 63px;
    width: 63px;
    border: none;
    margin: 0;
    padding: 0;
}

#NavigationPaneControl .SelectionItemRemove
{
    background:transparent url(/fotoweb/rsrc/selection_bu.gif) no-repeat scroll 0 0;
    bottom:0;
    color:#FFFFFF;
    cursor:pointer;
    font-size:9px;
    font-weight:normal;
    height:13px;
    left:0;
    line-height:13px;
    padding-left:15px;
    position:absolute;
    width:48px;
}

.NaviDragger{
    background:transparent url(/fotoweb/rsrc/dragger.gif) no-repeat scroll 0 0;
    float:left;
    height:34px;
    position:relative;
    top:1px;
    width:10px;
    z-index: 400;
    cursor: pointer;
}

.NaviDragger-wrap{
    position: absolute;
    left: 200px;
    width: 30%;
}

#btnClearSelection{
    background: transparent url(/fotoweb/rsrc/icon_clearSelection.png) no-repeat 0 0;
    height: 16px;
    width: 16px;
    position: absolute;
    right:8px;
    top:8px;
}
/* NavigationPaneControl (end)*/

/* ThumbContainer styles (start) */

.DocMtxCell,
.DocMtxSelectedCell
{
    border: none;
    padding: 0;
    margin: 0;
    background: none;
}

.DocMtxSelectedCell .ThumbContainer,
body.page-shoppingcart .ThumbContainer
{
    /*background: #FEFEFE;*/
    background: #FFFFFF;
    border: 1px solid #CAD0D6;
}

.ThumbContainer{
    float: left;
    display: block;
    font-size: 10px;
    position: relative;
    /*
    border: 1px solid gray;
    */
    margin:10px 10px 25px 20px;
    width: 170px;
    padding: 2px;
    background-color: #F4F4F4;
    border: 1px solid #F4F4F4;
}

/*#1A9CCD;*/
.hover .ThumbContainer{
    border: 1px solid #4C67A1;
    background-color: #FFFFFF;
}

body.page-shoppingcart .ImageContainer{
    width: 100%;
    overflow: hidden;
}

/* disabling hover effect for the shopping cart */
body.page-shoppingcart .hover .ThumbContainer{
    background: #FFFFFF;
    border: 1px solid #CAD0D6;
}

body.page-shoppingcart .ObjectName{
    font-weight: bold;
}
body.page-shoppingcart .ObjectName,
body.page-shoppingcart .Description{
    margin-bottom: 20px;
}
body.page-shoppingcart .Source,
body.page-shoppingcart .Credit{
    display: inline;
}

body.page-shoppingcart .Source span,
body.page-shoppingcart .Credit span{
    font-weight: bold;
}

body.page-shoppingcart .Source label,
body.page-shoppingcart .Credit label{
    display: inline-block;
    text-align:right;
}

body.page-shoppingcart .Credit label{
    margin-left: 100px;
}

body.page-shoppingcart .ProcessingInfos{
    position:absolute;
    right:0;
    top:20px;
    border-left: 1px dotted #c1c1c1;
    height: 100%;
    padding-left: 5px;
}

body.page-shoppingcart .ProfileSelect{
    margin: 0 0 10px;
    padding:0 0 10px 10px;
    border-bottom: 1px dotted #c1c1c1;
}
body.page-shoppingcart .ProfileSelect label{
    display: block;
    padding-left: 20px;
    height: 20px;
    background: transparent url(/fotoweb/rsrc/icon_disk.png) no-repeat 0 0;
    line-height:18px;
}
body.page-shoppingcart .Remove{
    padding:0 0 10px 10px;
}
body.page-shoppingcart .Remove a{
    display: block;
    padding-left: 20px;
    height: 20px;
    background: transparent url(/fotoweb/rsrc/icon_bin.png) no-repeat 0 0;
}

body.page-shoppingcart .ShoppingCartInfos {
    height:280px;
    overflow:hidden;
    padding:20px 190px 10px 10px;
    position:relative;
    max-width:460px;
    min-width:280px;
}

body.page-shoppingcart .ThumbContainer .Actions{
    display: none;
}
/**** Priority Color codes (start) ****/
.Priority.Prio0{
    background-color: transparent;
    border-color: transparent;
}
.Priority.Prio1{
    background-color: #C5A8C3;
    border-color: transparent;
}
.Priority.Prio2{
    background-color: #DD7B8F;
    border-color: transparent;
}
.Priority.Prio3{
    background-color: #F4C33E;
    border-color: transparent;
}
.Priority.Prio4{
    background-color: #F8F99F;
    border-color: transparent;
}
.Priority.Prio5{
    background-color: #3BA37E;
    border-color: transparent;
}
.Priority.Prio6{
    background-color: #58B4D1;
    border-color: transparent;
}
.Priority.Prio7{
    background-color: #0082B2;
    border-color: transparent;
}
.Priority.Prio8{
    background-color: #005494;
    border-color: transparent;
}
/**** Priority Color codes (end) ****/

.ThumbContainer .Thumb{
    clear: both;
    width: 170px;
    height: 170px;
    position: relative;
}
.ThumbContainer .Thumb .InnerThumb{
    text-align: center;
    position: absolute;
    bottom: 0px;
    width: 100%; /* 'inheriting' the width from the parent */
}

.ThumbContainer .Thumb .InnerThumb img{
    margin: 0px;
    padding: 0px;
    border-style: none;
    border-width: 0;
    vertical-align: bottom; /* IE7 fix */
}

.ThumbContainer .Priority{
    display: block;
    margin-bottom: 2px;
    line-height:2px;
    cursor:pointer;
    display:block;
    line-height:5px;
    height: 5px;
    margin-bottom:2px;
    border-width: 1px;
    border-style: dotted;
}

.ThumbContainer .PrioSelector{
    position: absolute;
    top: 10px;
    left: 0px;
    left: 50%;
    line-height: normal;
    z-index:100;
    margin-left: -79px;
}

.ThumbContainer .PrioSelector ul{
    list-style-image:none;
    list-style-type:none;
    padding:0;
    margin: 0;
    background:transparent url(/fotoweb/rsrc/topNaviBg_b.png) no-repeat scroll bottom center;
    padding-bottom:11px;
}

.ThumbContainer .PrioSelector ul > li:first-child{
    background:transparent url(/fotoweb/rsrc/topNaviBg_t_stretched.png) no-repeat scroll 50% 0;
    padding-top:11px;
}

.ThumbContainer .PrioSelector ul li{
    background:transparent url(/fotoweb/rsrc/topNaviBg_c.png) repeat-y scroll 0 0;
    padding:2px 10px;
    width:138px;
    margin: 0px;
}

.ThumbContainer .PrioSelector a{
    display: block;
    padding-left: 25px;
    padding-right: 5px;
    background-position: 0 50%;
    background-repeat: no-repeat;
}

.ThumbContainer .PrioSelector a:hover{
    background-color: #C8C8C8;
}

.ThumbContainer .StatusRow{
    height: 17px;
}

.ThumbContainer .Actions{
    border-color:#B1B1B1;
    border-style:dotted;
    border-width:1px 0;
    margin:5px 0 4px;
    overflow:hidden;
    padding:3px 0;
    text-align:center;
}

.ThumbContainer .Actions span{
    padding: 0;
    cursor: pointer;
}

.ThumbContainer .Actions .Selection,
.ThumbContainer .Actions .Download,
.ThumbContainer .Actions .FindSimilar ,
.ThumbContainer .Actions .CMSExport ,
.ThumbContainer .Actions .Zoom,
.ThumbContainer .Actions .CompingWindow
{
    display:inline-block;
    height:16px;
    margin:0 0.3em;
    width:16px;
    line-height: 1px;
    font-size: 1px;
}

.ThumbContainer .Actions .Selection
{
    background: url(/fotoweb/rsrc/icon_lightbox.png) no-repeat;
}
.ThumbContainer .Actions .Download
{
    background: url(/fotoweb/rsrc/icon_disk_mirrored.png) no-repeat;
}
.ThumbContainer .Actions .FindSimilar
{
    /* // TODO: has to be re-implemented after techdays */
    display: none;
    background: url(/fotoweb/rsrc/icon_similar.png) no-repeat;
}
.ThumbContainer .Actions .CMSExport
{
    background: url(/fotoweb/rsrc/icon_export_to_cms_dual.png) no-repeat;
}

.ThumbContainer .Actions .Zoom,
.ThumbContainer .Actions .CompingWindow
{
    background: url(/fotoweb/rsrc/icon_zoom.png) no-repeat;
}

.ThumbContainer .Actions span:hover{
    background-position: 0 -16px;
}

.ThumbContainer .Rating{
    clear:both;
    margin:0 auto;
    overflow:hidden;
    width:72px;
    visibility: hidden; /* at first don't show it to prevent seeing the radio buttons */
}
.ThumbContainer .Name{
    font-weight: bold;
    font-size: 11px;
    text-align: center;
    overflow:hidden;
    white-space:nowrap;
}
.ThumbContainer .Info {
    font-size:10px;
    margin:0 auto;
    width:170px;
}
.ThumbContainer .Info label{
    display:inline-block;
    font-size:10px;
    padding-right:2px;
    text-align:right;
    width:80px;
}

.ThumbContainer .Info span{
    font-size:10px;
    color: #3A4249;
}

body.page-shoppingcart .SelectableImage{
    clear: none;
}

/* ThumbContainer styles (end) */

/* jQuery.Rating Plugin CSS - http://www.fyneworks.com/jquery/star-rating/ */

div.rating-cancel,
div.star-rating {
    float: left;
    width: 12px;
    height: 16px;
    text-indent: -999em;
    cursor: pointer;
    display: block;
    background: transparent;
    overflow: hidden
}

div.rating-cancel,div.rating-cancel a {
    background: url(/fotoweb/rsrc/delete.png) no-repeat 0 -16px;
}

div.star-rating,div.star-rating a {
    background: url(/fotoweb/rsrc/star.png) no-repeat 0 0px
}

div.rating-cancel a,div.star-rating a {
    display: block;
    width: 12px;
    height: 100%;
    background-position: 0 0;
    border: 0
}

div.star-rating-on a {
    background-position: 0 -16px!important
}

div.star-rating-hover a {
    background-position: 0 -32px
}

/* Read Only CSS */

div.star-rating-readonly a {
    cursor: default !important
}

/* Partial Star CSS */

div.star-rating {
    background: transparent!important;
    overflow: hidden!important
}

/* END jQuery.Rating Plugin CSS */


/* Page Navigation (start) */
#pageNavigation
{
    text-align: center;
    margin-top: 5px;
/*    
    clear: both;
	margin-left: 40%;
*/
}

#pageNavigation a
{
    text-decoration: none;
    display: block;
    height: 23px;

    line-height: 26px;
}

#pageNavigation a
{
    background: url(/fotoweb/rsrc/paging_sep.jpg) no-repeat right center;
}

#pageNavigation .PagerElement
{
    float: left;
    padding: 3px 0px 3px 0px;
}

#pageNavigation .PagerPrevious,
#pageNavigation .PagerNext
{
    padding: 0;
}

#pageNavigation .PagerPrevious a
{
    background: url(/fotoweb/rsrc/paging_bu_left_i.gif) no-repeat;
    width: 29px;
    height: 29px;
}

#pageNavigation .PagerPrevious a:hover,
#pageNavigation .PagerPrevious a:active
{
    background: url(/fotoweb/rsrc/paging_bu_left_a.gif) no-repeat;
}

#pageNavigation .PagerNext a
{
    background: url(/fotoweb/rsrc/paging_bu_right_i.gif) no-repeat;
    width: 29px;
    height: 29px;
}

#pageNavigation .PagerNext a:hover,
#pageNavigation .PagerNext a:active
{
    background: url(/fotoweb/rsrc/paging_bu_right_a.gif) no-repeat;
}

#pageNavigation .PagerNum,
#pageNavigation .PagerFirst,
#pageNavigation .PagerLast
{
    background: url(/fotoweb/rsrc/paging_bg.jpg) repeat-x;
    width: 35px;
}

#pageNavigation .CurrentPage a
{
    background-color: #1A9CCD;
    color: #ffffff;
}
/* Page Navigation (end) */

body.page-upload .UploadButton{
    background: transparent url(/fotoweb/rsrc/upload_bg.png) no-repeat 0 0;
    width: 233px;
    height: 39px;
    position: relative;
    cursor: pointer;
}

body.page-upload .UploadButton span {
    color:#FFFFFF;
    display:block;
    font-size:12px;
    font-weight:bold;
    height:1.1em;
    left:10px;
    overflow:hidden;
    position:absolute;
    top:12px;
    width:145px;
}

/* album view (start) */
.page-viewalbum .TopRow .TopRow-Content > div {
    margin: 0 10px 0 0;
    line-height: 40px;
}
/* album view (end) */

/* Status Pages like Password change or Fotoweb Desktop */

#statusBox {
    text-align:            left;
    position:              relative;
    margin: 			   0 auto;
    display:               block;
    top:                   40px;
    width:                 45%;
    min-width:             450px;
    border:                1px solid #BFBFBF;
    background-color:      #FFFFFF;
    padding:               30px 30px 30px 90px;
}

#statusBox .infoIcon {
    position: 				absolute;
    top: 					30px;
    left:					30px;
}

#statusBox h1 {
    font-size: 18px;
    margin: 0;
}

#statusBox p, #statusBox table td {
    font-size: 13px;
    line-height: 1.6;
}

#statusBox table {
    border-top: 1px dotted #BFBFBF;
    padding: 10px 0 0 0;
    width: 100%;
}

#statusBox table td {
    padding: 0 10px 10px 0;
}

#statusBox table td.label {
    width: 40%;
}

#statusBox table td.input {
    width: 60%;
}

#statusBox .link {
    background: transparent url(/fotoweb/rsrc/fw_arrow.png) 0 0 no-repeat;
    padding: 2px 0 5px 20px;
}

#statusBox ul {
    margin: 0;
    padding: 0;
}

#statusBox li {
    list-style-type: none;
    background: transparent url(/fotoweb/rsrc/fw_arrow.png) 0 0 no-repeat;
    padding: 2px 0 5px 20px;
}

#statusBox .actionWrapper
{
    margin-top: 30px;
}

#manualInstall
{
    text-align:            left;
    position:              relative;
    border:                1px solid #BFBFBF;
    width:                 80%;
    min-width:             500px;
    padding:               30px 30px 30px 90px;
    background-color:      #FFFFFF;
    top:                   0px;
    height:                auto;
    min-height:            250px;
    display:               none;
}

/* barview (start) */
.page-barview{
    min-width: 0;
}
/* barview (end) */

.MainFrameText{
    padding-left: 18px;
}

/* Appearence backend adaptations (start)*/
#InfoConfig .TopRowDropDownSwitch span,
#LayoutSwitch span{
    color: #3A4249;
}
#InfoConfig .TopRowDropDownSwitch.Active span,
#LayoutSwitch.Active span{
    color: #fff;
}

/* Appearence backend adaptations (end)*/

/* treeview adaptations (start) */
.treeview,.treeview ul {
    margin: 0;
    padding: 0 0 0 0;
    list-style: none;
}
.treeview ul {
    padding: 0 0 0 15px;
}

.treeview ul {
    /*background-color: white;*/
    margin-top: 1px;
}

.treeview li{
    clear: both;
}

.treeview .hitarea {
    /*
	background: url(images/treeview-default.gif) -64px -25px no-repeat;
	height: 16px;
	width: 16px;
	margin-left: -16px;
    */
}

.treeview .hitarea {
    height: 16px;
    width: 16px;
    cursor: pointer;
    float: left;
}

.treeview a{
    float: left;
    line-height: normal;
    white-space: nowrap;
}
.treeview .collapsable > a{
    font-weight: bold;
}
.treeview li a{
    padding: 0 0 10px 5px;
}
.treeview .expandable-hitarea{
    background: url(/fotoweb/rsrc/structure_plus.gif) transparent no-repeat 0 50%;
}
.treeview .collapsable-hitarea{
    background: url(/fotoweb/rsrc/structure_minus.gif) transparent no-repeat 0 50%;
}
/* treeview adaptations (end) */

.SearchHitsInfoBox{
    font-size: 12px;
    margin-top: 5px;
    margin-bottom: 20px;
    margin-left:12px;
}

#gridTable
{
    /*height: 550px;*/
    overflow: auto;
    position: relative;
}


#GridHeaderTools
{
    height: 39px;
    position: relative;
    float: right;
	width: 280px;
	/* !jpg! */
	width: 400px;
}

/* !jpg! */
.thumbnailSizeLabel {
/*
	font-weight:bold;
	font-size:12px;

*/
	position:relative;
	float:left;
	margin:0 10px 0 0;
}
.thumbnailSizeMinusIcon {
	position:relative;
	float:left;
	margin:8px 0px 0 0;
}
.thumbnailSizePlusIcon {
	position:relative;
	float:left;
	margin:8px 0 0 0px;
}
/* !jpg! end */

#LayoutSwitchContainer,
#ImageScaleSliderContainer
{
    position: relative;
    float: left;
}

#ImageScaleSliderContainer
{
    margin-right: 40px;
	/* !jpg! */
    margin-right: 0px;
    padding:10px 0;
}

#ImageScaleSlider
{
    width: 150px;
}

/* for better feeling of reloading the grid page the images
will be made visible by javascript on the right time */
.ThumbContainer .Thumb img
{
    display: none;
}

#LayoutSwitchContainer{
}

#LayoutSwitch,
.TopRowDropDownSwitch
{
    cursor: pointer;
    padding-left:12px;
    float: right;
}

#LayoutSwitch .rslider,
.TopRowDropDownSwitch .rslider{
    padding-right:15px;
}

#LayoutSwitch.Active,
.TopRowDropDownSwitch.Active
{
    background:transparent url(/fotoweb/rsrc/toprowDropDown_bg_l.png) no-repeat scroll left top;
    color:#FFFFFF;
    position:relative;
    z-index:20;
    min-width:70px;
}

#LayoutSwitch.Active .rslider,
.TopRowDropDownSwitch.Active .rslider
{
    background:transparent url(/fotoweb/rsrc/toprowDropDown_bg_rslider.png) no-repeat scroll right top;
}

#LayoutSwitch span,
.TopRowDropDownSwitch span
{
    display: block;
    background: url(/fotoweb/rsrc/icon_layout.png) no-repeat left;
    padding-left: 20px;
}

#LayoutDropdown{
    background:transparent url(/fotoweb/rsrc/layoutPanel_wide_bg.png) no-repeat scroll 0 0;
    display:none;
    height:192px;
    padding:0;
    position:absolute;
    right:-1px;
    top:29px;
    width:254px;
    z-index:10;
}

#LayoutDropdown .LayoutDropdown-Content{
    padding: 12px 14px;
}

#LayoutDropdown .GridOption{
    line-height: 15px;
    margin: 6px 0;
}

#LayoutDropdown .GridOption label{
}

#LayoutDropdown .GridOption label span{
    display: inline-block;
    width: 85px;
}
#LayoutDropdown .Group{
    background: transparent url(/fotoweb/rsrc/separator.gif) repeat-x 0 0;
    overflow:hidden;
    padding:5px 0 0;
}
#LayoutDropdown .Group .GridOption{
    float: left;
    margin: 0px;
}

#LayoutDropdown .Group .GroupLabel{
    float:left;
    height:60px;
    line-height:20px;
    width:85px;
}

#LayoutDropdown .LayoutActions{
    background: transparent url(/fotoweb/rsrc/separator.gif) repeat-x 0 0;
    margin-top: 3px;
    clear: both;
    padding:8px 0;
}

/* Grid view adaptations (end) */

/* Default view adaptations (start) */
body.page-default
{
    background: url(/fotoweb/rsrc/fp_background.jpg) repeat-x center;
}

#Logo
{
    margin: 15px;
}

#StartPageImages
{
    position: relative;
    width: 1100px;
    height: 285px;
    margin: 115px auto;
}

#StartPageImages .Image
{
    /* float: left;*/
    position: absolute;
    /*text-align: center;*/
    padding: 4px 4px 0 4px;
}

#StartPageImages div img
{
    /* will be needed for javascript vertical positioning */
    position: relative;
}

#StartPageImages #Image1
{
    height:165px;
    left:20px;
    top:100px;
    width:220px;
    z-index:2;
}

#StartPageImages #Image2
{
    height:195px;
    left:180px;
    top:40px;
    width:260px;
    z-index:1;
}

#StartPageImages #Image3
{
    height:225px;
    left:396px;
    top:0;
    width:300px;
}

#StartPageImages #Image4
{
    height:195px;
    right:180px;
    top:40px;
    width:260px;
    z-index:1;
}
#StartPageImages #Image5
{
    height:165px;
    right:20px;
    top:100px;
    width:220px;
    z-index:2;
}

.ImageTopShadow
{
    position: absolute;
    background: url(/fotoweb/rsrc/dropshadow_fp_t.png) repeat-x top center;
    top: 0px;
    left: 4px;
    right: 4px;
    height: 4px;
}

.ImageLeftShadow
{
    position: absolute;
    background: url(/fotoweb/rsrc/dropshadow_fp_l.png) repeat-y left top;
    top: 4px;
    left: 0px;
    bottom: 0px;
    width: 4px;
}

.ImageRightShadow
{
    position: absolute;
    background: url(/fotoweb/rsrc/dropshadow_fp_r.png) repeat-y right top;
    top: 4px;
    right: 0px;
    width: 4px;
    bottom: 0px;
}

.imgContainersContainer
{
    position: relative;
}

.imgContainer
{
    position: absolute;
}

#LoginAndSearch
{
    position: relative;
    top: -230px;
    margin: 0 auto;
    overflow: hidden;
    z-index: 10;
    height: 177px;
    width: 333px;
    padding: 8px;
}

#innerLoginAndSearch
{
    height: 177px;
    overflow: hidden;
    background-color: #fff;
}

.Panel_T,
.Panel_TR,
.Panel_R,
.Panel_BR,
.Panel_B,
.Panel_BL,
.Panel_L,
.Panel_TL
{
    position: absolute;
}

.Panel_TL,
.Panel_T,
.Panel_TR,
.Panel_BL,
.Panel_B,
.Panel_BR
{
    height: 8px;
}

.Panel_L,
.Panel_R,
.Panel_TL,
.Panel_TR,
.Panel_BL,
.Panel_BR
{
    width: 8px;
}

/* using stretching to accomplish the outline */
.Panel_T
{
    background: url(/fotoweb/rsrc/fp_panel_t.png) repeat-x;
    top: 0px;
    left: 8px;
    right: 8px;
}
.Panel_TR
{
    background: url(/fotoweb/rsrc/fp_panel_tr.png) no-repeat;
    top: 0px;
    right: 0px;
}
.Panel_R
{
    background: url(/fotoweb/rsrc/fp_panel_r.png) repeat-y;
    top: 8px;
    /* stretching doesn't work for IE7 */
    /*bottom: 8px;*/
    height: 177px;
    right: 0px;
}

.Panel_BR
{
    background: url(/fotoweb/rsrc/fp_panel_br.png) no-repeat;
    right: 0px;
    bottom: 0px;
}
.Panel_B
{
    background: url(/fotoweb/rsrc/fp_panel_b.png) repeat-x;
    left: 8px;
    right: 8px;
    bottom: 0;
}
.Panel_BL
{
    background: url(/fotoweb/rsrc/fp_panel_bl.png) no-repeat;
    left: 0;
    bottom: 0;
}
.Panel_L
{
    background: url(/fotoweb/rsrc/fp_panel_l.png) repeat-y;
    top: 8px;
    /* stretching doesn't work for IE7 */
    /*bottom: 8px;*/
    height: 177px;
    left: 0px;
}
.Panel_TL
{
    background: url(/fotoweb/rsrc/fp_panel_tl.png) no-repeat;
    top: 0;
    left: 0;
}

#LoginAndSearch h2
{
    font-size: 22px;
    font-weight: normal;
    padding: 0px;
    margin: 0px 0px 15px 0px;
    color: #22292F;
}

#Login,
#Search
{
    text-align: left;
    height: 150px;
    width: auto;
    margin: 0;
    padding: 15px;
    /*border: 1px solid black;*/
    background: #fff url(/fotoweb/rsrc/fp_panel_bg.jpg) repeat-x;
    position: relative;
}

#LoginAndSearch form
{
    background: url(/fotoweb/rsrc/fp_seperator.gif) no-repeat bottom;
    height: 138px;
    padding: 0px;
    margin: 0px;
}

#searchContainer
{
    margin-top: 30px;
}

#idFwSearch
{
    background: url(/fotoweb/rsrc/fp_searchinput_bg.png) no-repeat;
    border: none;
    width: 246px;
    height: 22px;
    padding: 4px 8px;
    font-size: 16px;
    float: left;
}

#idFwSubmit
{
    background: url(/fotoweb/rsrc/fp_searchbutton_bg.png) no-repeat;
    border: none;
    padding: 0px;
    margin: 0px;
    width: 32px;
    height: 30px;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
}

#LoginAndSearch .Actions{
    overflow: hidden;
    padding: 5px 0 0 0;
}

#LoginAndSearch a{
    float: right;
    height: 16px;
}

#LoginAndSearch #switchSearchToLogin,
#LoginAndSearch #switchLoginToSearch
{
    float: left;
    padding-left: 20px;
    line-height: 16px;
}

#switchSearchToLogin
{
    background: url(/fotoweb/rsrc/icon_login.png) no-repeat 0px 0px;
}
#switchLoginToSearch{
    background: url(/fotoweb/rsrc/icon_zoom.png) no-repeat 0px 0px;
}

a#switchLoginToSearch:hover{
    background-position: 0px -16px;
}

#LoginSubmit
{
    cursor: pointer;
    background: url(/fotoweb/rsrc/general_bu.png) no-repeat;
    width: 103px;
    height: 28px;
    text-align: center;
    border: none;
    margin: 4px;
    padding-bottom: 5px;
    color: #fff;
    padding-bottom: 5px;
    font-size: 14px;
}

#divUserName label,
#divPassword label
{
    float: left;
    line-height: 25px;
    width: 70px;
}

#divUserName
{
    margin-bottom: 5px;
}

#divUserName input,
#divPassword input
{
    background: url(/fotoweb/rsrc/fp_inputfield_bg.png) no-repeat;
    width: 209px;
    height: 18px;
    padding: 4px 8px;
    font-size: 14px;
    border: none;
    margin: 0;
}

#LoginSubmit
{
    float: right;
}

#Remembering
{
    margin-top: 8px;
}

#chkRemember
{
    float: left;
    margin-left: 0;
}

#chkRememberLabel
{
    line-height: 20px;
}

/* Default view adaptations (end)*/

/* Preview view adaptations (start) */
.backToOverview
{
    float: left;
}

.backToOverview a
{
    display: block;
    background: url(/fotoweb/rsrc/icon_back.png) no-repeat left;
    padding-left: 20px;
    font-size: 12px;
}

#InfoConfig
{
    float: right;
}

#InfoConfig .TopRowDropDownSwitch span
{
    background:transparent url(/fotoweb/rsrc/icon_config.png) no-repeat left center;
    display: block;
    padding-left: 20px;
}

#QuickSteps
{
    float: right;
}

#InfoConfig .TopRowDropDown .labeledRight
{
    height: 17px;
    line-height: 17px;
}

#InfoConfig .labeledRight span,
#InfoConfig .labeledLeft span
{
    width: 130px;
}

.PreviewThumb
{
    float: left;
    padding-left: 3px;
}

.PreviewThumbCell
{
    width: 450px;
    height: 450px;
    vertical-align: middle;
    text-align: center;
    background-color: #F8F8F8;
    border: 1px solid #E5E5E5;
    padding: 1px;
}

.page-preview .Priority{
    float: left;
    display: block;
    margin-bottom: 2px;
    /* IE7 needs line height, instead of height */
    line-height:4px;
    width: 160px;
    margin-top: 8px;
}

.page-preview .Rating{
    float: right;
}

#QuickSteps a,
#QuickSteps a:hover{
    display:inline-block;
}

.previousImageLink,
.nextImageLink,
.previousImageLink-disabled,
.nextImageLink-disabled
{
    font-size:12px;
    background-repeat: no-repeat;
}

.nextImageLink,
.nextImageLink-disabled
{
    padding-right:20px;
}

.previousImageLink,
.previousImageLink-disabled
{
    padding-left:20px;
}

.previousImageLink
{
    background-image: url(/fotoweb/rsrc/icon_previous.png);
    background-position: 0 50%;
}

.nextImageLink
{
    background-image: url(/fotoweb/rsrc/icon_next.png);
    background-position: 100% 50%;
}

.previousImageLink-disabled{
    background-image: url(/fotoweb/rsrc/icon_previous_disabled.png);
    cursor: default;
    text-decoration:none;
    color:gray;
}

.nextImageLink-disabled{
    background-image: url(/fotoweb/rsrc/icon_next_disabled.png);
    cursor: default;
    text-decoration:none;
    color:gray;
}

span.Label
{
    display: block;
    padding:0 5px 0 0;
    margin: 3px 0px;
}

.Seperator
{
    border-top: 1px #B2B2B2 dotted;
    margin: 10px 0px;
}

.PreviewInfo
{
	overflow: auto;
    padding: 0 0 0 10px;
/* !jpg! make previewinfo wrap for 1024px width browsers (but not for 1280px) */
    width: auto;
	min-width: 320px;

 }

 /* !jpg! 
 	text-align:center; 
	background-color:#e0e0e0; 

 */
 #previewFlashPluginMissing 
 {
	padding:0px 10px 10px 10px; 
 	width:500px; 
}
 
.AllInfoContainers
{
    margin-top: 20px;
}

.AllInfoContainers .Label{
    min-width:200px;
}

.InfoContainer .Switch
{
    background: url(/fotoweb/rsrc/prevBar_i.gif) no-repeat;
    width: 499px;
    height: 31px;
    color: #F1F1F1;
    line-height: 31px;
    padding: 0px 10px;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
}

.InfoContainer .Switch.Active,
.InfoContainer .Switch.Active.Over
{
    background: url(/fotoweb/rsrc/prevBar_a.gif) no-repeat;
}

.InfoContainer .Switch.Over
{
    background: url(/fotoweb/rsrc/prevBar_o.gif) no-repeat;
}

.InfoContainer .Dropdown
{
    background: url(/fotoweb/rsrc/prevBar_bg.gif) bottom no-repeat;
    width: 499px;
    /*height: 234px;*/
    display: none;
    padding: 5px 10px;
}
/* Preview view adaptations (end) */

/**** PopDiv custom styles (start) ****/
.popdiv{
    background: none;
    padding: 0px;
}

.popdiv .header-container,
.popdiv .e,
.popdiv .footer-container{
    padding: 0 10px;
}
.popdiv .content-container{
    background-color: #F6F6F6;
    height: 100%;
}
.popdiv .header{
    color:#FFFFFF;
    font-size:16px;
    font-weight:bold;
    height:40px;
    line-height:40px;
    overflow:hidden;
    padding-left:10px;
    padding-right:20px;
    padding-top:5px;
}

.popdiv .footer{
    font-size: 0;
    height: 10px;
}
.popdiv .n{
    background: transparent url(/fotoweb/rsrc/popdiv_tc.png) repeat-x left top;
}
.popdiv .nw{
    background: transparent url(/fotoweb/rsrc/popdiv_tl.png) no-repeat left top;
}
.popdiv .ne{
    background: transparent url(/fotoweb/rsrc/popdiv_tr.png) no-repeat right top;
}
.popdiv .e{
    background: transparent url(/fotoweb/rsrc/popdiv_mr.png) repeat-y right top;
}
.popdiv .se{
    background: transparent url(/fotoweb/rsrc/popdiv_br.png) no-repeat right top;
}
.popdiv .s{
    background: transparent url(/fotoweb/rsrc/popdiv_bc.png) repeat-x left bottom;
}
.popdiv .sw{
    background: transparent url(/fotoweb/rsrc/popdiv_bl.png) no-repeat left top;
}
.popdiv .w{
    background: transparent url(/fotoweb/rsrc/popdiv_ml.png) repeat-y left top;
}

.popdiv .close{
    background:transparent url(/fotoweb/rsrc/popdiv_close.png) no-repeat scroll left top;
    border:medium none;
    height:19px;
    right:4px;
    top:4px;
    width:19px;
    padding: 0;
    text-indent: -9999px;
}
/**** PopDiv custom styles (end) ****/

.loadingIndicator {
    display: none;
    height:19px;
    left:50%;
    margin-left:-75px;
    position:absolute;
    text-align:center;
    top: 24px;
    width:150px;
}
.loadingIndicator .background{
    background:black none repeat scroll 0 0;
    height:100%;
    position:absolute;
    width:100%;
    top: 0px;
    left: 0px;
}
.loadingIndicator span{
    color: #E4E7EA;
    position:absolute;
    text-transform:uppercase;
    top:2px;
    left:0px;
    width:100%;
}
.SubFolderSelection
{
    text-decoration: none;
    background-color: #CAD0D6;
    color: #000000;
}


/***************** !jpg! originated styles for new pages *****************/

/* Panay dev styles
.unnamed1 {
	font-family: Arial, Sans-Serif, Verdana;
	font-size: 12px;
	color: #3A4249;
}
.unnamed2 {
	font-family: Arial, Sans-Serif, Verdana;
	font-size: 14px;
	font-style: italic;
	font-weight: bold;
	color: #000000;
}
.images {
	border: 1px solid #000000;
}
*/

.trans_box2 {
	/* 
	*/
	width:220px;
	height:57px;
	margin:178px 0 0 0;
	padding:2px 0 0 0;
	/* Mozilla ignores crazy MS image filters, so it will skip the following */
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='/fotoweb/images/75p_black.png');
}

.trans_box2 a, 
.trans_box2 a:link, 
.trans_box2 a:visited, 
.trans_box2 a:active, 
.trans_box2 a:hover
 {
	position:relative; 
	display:block; 
	width:40px; 
	margin:0 0 0 14px; 
	padding:0; 
	color:white; 
	font-size:21px; 
	text-decoration:none;
}

/* IE6 ignores styles with [attributes], so it will skip the following. */
.trans_box2[class] {
	background-image:url(/fotoweb/images/75p_black.png);
	/* Unset the IE filter if using IE7+ */
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src='');
}

.textPanelDiv {
	width:220px;
	height:180px;
	background-color:#EbEbEb; 
	border:1px solid #D1D3D2; 
	margin: 0;
	padding: 0;
}

.textPanelDiv p{
	color: black;
	font-size:12px;
	font-family:arial;
	font-weight:normal;
	margin:0; 
	padding:5px 5px 0px 14px;
}

.textPanelDiv a{
	font-size:12px;
}

.panelDiv {
	width:220px; 
	height:235px; 
	border:1px solid black;
	cursor:pointer; 
	background: url('/fotoweb/images/JSrequiredPanel.png') 0 0 no-repeat;
}

.columnDiv{
	float:left;
	padding:4px;
	margin:0;
}

a.columnA{
	float:left;
	padding:4px;
	margin:0;
}

/* footer menu styles */

.footerMenuContainer{
	padding: 0 54px 20px 0px;
}

.footerMenu{
/*
    background-color: #333; 
*/
	width:920px; margin:0 auto;
}

.footerMenu ul{
    margin: 0; 
	padding: 0;
    float: left;
}
 
.footerMenu ul li{
    display: inline;
}
 
.footerMenu ul li a{
/*
    background-color: #333; 
    float: left; 
	width:130px;
    color: #AEAFB1;
*/
    color: #909090;
	text-decoration: none;
    padding:0 0 0 22px;
}
 
.footerMenu ul li a:visited{
    color: #909090;
}
 
.footerMenu ul li a:hover, .footerMenu ul li .current{
/*
    background-color:#0b75b2;
*/
    color: #606060;
}

.ti-social-links {
	width:310px;
	height:24px;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
	margin: 21px 0px 0 0px;
	padding:0;
}
.ti-social-links h2 {
	margin:0 0 15px;
}
.ti-social-links a {
    background: url("/fotoweb/images/icon-social-sprite.gif") no-repeat scroll 0 0 transparent;
    display: block;
    float: left;
    height: 24px;
    margin: 0 7px 0 0;
    width: 24px;
}

.ti-social-links a:last-child {
    margin-right: 0;
}

.ti-social-links a.facebook {
    background-position: -25px 0;
}
.ti-social-links a.facebook:hover {
    background-position: 0 0;
}
.ti-social-links a.twitter {
    background-position: -25px -25px;
}
.ti-social-links a.twitter:hover {
    background-position: 0 -25px;
}
.ti-social-links a.google {
    background-position: -25px -50px;
}
.ti-social-links a.google:hover {
    background-position: 0 -50px;
}
.ti-social-links a.technorati {
    background-position: -25px -75px;
}
.ti-social-links a.technorati:hover {
    background-position: 0 -75px;
}
.ti-social-links a.delicious {
    background-position: -25px -100px;
}
.ti-social-links a.delicious:hover {
    background-position: 0 -100px;
}
.ti-social-links a.digg {
    background-position: -25px -125px;
}
.ti-social-links a.digg:hover {
    background-position: 0 -125px;
}
.ti-social-links a.stumbleupon {
    background-position: -25px -150px;
}
.ti-social-links a.stumbleupon:hover {
    background-position: 0 -150px;
}
.ti-social-links a.reddit {
    background-position: -25px -175px;
}
.ti-social-links a.reddit:hover {
    background-position: 0 -175px;
}
.ti-social-links a.myspace {
    background-position: -25px -200px;
}
.ti-social-links a.myspace:hover {
    background-position: 0 -200px;
}
.ti-social-links a.yahoo {
    background-position: -25px -225px;
}
.ti-social-links a.yahoo:hover {
    background-position: 0 -225px;
}
.ti-social-links a.live {
    background-position: -25px -250px;
}
.ti-social-links a.live:hover {
    background-position: 0 -250px;
}
.ti-social-links a.email {
    background-position: -25px -275px;
}
.ti-social-links a.email {
    background-position: 0 -275px;
}

.JPouterContainer {
}

.JPinnerContainer {
/*

*/
	width:800px;
	margin:0 auto;
	padding: 0 100px 0 0;
}

.pageTitleBar {
/*
	font-size:22px;
	font-family:arial;
	font-weight:normal;
*/
	background-color:#6E7681; 
	height:40px;
	margin: 0px 0 0 0;
	padding: 0px 0 0 0;
}

.pageTitleBar h1 {
	color: white;
	padding: 10px 0 0 10px;
	margin:0;
}

.npPreviewImage {
/*
	background-color:cyan;
	height:164px;
	height:200px;
*/
	width:175px;
	float:left;
	text-align:center;
	padding:2px 0 10px 0;
}

.npPreviewImage img{
	border: 1px solid #6e7681;
}

.nptitleDesc {
/*
	height:190px;
*/
	width:435px;
	float:left;
	padding: 0px 10px 0 10px;
	margin:0;
}

.npdetails {
/*
	height:200px;
	border: 1px solid black;
*/
	width:160px;
	float:left;
	padding:7px 0 10px 0;
}

.nptitleDesc p.descTitle{
	font-size:14px;
	font-weight:bold;
	margin: 0 0 10px 0;
}

.nptitleDesc p , .npdetails p{
	margin:0 0 6px 0;
	padding:0 0 0 0;
}

.npdetailsL {
	width:86px;
	float:left;
	padding: 0px 0px 0 0px;
}

.npdetailsR {
	width:70px;
	float:left;
	padding: 0px 0px 0 0px;
}

.npdetailsBot {
	width:160px;
}

.rowWrapper {
	background-color:#ebebeb; 
	padding: 10px 0 0px 10px;
}

.standardPageTitleBar {
/*
	font-size:18px;
	background-color:#6E7681; 
*/
	background-color:#333D47; 
	height:40px;
	padding: 1px 0 0 5px;
}

.standardLeftPanel {
	/*
	background-color:cyan;
	*/
	float:left;
	width:540px;
	padding: 10px 10px 0 10px;
	margin:10px 0 0 0;
}

.standardPanel {
	/*
	background-color:cyan;
	*/
	float:left;
	width:780px;
	padding: 10px 10px 5px 10px;
	margin:10px 0 0 0;
}

.standardLeftPanel p {
	/*
	*/
	padding:0;
	margin:0 0 10px 0;
}

.standardRightPanel {
	background-color:#E4E7EA;
	float:right;
	border: 1px solid black;
	width:200px;
	padding: 10px 10px 0 10px;
	margin:20px 0 0 0;
}

.standardPanel p ,
.standardRightPanel p {
	margin:0 0 10px 5px;
}

.standardRightPanel ul {
	/* 
	list-style-image: url("rsrc/icon_arrow.gif"); 
	*/
	margin:0 0 10px 0px;
	padding:0;
	list-style-type: none;
}

.standardRightPanel ul li {
	background: url("/fotoweb/rsrc/icon_arrow.gif") no-repeat left top;
	margin:0 0 5px 0;
	padding:0 5px 0 20px;
}

/**** PopDiv custom styles (start) ****/
.popdiv{
    background: none;
    padding: 0px;
}

.popdiv .header-container,
.popdiv .e,
.popdiv .footer-container{
    padding: 0 10px;
}
.popdiv .content-container{
    background-color: #F6F6F6;
    height: 100%;
}
.popdiv .header{
    color:#FFFFFF;
    font-size:16px;
    font-weight:bold;
    height:40px;
    line-height:40px;
    overflow:hidden;
    padding-left:10px;
    padding-right:20px;
    padding-top:5px;
}

.popdiv .footer{
    font-size: 0;
    height: 10px;
}
.popdiv .n{
    background: transparent url(/fotoweb/rsrc/popdiv_tc.png) repeat-x left top;
}
.popdiv .nw{
    background: transparent url(/fotoweb/rsrc/popdiv_tl.png) no-repeat left top;
}
.popdiv .ne{
    background: transparent url(/fotoweb/rsrc/popdiv_tr.png) no-repeat right top;
}
.popdiv .e{
    background: transparent url(/fotoweb/rsrc/popdiv_mr.png) repeat-y right top;
}
.popdiv .se{
    background: transparent url(/fotoweb/rsrc/popdiv_br.png) no-repeat right top;
}
.popdiv .s{
    background: transparent url(/fotoweb/rsrc/popdiv_bc.png) repeat-x left bottom;
}
.popdiv .sw{
    background: transparent url(/fotoweb/rsrc/popdiv_bl.png) no-repeat left top;
}
.popdiv .w{
    background: transparent url(/fotoweb/rsrc/popdiv_ml.png) repeat-y left top;
}

.popdiv .close{
    background:transparent url(/fotoweb/rsrc/popdiv_close.png) no-repeat scroll left top;
    border:medium none;
    height:19px;
    right:4px;
    top:4px;
    width:19px;
    padding: 0;
    text-indent: -9999px;
}


.popdiv.CMSExport .header{
    color:#FFFFFF;
    font-size:16px;
    font-weight:bold;
    height:5px;
    line-height:5px;
    overflow:hidden;
    padding-left:10px;
    padding-right:20px;
    padding-top:5px;
}

.popdiv.CMSExport .n{
    background: transparent url(/fotoweb/rsrc/popdiv_cms_tc.png) repeat-x left top;
}
.popdiv.CMSExport .nw{
    background: transparent url(/fotoweb/rsrc/popdiv_cms_tl.png) no-repeat left top;
}
.popdiv.CMSExport .ne{
    background: transparent url(/fotoweb/rsrc/popdiv_cms_tr.png) no-repeat right top;
}

.popdiv.CMSExport .close{
    display:none;
}

/**** PopDiv custom styles (end) ****/

.CMSExportDialogMini
{
    top: 90px !important;
}

/* hack for iphone to stop it scaling text that it thinks will be too small to read */
@media screen and (max-device-width: 480px){
  body{
    -webkit-text-size-adjust: none;
  }
}


