/********************************************************************************************************
											      Resets / Defaults
********************************************************************************************************/
.en *, .es *, .fr *, .ro *, .pt *, .nl *, .no *, .de *, .da *, .sv *, .it *, .nb *
{
    font-size: 10px;
}

.en input, .es input, .fr input, .ro input, .pt input, .nl input, .no input, .de input, .da input, .sv input, .it input, .nb input
{
    font-size: 13px;
}

.ja *, .zh *, .ko *, .ar *
{
    font-size: 13px !important;
}

*
{
    padding:0;
    margin:0;
}

body
{
    padding: 0px 5px;
    font-family: Verdana, Arial, Helvetica;
}

input.button
{
	padding: 3px 7px;
}


/********************************************************************************************************
												Cosmetic Styling
********************************************************************************************************/

/* The "Search" and "Results" labels above each section. */
.sectionTitle
{
    padding: 3px 5px;
    font-weight: bold;
}

/* The top table cells of the result table. */
#document-results-container #document-results-table .header
{
    font-weight: bold;
}

/* These styles are only applied when viewed on a device thats < 480px wide (mobile devices).  */
@media screen and (max-width: 480px)
{
	/* Decrease the height of the header on a mobile device. */
	#header
	{
		 height: 35px !important;
	}
	
	/* User a smaller logo on the mobile device. */
	#logo
	{
		height: 35px !important;
		background: url("Logo_153x28.png") no-repeat scroll 0 3px  !important;
		width: 153px !important;
	}
	
	/* If a search was performed without user input, we won't display a button and we can instead display the logo. */
	.autoSearch #logo
	{
		display: inherit !important;
	}
}


/********************************************************************************************************
											      Structural CSS
*******************************************************************************************************/
#page
{
	width: 100%;
	min-width: 570px;
	position: relative;
}

#header
{
    position: relative;
}

#footer
{
    clear: both;
    padding-right: 5px;
    position: relative;
}

#logo
{
	background: url("Rochdale_Borough_Council_logo-sml.gif") no-repeat scroll 0 10px;
	height: 75px;
	width: 306px;
}

#searchContainer
{
	float: left;
	width: 310px;
}

#resultsContainer
{
    position: absolute;
    left: 310px;
    right: 5px;
}

.autoSearch #searchContainer
{
	display: none;
}

.autoSearch #resultsContainer
{
    border-left-width: 1px;
	left:0;
}

.displayMobileOnly
{
	display: none !important;  /* Hidden by default, displayed in the mobile version only.  Overidden in the mobile media selector. */
}

/* The language select dropdown */
#language-select
{
	bottom: 0;
    position: absolute;
    right: 5px;
    padding-bottom: 5px;
    float: right;
}

#language-icon
{
	display: inline;
}

#language-icon img
{
	position:relative; 
	top: 3px
}

#btnBackToSearch
{
	position: relative;
	top: 2px;
}

.autoSearch #btnBackToSearch
{
	display: none;
}

/* Both the search panel and the results container. */
#searchpanel-container, #document-results-container
{
    height: 400px;
}

#fulltextsearch-panel
{
    height: 35px; 
    padding: 3px; 
}

#ft-keyword-panel
{
    height: 240px;
    overflow: auto;
}

/* Contains the entire search panel. */
#searchpanel-container
{
    width: 300px;
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
}

/* Displays a message when an error has occured. */
#searchpanel-container #searchpanel-error
{
    display: none;
    background-image: url(redSTOP_22x22.gif);
    background-repeat: no-repeat;
    background-position: left;
    height: 22px;
    padding: 8px 0px 0px 26px;
}

/* Contains the query drop down / single query name and query instructions. */
#searchpanel-container #query-title
{
    padding-top: 5px;
    width: 100%;
}

/* Contains the dynamic information which changes by query - the instructions and the keywords */
#searchpanel-container #query-data
{
    height: 320px;
    overflow: auto;
    padding-bottom: 5px;
}

#query-instructions
{
	margin-top: 10px;
}

/* Text describing a keyword input field */
#searchpanel-container #query-data #keyword-panel .description-item
{
    display: block;
}

.description-item
{
	margin-top: 10px;
	margin-bottom: 5px;
}

