/*
/// --------------------------------------------------
///
///   www.FreeOnlineHelpdesk.co.uk
///   www.redcape.org
///   Copyright 2008
///
///   Original Author: Paul Bullivant
///   Original Date Created: Mar 2008
///
///
/// --------------------------------------------------
*/


/*	------------------------------
	DEFAULT FORMATS
	------------------------------ */

/* The page sets the area the service uses and the border to that area
It is the main css style for the site
 */
.page
{
	width: 1150px;
	border: solid 1px black;
	text-align: left;
}

body	
{
    font-family: Verdana;   
    font-size: small;
    text-align: center;
}


.vertical_text
{
    writing-mode: tb-rl;
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-o-transform: rotate(90deg);
}

/* Main Formats */
.embeddedpage
{
	text-align: left;
}

/*
The 'powered by' line that appears at the bottom of each helpdesk page on the master page
*/
.strapline
{
	width: 1150px;
	font-size: x-small;
	text-align: right;
	color: Gray;
}


/* The yellow information panels used for 'coming soon' */
.infopanel
{
	border: solid 1px black;
	background-color: #FFFFDD;
	padding: 5px 5px 5px 5px;
	font-size: xx-small;
}

.panelcontent
{
    /* This required to prevent content of panel showing on initial page load */
    overflow:hidden;
}

/*
.ProgressBar {
			margin: 0px;
			border: 0px;
			padding: 0px;
			width: 100%;
			height: 2em;
		}
*/

.progress_panel
{
	font-size: large;
	text-align: center;
	vertical-align: middle;
	padding: 10px 10px 10px 10px;
	left: 50%;
	top: 50%;
	width: 300px;
	height: 150px;
	margin: -75px auto auto -150px;
	border:  solid 2px black;
	position: fixed;
	z-index: 4;
}

.inline_table
{
	margin: 10px 10px 10px 10px;
}
.inline_table_row
{
	vertical-align: top;
}
.inline_table_cell
{
	padding: 10px 10px 10px 10px;
	border: solid 1px black;
}

.inline_full_width_table
{
    width: 100%;
}

.center
{
    text-align: center;
}

/* ----------------- */
/* Colour Formatting */
/* ----------------- */

/* MAIN COLOURS */
.colour_text_main				{ color: #000000; }

.colour_background_main			{ background-color: #FFFFFF; }
.colour_app_menu_selected_main	{  border-bottom-color: #FFFFFF; }



.colour_label_minor				{ color: #AAAAAA; }


/* PRIMARY THEME COLOURS */

/* Primary colours are used for highlighted text, hyperlinks, menu text and coloured highlighted backgrounds e.g. Message bars */
a								{ color: #5555DD; text-decoration: none; }
a:hover							{ color: #5555DD; text-decoration: underline; }
.colour_primary					{ color: #5555DD; }

.colour_background_primary		{ background-color: #CCCCFF; }


/* BACKGROUND COLOURS */
/* There are two background colours in addition to the main background colour.
   These are used for panels */
.colour_background_1			{ background-color: #DDDDFF; }

.colour_menu_selected_border	{ border-top-color: #CCCCCC;
								  border-right-color: #CCCCCC;
								  border-left-color: #CCCCCC; }
.colour_menu_dynamic			{ border-left-color: #CCCCCC;
								  border-bottom-color: #CCCCCC;
								  border-right-color: #CCCCCC; }

.colour_background_2			{ background-color: #EEEEEE; }
.colour_menu_selected_2			{ border-bottom-color: #EEEEEE; }

/* HIGHLIGHT COLOURS */
.colour_background_highlight_1	{ background-color: #CCFFCC; }
.colour_background_highlight_1S { background-color: #FFFFFF; }
.colour_background_highlight_2	{ background-color: #DDDDDD; }
.colour_background_highlight_2S { background-color: #FFFFFF; }
.colour_background_highlight_3  { background-color: #FFFFCC; }
.colour_background_highlight_3S { background-color: #FFFFFF; }


.colour_background_highlight_4  { background-color: #CCCCCC; }
.colour_background_highlight_4S { background-color: #FFFFFF; }
.colour_background_highlight_5  { background-color: #CCCCCC; }
.colour_background_highlight_5S { background-color: #FFFFFF; }
.colour_background_highlight_6  { background-color: #CCCCCC; }
.colour_background_highlight_6S { background-color: #FFFFFF; }
.colour_background_highlight_7  { background-color: #CCCCCC; }
.colour_background_highlight_7S { background-color: #FFFFFF; }
.colour_background_highlight_8  { background-color: #CCCCCC; }
.colour_background_highlight_8S { background-color: #FFFFFF; }
.colour_background_highlight_9  { background-color: #CCCCCC; }
.colour_background_highlight_9S { background-color: #FFFFFF; }


/* Panels for Audit Management */
.panelYes						{ background-color: #ccffcc; }
.panelNo						{ background-color: #ffcccc; }
.panelNotApplicable				{ background-color: #eeeeee; }





.border_u
{
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-left-style: solid;
	border-left-width: 1px;
	border-right-style: solid;
	border-right-width: 1px;
}
.border_n
{
	margin: 3px 0px 0px 0px;
	border-top-style: solid;
	border-top-width: 1px;
	border-left-style: solid;
	border-left-width: 1px;
	border-right-style: solid;
	border-right-width: 1px;
}
.border_bottom
{
	border-bottom-width: 1px;
	border-bottom-style: solid;
}

/* Used on Admin pages for displaying hyperlinks that can be used for linking to and embedding the helpdesk */
.hyperlink_label
{
	font-size: x-small;
}




/* Popup Panel */
.popup_panel
{
	text-align: left;
	padding: 10px 10px 10px 10px;
	left: 20%;
	top: 20%;
	width: 500px;
	height: 300px;
	border:  solid 2px black;
	overflow: scroll;
	position: fixed;
	z-index: 1;
}
.popup_panel_title
{
	font-weight: bold;
}

.mode_panel
{
	width: 100%;
	height: 40px;
	font-size: medium;
	vertical-align: bottom;
	text-align: center;
	border: solid 1px black;
}

.notification_panel
{
	text-align: left;
	padding: 5px 5px 5px 5px;
	right: 0px;
	bottom: 0px;
	width: 500px;
	border:  solid 1px black;
	overflow: auto;
	position: fixed;
	z-index: 1;
	font-size: xx-small;
}

.broadcast_panel
{
	text-align: center;
	padding: 5px 5px 5px 5px;
	top: 0px;
	left: 0px;
	width: 100%;
	border:  solid 1px black;
	overflow: auto;
	position: fixed;
	z-index: 1;
	font-size: small;
	font-style: italic;
}



/* Heading */
.heading
{
	width: 100%;
	height: 100px;
}
.headinglogo
{
	text-align: left;
	padding: 10px 10px 10px 10px;
}
.headingtext
{
	font-size: x-large;
	text-align: center;
    vertical-align: middle;
}

/* Login */
.login
{
	font-size: xx-small;
	text-align: right;
	vertical-align: middle;
}

.not_allowed
{
    padding: 10px 10px 10px 10px;
}

/* Report */

.reportlisttable
{
	padding: 0px 0px 0px 0px;
	border-right: solid 1px black;
	font-size: x-small;
}
.reporttable
{
	font-size: x-small;
}
.reportlabel
{
	padding: 5px 10px 5px 10px;
}
.reportdata
{
	padding: 5px 10px 5px 10px;
	width: 200px;
}

/* Comments */
.commentsgrid
{
	
	font-size: x-small;
}
.commenttype
{
    border: solid 1px black;
	padding: 5px 5px 5px 5px;
}
.message
{
	font-size: xx-small;
	height: 15px;
	border-top: solid 1px black;
	width: 100%;
}

.modalmessage
{
	font-size: xx-small;
	height: 15px;
	width: 100%;
}

/* Login */
.loginlabel
{
	width: 150px;
}

/* Home Page */
.contentpage
{
	padding: 10px 10px 10px 10px;
}

/* EMAIL */
.email_menu
{
	padding: 5px 0px 5px 0px;
	width: 100%;
	text-align:left;
	font-size: x-small;
	padding: 3px 0px 3px 0px;
}
.email_menu_item
{
	text-align: left;
	padding: 0px 5px 0px 5px;
}

.email_body
{
	width: 100%;
	font-size: x-small;
	font-family:verdana;
	text-align: left;
	padding: 0px 0px 0px 10px;
}

.email_heading
{
	font-size: medium;
	text-align: center;
}

.email_status
{
width: 100%;
}

.email_title
{
font-size: small;
}

.email_summary
{
	font-size: xx-small;
	padding: 2px 2px 2px 2px;
	text-align: right;
}
.email_comment
{
	font-size: x-small;
	border: solid 1px black;
	padding: 5px 5px 5px 5px;
	text-align: left;
}
.email_comment_field
{
	text-align: left;
}

/*	------------------------------
	REPORTS
	------------------------------ */

.report_body
{
	width: 100%;
	font-size: x-small;
	font-family:verdana;
	text-align: center;
	padding: 0px 0px 0px 0px;
}
.report_header
{
    width: 100%;
}
.report_heading
{
	font-size: large;
	text-align: center;
	padding: 0px 0px 0px 50px;
}
.report_panel
{
	border: solid 1px black;
	width: 100%;
}
.report_table
{
	width: 100%;
	
}

.report_title
{
	font-weight: bold;
	width: 150px;
	padding: 5px 20px 5px 0px;
	font-size: x-small;
}

.report_narrow_header_cell
{
	font-weight: bold;
	font-size: x-small;
	width: 100px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_narrow_cell
{
	font-size: x-small;
	width: 100px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}

.report_header_cell
{
	font-weight: bold;
	font-size: x-small;
	width: 150px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_cell
{
	font-size: x-small;
	width: 150px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
	
}
.report_wide_header_cell
{
	font-weight: bold;
	font-size: x-small;
	width: 340px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_wide_cell
{
	font-size: x-small;
	width: 340px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_extra_wide_header_cell
{
	font-weight: bold;
	font-size: x-small;
	width: 400px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_extra_wide_cell
{
	font-size: x-small;
	width: 400px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}
.report_inner_cell
{
	font-size: x-small;
	width: 300px;
	padding: 5px 5px 5px 5px;
	border: solid 1px black;
}

.report_subheading
{
	font-size: medium;
}
.report_label
{
	width: 200px;
	padding: 5px 20px 5px 0px;
	font-size: x-small;
}
.report_data
{
	font-size: x-small;
}
.report_footer
{
	font-size: xx-small;
}



/* Help */
.helppanel
{
	text-align: left;
	padding: 10px 10px 10px 10px;
	left: 30%;
	top: 30%;
	width: 300px;
	border:  solid 2px black;
	position: fixed;
	z-index: 3;
}
.help_title
{
	font-weight: bold;
}

.help_image
{
	width: 100%;
	page-break-inside : avoid;
	border: none;
}

.help_table
{
    border: solid 1px 1px 1px 1px black;
    padding: 5px 5px 5px 5px;
    font-size: x-small;    
}

.help_note
{
	font-style: italic;
	border: solid 1px 1px 1px 1px black;
    padding: 5px 5px 5px 5px;
    font-size: x-small;
}
.help_section
{
	font-size: large;
	padding: 10px 0px 10px 0px;
}
.help_example
{
	font-style: italic;
	color: Gray;
}
.help_Brief
{
	font-family: Verdana;
	width: 400px;
	text-align: left;
	font-size: x-small;
}
.help_Normal
{
	font-family: Verdana;
	width: 350px;
	text-align: left;
	font-size: x-small;
}
.help_Full
{
	font-family: Verdana;
	width: 850px;
	text-align: left;
	font-size: x-small;
}

.help_FullWithContents
{
	font-family: Verdana;
	width: 850px;
	text-align: left;
	font-size: x-small;
}

.help_caption
{
	text-align: center;
	font-style: italic;
	font-size: x-small;
}

.help_title_1
{
	font-size: x-large;
}

.help_title_2
{
	font-size: large;
}

.help_title_3
{
	font-size: medium;
}
.help_title_4
{
	font-size: small;
	text-decoration: underline;
}






.terms
{
	font-family: Verdana;
	width: 900px;
	text-align: left;
	font-size: x-small;
}
.terms_header
{
	text-align: center;
	font-size: medium;
}
.terms_subheader
{
	text-align: left;
	font-size: small;
}


/*	------------------------------
	CUSTOM FORMATS
	------------------------------ */

/* The customisable footer that appears on the home page */
.footer
{
	font-size: x-small;
}

/* The main grey panels used throughout the helpdesk. */
.panel
{
	border: solid 1px black;
	padding: 0px 0px 0px 0px;
}


/* AUDIT MANAGEMENT */


/* The font used for the panel titles */
.panel_title
{
	font-size: large;
	text-align: left;
	padding: 5px 0px 0px 10px;
}
.panel_body
{
    vertical-align: top;
    padding: 10px 10px 10px 10px;
}
.panel_header_table
{
	width: 100%;
}
.panel_togglebutton
{
	text-align: right;
}
.panel_helpbutton
{
	text-align: right;
	width: 16px;
}
.panel_message
{
    font-size: xx-small;
	height: 20px;
	border-top: solid 1px black;
	width: 100%;
}

.navigation_link
{
	padding: 5px 0px 0px 10px;
	font-size: small;
}

.navigation_image
{
	width: 100px;
	height: 100px;
	/*background-image: url(redcape.jpg);*/
}



/* Menu */

/* The background colour to the main navigation menu */

/*
.menu_item
{
	font-size: x-small;
	padding-left: 5px;
}
*/
.menu_item:hover
{
	text-decoration: underline;
}
.menu_item:visited
{
	text-decoration: none;
}

/*New Menu */
.menu_bar
{
	width: 100%;	
}
.menu_item
{
    font-size: x-small;
    padding: 5px 5px 5px 5px;
    margin: 3px 0px 0px 0px;
    text-align: left;
}
.menu_item_dynamic
{
    font-size: x-small;
    padding: 5px 5px 5px 5px;
}

/* Wizard */
.wizard
{
	width: 100%;
	padding: 10px 10px 10px 10px;
	border: solid 1px black;
	vertical-align: top;
}
.wizard_navigation
{
	text-align: right;
}
.wizard_header
{
	font-size: large;
	padding: 0px 0px 5px 0px;
	border-bottom: solid 1px black;
}
.wizard_header_text
{
    font-size: large;
}
.wizard_header_progress
{
   width: 100px;
   font-size: x-small;
}

.wizard_sidebar
{
	vertical-align: top;
	width: 200px;
}
.wizard_sidebar_small
{
	vertical-align: top;
	width: 250px;
	font-size: x-small;
}
.wizard_step
{
	padding: 15px 10px 10px 0px;
	vertical-align: top;
	height: 200px;
}



/* Organisations Page */
.organisation_table
{
	padding: 0px 10px 0px 0px;
}
.organisation_details_table
{
    vertical-align: top;
}
.organisation_label
{
    vertical-align: top;
    width: 100px;
}
.organisation_data
{
    vertical-align: top;
    width: 300px;
}
.organisation_body
{
    padding: 5px 5px 5px 5px;
    width: 400px;
}
.organisation_list
{
    padding: 5px 5px 5px 10px;
    width: 300px;
    overflow: visible;
}




/* HELPDESK APPLICATION */

/* Admin Configuration Table */
.admin_config_table
{
	width: 100%;	
	border: solid 1px black;
}
.admin_config_label
{
	width: 440px;
	padding: 0px 0px 0px 10px;
}
.admin_config_label_small
{
	width: 250px;
	padding: 0px 0px 0px 10px;
}
.admin_config_label_long
{
	width: 550px;
	padding: 0px 0px 0px 10px;
}
.admin_config_label_short
{
	width: 150px;
	padding: 0px 0px 5px 10px;
	vertical-align: text-bottom;
}
.admin_config_label_extra
{
	width: 480px;
	padding: 0px 0px 0px 0px;
	text-align: right;
}
.admin_config_data
{
	padding: 0px 5px 0px 5px;
	width: *;
}
.admin_user_list
{
	width: 200px;
}
.admin_user_details
{
	text-align: right;
	height: 50px;
	vertical-align: top;
}
.admin_user_label
{
	text-align: left;
	font-size: xx-small;
	width: 60px;
}
.admin_checkbox_label
{
	text-align: right;
}
.admin_checkbox_ctrl
{
	text-align: left;
}


.small
{
	font-size: xx-small;
}


.ticketlisttable
{
	padding: 0px 0px 0px 0px;
	border-right: solid 1px black;
	font-size: x-small;
	width: 100%;
}


.ticketpagecontrol
{
	width: 100%;
	text-align: left;
	font-size: x-small;
}


.tablecell
{
	border-left: solid 1px black;
	border-top: solid 1px black;
	border-bottom: solid 1px black;
	border-right: none;
	padding: 5px 5px 5px 5px;
}
.tickettable
{
	font-size: x-small;
}
.ticketlabel
{
	width: 100px;
	padding: 5px 10px 5px 10px;
}
.ticketdata
{
	padding: 5px 10px 5px 10px;
	width: 300px;
}


/* Field Editor */
.field_editor_table
{
	border: solid 1px black;	
	text-align: center;
}
.field_editor_cell
{
	vertical-align:top;
	width: 50%;
	padding: 0px 5px 5px 0px;
}

.field_dynamic_help
{
	vertical-align:top;
	width: 50%;
	padding: 0px 0px 5px 5px;
}

.field_options_table
{
	vertical-align:top;
	width: 50%;
	padding: 5px 5px 10px 0px;
}

.field_additional_info
{
	vertical-align:top;
	width:50%;
	padding: 5px 0px 10px 5px;
}

.field_change_order
{
	height:30px;
	top:0px;
	right:0px;
	padding: 0px 0px 0px 0px;
}

.fields_full_width_table
{
    width: 100%;
}


/* MODAL POPUP */

.modalBackground {
	background-color:Gray;
	filter:alpha(opacity=70);
	opacity:0.7;
	z-index: 1;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%
}

.modalPopup {
	background-color:#ffffff;
	text-align: left;
	vertical-align: middle;
	padding: 10px 10px 10px 10px;
	left: 50%;
	top: 50%;
	width: 500px;
	margin: -75px auto auto -250px;
	border:  solid 2px black;
	position: fixed;
	z-index: 2;
	max-height: 300px;
	overflow:auto;
}
.modalTitle
{
	font-weight: bold;
}

/* HELPDESK APPLICATION */

/* VIEW NOTIFICATION */

.notificationlist
{
	padding: 0px 0px 0px 0px;
	font-size: small;
}

.notification
{
	width: 300px;
	padding: 0px 10px 0px 10px;
}

.notification_large
{
	width: 100%;
	height: 100%;
}

.notification_small
{
	width:35%;
}

.small_font_table 
{
	vertical-align: top;
	font-size:x-small;
}

.normal_font_cell 
{
	font-size:small;
}

.notification_column 
{
	padding: 0px 5px 0px 5px;
}

/*Top, Right, Bottom, Left */

.notification_column_spacer 
{
	width:45%;
}

.notificationlabel_long
{
	padding: 5px 10px 5px 10px;
	width: 50%;
	vertical-align: top;
}

.notificationlabel_tall
{
	padding: 5px 10px 5px 10px;
	height: 52px;
	vertical-align: top;
	overflow: scroll;
	
}

.notificationlabel
{
	width: 100px;
	padding: 5px 10px 5px 10px;
}

.data_grid
{
	font-size: x-small;
}
.data_grid_cell
{
	text-align: center;
	page-break-inside : avoid;
}
.data_grid_item
{
	page-break-inside : avoid;
    text-align: center;
}

/* ADMIN AUDITING */

.verticlealigncell
{
	width: 0px;
	padding: 0px 0px 0px 0px;
	vertical-align: top;
}

.auditpadcell
{
	width: 0px;
	padding: 3px 0px 0px 0px;
	vertical-align: top;
}

.questiontable
{
}

.browse_reports_osl_datagrid
{
	max-height: 295px;
	overflow: auto;
}


.browse_reports_reports_datagrid
{
	max-height: 295px;
	overflow: auto;
}

/* MANGEMENT REPORTS  */
.management_report_table
{
	width: 100%;
	padding: 5px 5px 5px 5px;
}
.report_item
{
	text-align: center;
	padding: 15px 15px 15px 15px;
}
.report_description
{
	width: 100%;
	text-align: center;
	font-size: x-small;
	padding: 15px 15px 15px 15px;
	
}
.report_title
{
	width: 100%;
	text-align: center;
	font-size: medium;
	padding: 15px 15px 15px 15px;
	
}
.report_toolbar_table
{
	margin: 10px 10px 10px 10px;
}
.report_toolbar_cell
{
	padding: 10px 10px 10px 10px;
	vertical-align: middle;
}

/*SUMMARY REPORTS*/



.half_width_panel
{
	/*PADDING top,right,bottom,left*/
	width: 430px;
}
.pair_charts_panel
{
	/*PADDING top,right,bottom,left*/
	width: 380px;
}
.pad_left
{
	padding-left: 7px;
}
.pad_right
{
	padding-right: 7px;
}
.pad_bottom
{
	padding-bottom: 10px;
}
.table_no_padding
{
	padding: 0px 0px 0px 0px;	
	border-collapse:collapse;
	margin: 0px 0px 0px 0px;
}


/*FONT SIZING*/
.font_xsmall
{
	font-size: x-small;
}
.font_small
{
	font-size: small;
}

/*ALIGNING*/
.align_right
{
	text-align:right;
}
.align_left
{
	text-align:left;
}
.align_left
{
	text-align:left;
}
.align_top
{
	vertical-align:text-top;
}
.align_bottom
{
	vertical-align:text-bottom;
}
.align_middle
{
	text-align:center;
	vertical-align:middle;
}


/*SIZE*/
.width_100_percent
{
	width:100%;
}
.width_300_pixels
{
	width : 300px;
}
.width_100_pixels
{
	width : 200px;
}
.height
{
	height: 2px;
}

/*BORDER*/
.border_blue
{
	border:  solid 2px blue;
}
.border_red
{
	border:  solid 2px red;
}
.border_black
{
	border:  solid 2px black;
}

/*Font*/
.Title_Font
{
	font-family:Courier;
	font-size :large;
}