/* Text indicating a keyword validation problem */
#searchpanel-container #query-data #keyword-panel .validation-error
{
    display: block;
}

/* The bottom area of the search panel. */
#searchpanel-container #search-bottom
{    
    padding: 5px;
    text-align: right;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
}

/* The date range picker area of the search panel. */
#searchpanel-container #dateRangePicker
{
    width: 242px;
}

/* The OnBase logo. */
#poweredby
{
    background-image: url("Powered_By_OnBase.png");
    bottom: 3px;
    float: left;
    height: 25px;
    width: 70px;
}

/* Contains the list of document results. */
#document-results-container
{
    width: 100%;
    overflow: auto;
}

/* Displays a message when the maximum results has been reached. */
#document-results-container #maximum
{
    display: none;
    padding-left: 2px;    
}

/* Displays a message when an error has occured. */
#document-results-container #dochitlist-error
{
    display: none;
    background-image: url(redSTOP_22x22.gif);
    background-repeat: no-repeat;
    background-position: left;
    padding: 8px 0px 0px 26px;
    margin-left: 5px;
}

#document-results-table
{
    width:100%;
}
#document-results-table td
{
    white-space:nowrap;
}
#document-results-table td:last-child
{
    width:100%;
}

/* A cell in the table of document results. */
#document-results-container #document-results-table td
{
    cursor: pointer;
    padding: 9px;
}

#document-results-container #document-results-table div, 
#document-results-container #document-results-table div
{
    padding-right: 10px;
}

/* The top table cells of the result table which use sorting. */
#document-results-container #document-results-table .Ascending, 
#document-results-container #document-results-table .Descending
{
    background-repeat: no-repeat;
    background-position: right;
}

/* When the column is in an ascending sort. */
#document-results-container #document-results-table .Ascending
{
    background-image: url(ArrowUp.gif);
}

/* When the column is in a descending sort. */
#document-results-container #document-results-table .Descending
{
    background-image: url(ArrowDown.gif);
}

/* Displays a loading animation. */
.loading
{
    background-image: url(wait.gif);
    background-repeat: no-repeat;
    background-position: center;
}

/* After the results are loaded */
.loaded
{
    background-image: none;
}

#selectSearchLabel
{
	display: block;
	margin-bottom: 5px;	
}

table.collapsed
{
    border-collapse: collapse;
}
            
table.collapsed td
{
    margin:0;
    padding:0;
    border-spacing:0;
}


/********************************************************************************************************
												Dates and Calendars
********************************************************************************************************/
.calendar
{
    font-size: 10px;
}

.default
{
    color: #000000;
    font-family: Verdana,Arial,Helvetica,Sans-Serif;
    font-size: 10px;
    font-weight: normal;
}

.weekDaysCal, .daysMonthCell, .daysOtherMonthCell, .daysMonthTodayCell
{
    border: 1px solid #E1ECFC;
}

.weekDaysCal
{
	font-weight: normal;
    font-size: 12px;
    color: #000000;
    white-space:nowrap;
}

.daysMonthCell, .daysMonthSelectCell, .daysMonthCalRow, .daysMonthTodayCell
{
	cursor:pointer;
}

.daysMonthCell:hover
{
    border-style:outset;
}

.daysMonthSelectCell
{
    background-color: yellow;
    border-width:1px;
	border-style:outset;
}

.daysOtherMonthCell
{
	color:#95A5BA;
}

.daysOtherMonthCell:hover
{
    border-style:outset;
}

.daysMonthCalRow
{
	border:thin solid black;
}

.daysMonthTodayCell
{
    color: #ff0000;
}

.daysMonthTodayCell:hover
{
    border-style:outset;
}
 
#dateRangeContainer
{
	padding: 3px;
 	margin-bottom: 5px; 
 	margin-top: 10px;
	color: #000;
	border: 1px solid #8D8D8D;
}

#dateRangePicker input
{
    padding: 2px;
    font-size: 11px !important;
}

#singleDate input
{
    font-size: 11px !important;
    margin-bottom: 0;
}

#singleDate_title
{
	margin-top: 10px;
	margin-bottom: 5px;
}

#singleDate
{
    display: block;
    margin-top: 10px;
}