﻿/***************************************************************************************
*                                           										   *
*								   fontandcolour.css								   *
*								-----------------------								   *
*																					   *
*	This file defines the font choice and all colours used in Cubiks Online.		   *
*																					   *
*	FONTS																			   *
*	-----																			   *
*																					   *
*	The fonts have been split up into two sections:									   *
*	1.	All non-timed assessment fonts												   *
*	2.	Timed assessment fonts (Problem Solving, RfB)								   *
*																					   *
*																					   *
*	COLOURS																			   *
*	-------																			   *
*																					   *
*	The colours have been split up into three sections:								   *
*	3.	All non-assessment colours													   *
*	4.	Non-timed assessment colours (CIPQ, CTRQ, MRA AND PAPI)						   *
*	5.	Ipsative MRA                                                                   *
*   6.  Timed assessment colours (Problem Solving, RfB)								   *
*																					   *
*	Of these, the 'all non-assessment' and 'non-timed assessment' colour sections have *
*	been split into 16 individual different colour groupings. These groups are ignored *
*	by the optimised default Cubiks colour set, but they do relate to the colours used *
*	for lite branded clients where all the selectors in each colour group are assigned * 
*	just one colour only.															   *
*																					   *	
*	These 16 groupings have been split into 3 sections:                                *
*	1.	8 user selection colours picked on the branding screen in Cubiks Online		   *
*	2.	4 auto generated colours based on the 8 user selected colours				   *
*          (not really auto-generated, the user picks them on AGroupBrand)             *
*   3.  4 truely-auto-generated colours for MRA-i                                      *
*																					   *	
*	USER SELECTION 1																   *
*		Main background colour														   *
*       CTRQ gap between horizontal rows of radio buttons                              *
*	USER SELECTION 2																   *
*		Side panel background colour and border colour								   *
*	USER SELECTION 3																   *
*		Menu, copyright and table header and footer background colour				   *
*	USER SELECTION 4																   *
*		Navigation bar background colour											   *
*	USER SELECTION 5																   *
*		Main page, navigation bar, button, link and error font colour				   *
*		MRA, CIPQ and PAPI assessment question text	colour							   *
*		CTRQ table header font colour												   *
*	USER SELECTION 6																   *
*		Menu, copyright and table header and footer font colour						   *
*	USER SELECTION 7																   *
*		Table row, button hover, input and message box background colour			   *
*		CTRQ table panel colour														   *
*	USER SELECTION 8																   *
*		Table alternate row, button and disabled button background colour			   *
*	AUTO-GENERATED 1																   *
*		Table row highlight background colour										   *
*	AUTO-GENERATED 2																   *
*		Table alternate row highlight background colour								   *
*	AUTO-GENERATED 3																   *
*		Second level table heading and disabled button font colour					   *
*	AUTO-GENERATED 4																   *
*		Hover font colour															   *
*		MRA, CIPQ and PAPI assessment question hover font colour					   *
*   AUTO-GENERATED-IPSATIVE 1                                                          *
*       MRA-i accessible mode, strength row (US7 hue pushed to green)                  *
*   AUTO-GENERATED-IPSATIVE 2                                                          *
*       MRA-i accessible mode, strength row Alt (US8 hue pushed to green)              *
*   AUTO-GENERATED-IPSATIVE 3                                                          *
*       MRA-i accessible mode, weakness row (US7 hue pushed to green)                  *
*   AUTO-GENERATED-IPSATIVE 4                                                          *
*       MRA-i accessible mode, weakness row Alt (US8 hue pushed to green)              *
*																					   *
***************************************************************************************/



/***************************************************************************************
*				             1. ALL NON-TIMED ASSESSMENT FONTS						   *
***************************************************************************************/

/* All font sizing in ems. This will change the font for the whole site */
body
{	
	font-size: 75%;	
	font-family: tahoma, arial, helvetica, verdana, sans-serif;
}

/* Monospaced font used on screen to preview email contents */
.emailtext { font-family: Courier, Courier New, Andale Mono, Monospace; }



/***************************************************************************************
*				     2. TIMED ASSESSMENT FONTS (PROBLEM SOLVING, RFB)				   *
***************************************************************************************/

/* The font-size setting below relates to the font-size value on the body selector above.
In order to work out the original Cubiks branding font size, use the following formula:
(75 / BFS) x 100 where BFS is the body font-size set above */
#flasWrapper #master_contentBody
{
	font-size: 100%;
	font-family: tahoma, arial, helvetica, verdana, sans-serif;
}



/***************************************************************************************
*							  3. ALL NON-ASSESSMENT COLOURS							   *
***************************************************************************************/

/* -------------------------------- USER SELECTION 1 -------------------------------- */
/* body background */
#wrapperSmall,
#wrapperLarge,
#logoWrapper,
#master_logoBody,
#master_contentBody,
#menuNavBorderTop,
#menuNavBorderBottom { background-color: #FFFFFF; }

/* jQuery */
.ui-widget-content { background-color: #FFFFFF; }


/* -------------------------------- USER SELECTION 2 -------------------------------- */
/* stretchy panel background */
body { background-color: #EBEBDF; }

/* input control borders */
table .textbox { border-color: #C1C199; }
.textbox,
.input,
.dropdownlist { border-color: #D6D6C0; }

/* button borders */
.buttonGroup a,
.buttonGroup span span { border-color: #333333; }

/* message box borders */
.errorBox { border-color: #A52300; }
.warningBox, 
.infoBox { border-color: #333333; }

/* other borders */
fieldset { border-color: #D6D6C0; } 
table { border-color: #333333; } 

/* jQuery */
.ui-state-active,
.ui-state-default,
.ui-state-focus,
.ui-state-highlight,
.ui-state-hover,
.ui-widget-content,
.ui-widget-content .ui-state-active,
.ui-widget-content .ui-state-default,
.ui-widget-content .ui-state-focus,
.ui-widget-content .ui-state-highlight,
.ui-widget-content .ui-state-hover,
.ui-widget-header { border-color: #333333; }
.ui-state-error,
.ui-widget-content .ui-state-error { border-color: #A52300; }


/* -------------------------------- USER SELECTION 3 -------------------------------- */
/* menu background */
#menuWrapper { background-color: #A52300; }
#menuRoot ul { background-color: #333333; }

/* copyright background */
#footerSmall,
#footerLarge { background-color: #333333; }

/* table header and footer background */
thead tr,
thead th,
tfoot th,
.rowHeading,
.rowHeading td { background-color: #A52300; }

/* jQuery */
.ui-widget-header,
.ui-widget-shadow { background-color: #A52300; }
.ui-widget-overlay { background-color: #333333; }


/* -------------------------------- USER SELECTION 4 -------------------------------- */
/* navigation bar background */
#menuNav,
#navWrapper { background-color: #D6D6C0; }

/* jQuery */
.ui-state-active,
.ui-widget-content .ui-state-active { background-color: #E73D05; }


/* -------------------------------- USER SELECTION 5 -------------------------------- */
/* body font */
body { color: #333333; }

/* navigation bar font */
#master_navBody p,
#master_navBody ul li a { color: #333333; }

/* button and link font */
a { color: #A52300; }

/* error font */
.errorBox,
.errorLabel { color: #A52300; }

/* jQuery */
.ui-state-highlight,
.ui-state-highlight a,
.ui-widget-content,
.ui-widget-content a,
.ui-widget-content .ui-state-highlight,
.ui-widget-content .ui-state-highlight a { color: #333333; }
.ui-state-default,
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
.ui-state-error,
.ui-state-error a,
.ui-state-error-text,
.ui-widget-content .ui-state-default,
.ui-widget-content .ui-state-error,
.ui-widget-content .ui-state-error a,
.ui-widget-content .ui-state-error-text { color: #A52300; }


/* -------------------------------- USER SELECTION 6 -------------------------------- */
/* menu font */
#menuRoot ul a,
#menuRoot li a,
#master_menuBody { color: #FFFFFF; }

/* copyright font */
#master_copyrightBody p { color: #FFFFFF; }

/* table header and footer font */
thead tr,
thead th,
tfoot th,
thead a,
tfoot a,
.rowHeading a,
.rowHeading,
.rowHeading td { color: #FFFFFF; }

/* jQuery */
.ui-state-active,
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited,
.ui-widget-content .ui-state-active,
.ui-widget-header,
.ui-widget-header a { color: #FFFFFF; }


/* -------------------------------- USER SELECTION 7 -------------------------------- */
/* table row background */
tbody .row,
tbody .row td { background-color: #EBEBDF; }

/* button hover background */
.buttonGroup a:hover { background-color: #EBEBDF; }
                       
/* input control background */
.textbox,
.input,
.dropdownlist { background-color: #FFFFFF; }

/* error, info and warning box background */
.errorBox,
.infoBox,
.warningBox { background-color: #D6D6C0; }

/* jQuery */
.ui-state-default,
.ui-state-error,
.ui-widget-content .ui-state-default,
.ui-widget-content .ui-state-error { background-color: #D6D6C0; }
.ui-state-focus,
.ui-state-hover,
.ui-widget-content .ui-state-focus,
.ui-widget-content .ui-state-hover { background-color: #EBEBDF; }


/* -------------------------------- USER SELECTION 8 -------------------------------- */
/* table rowAlt background */
tbody .rowAlt,
tbody .rowAlt td { background-color: #D6D6C0; }

/* button background */
.buttonGroup a { background-color: #D6D6C0; }


/* -------------------------------- AUTO GENERATED 1 -------------------------------- */
/* table row highlight background */
tbody .row .highlight,
tbody .row .highlight td { background-color: #EB9797; }


/* -------------------------------- AUTO GENERATED 2 -------------------------------- */
/* table rowAlt highlight background */
tbody .rowAlt .highlight,
tbody .rowAlt .highlight td { background-color: #D68989; }

/* table rowSection highlight background */
tbody .rowSection .highlight,
tbody .rowSection .highlight td { background-color: #D68989; }


/* -------------------------------- AUTO GENERATED 3 -------------------------------- */
/* table second level heading background */
tbody .rowSection,
tbody .rowSection td { background-color: #C1C199; }

/* for disabled buttons */
.buttonGroup span span,
.disabledLabel,
.disabledAnchor { color: #C1C199; }


/* -------------------------------- AUTO GENERATED 4 -------------------------------- */
/* menu hover font */
#menuRoot ul a:hover,
#menuRoot ul a:active,
#menuRoot ul a:focus { color: #E73D05; }

/* menu headings hover font */
#menuRoot li a:hover,
#menuRoot li a:active,
#menuRoot li a:focus { color: #FFFFFF; }

/* navigation bar hover font */
#master_navBody ul li a:hover { color: #E73D05; }

/* table header and footer hover font */
thead a:hover,
tfoot a:hover,
.rowHeading a:hover { color: #E73D05; }

/* button hover font */
.buttonGroup a:hover { color: #E73D05; }

/* link hover font */
a:hover { color: #E73D05; }

/* jQuery */
.ui-state-focus,
.ui-state-hover,
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-widget-content .ui-state-focus,
.ui-widget-content .ui-state-hover { color: #E73D05; }


/* ------------------------------- FIXED - NOT GOING TO CHANGE ---------------------- */
/* jQuery */
.ui-state-highlight,
.ui-widget-content .ui-state-highlight { background-color: transparent !important; }



/***************************************************************************************
*				4. NON-TIMED ASSESSMENT COLOURS (CIPQ, CTRQ, MRA AND PAPI)			   *
***************************************************************************************/

/* -------------------------------- USER SELECTION 1 -------------------------------- */
/* CTRQ gap between horizontal rows of radio buttons */
.questionnaire tbody .rowAlt .horizontal,
.questionnaire tbody .rowAlt td .horizontal,
.questionnaire tbody .row .horizontal,
.questionnaire tbody .row td .horizontal { border-top-color: #FFFFFF; border-bottom-color: #FFFFFF; }

/* MRA-i */
#tip { background-color: #FFFFFF; }


/* -------------------------------- USER SELECTION 2 -------------------------------- */
/* MRA-i */
.ui-state-highlight, .ui-widget-content .ui-state-highlight { border-color: #A52300; }


/* -------------------------------- USER SELECTION 5 -------------------------------- */
/* CTRQ table header */
.questionnaire thead th,
.questionnaire thead tr { color: #333333; }

/* MRA, CIPQ and PAPI assessment question text */
.assessmentAnswers { color: #A52300; }

/* MRA-i */
#boxA,
#boxB { border-color: #333333; }
#tip { border-color: #333333; }
.ui-state-default { color: #333333; }
.sort-auto { border-color: #D6D6C0; }


/* -------------------------------- USER SELECTION 7 -------------------------------- */
/* CTRQ table panels */
.questionnaire tbody .rowAlt .vertical,
.questionnaire tbody .rowAlt td .vertical,
.questionnaire tbody .row .vertical,
.questionnaire tbody .row td .vertical { background-color: #EBEBDF; }
.questionnaire tbody .rowAlt .horizontal,
.questionnaire tbody .rowAlt td .horizontal,
.questionnaire tbody .row .horizontal,
.questionnaire tbody .row td .horizontal { background-color: #EBEBDF; }


/* -------------------------------- AUTO GENERATED 4 -------------------------------- */
/* MRA, CIPQ and PAPI assessment question hover font */
.assessmentAnswers label:hover { color: #E73D05; }


/* ------------------------------- FIXED - NOT GOING TO CHANGE ---------------------- */
/* CTRQ table header */
.questionnaire thead th,
.questionnaire thead tr { background-color: transparent; }

/* CTRQ table body */
.questionnaire tbody .rowAlt,
.questionnaire tbody .rowAlt td,
.questionnaire tbody .row,
.questionnaire tbody .row td { background-color: transparent; }


/***************************************************************************************
*				    5. IPSATIVE MRA                                                    *
***************************************************************************************/

/* ---------------------------- AUTO GENERATED IPSATIVE 1 --------------------------- */
.imraStrength
{ background-color: #DFEBDF !important; }

/* ---------------------------- AUTO GENERATED IPSATIVE 2 --------------------------- */
.imraStrengthAlt
{ background-color: #C0D6C0 !important; }

/* ---------------------------- AUTO GENERATED IPSATIVE 3 --------------------------- */
.imraWeakness
{ background-color: #EBDFDF !important; }

/* ---------------------------- AUTO GENERATED IPSATIVE 4 --------------------------- */
.imraWeaknessAlt
{ background-color: #D6C0C0 !important; }

/***************************************************************************************
*				    6. TIMED ASSESSMENT COLOURS (PROBLEM SOLVING, RFB)				   *
***************************************************************************************/

/* main page background */
#flasWrapper #master_contentBody,
#flasWrapper #wrapperLarge
/*{{TA1}}*/{ background-color: #FFFFFF; }

/* main page font */
#flasWrapper #master_contentBody
/*{{TA2}}*/{ color: #333333; }

/* fieldset border */
#flasWrapper #master_contentBody fieldset
/*{{TA3}}*/{ border-color: #D6D6C0; }

/* navigation button background */
#flasWrapper #master_contentBody .buttonGroup a
/*{{TA4}}*/{ background-color: #D6D6C0; }

/* navigation button hover background */
#flasWrapper #master_contentBody .buttonGroup a:hover
/*{{TA5}}*/{ background-color: #EBEBDF; }

/* navigation button font */
#flasWrapper #master_contentBody a
/*{{TA6}}*/{ color: #A52300; }

/* navigation button hover font */
#flasWrapper #master_contentBody .buttonGroup a:hover
/*{{TA7}}*/{ color: #E73D05; }

/* information box and warning box background */
#flasWrapper #master_contentBody .infoBox,
#flasWrapper #master_contentBody .warningBox
/*{{TA8}}*/{ background-color: #D6D6C0; }

/* information box, warning box, navigation button, option button and navigation grid border */
#flasWrapper #master_contentBody .infoBox,
#flasWrapper #master_contentBody .warningBox,
#flasWrapper #master_contentBody .buttonGroup a, 
#flasWrapper #master_contentBody .flasOptionRow li.example a,
#flasWrapper #master_contentBody .flasOptionRow li a,
#flasWrapper #master_contentBody .flasGridRow li.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li a
/*{{TA9}}*/{ border-color: #333333; }

/* option buttons and navigation grid unanswered background */
#flasWrapper #master_contentBody .flasOptionRow li.example a:hover,
#flasWrapper #master_contentBody .flasOptionRow li a,
#flasWrapper #master_contentBody .flasGridRow li.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li a
/*{{TA10}}*/{ background-color: #FFFFFF; }

/* option buttons and navigation grid unanswered font */
#flasWrapper #master_contentBody .flasOptionRow li.example a:hover,
#flasWrapper #master_contentBody .flasOptionRow li a,
#flasWrapper #master_contentBody .flasGridRow li.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li a
/*{{TA11}}*/{ color: #A52300; }

/* navigation grid current question background */
#flasWrapper #master_contentBody .flasGridRow li.current.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.current a
/*{{TA12}}*/{ background-color: #EBEBDF; }

/* navigation grid current question font */
#flasWrapper #master_contentBody .flasGridRow li.current.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.current a
/*{{TA13}}*/{ color: #A52300; }

/* option buttons and navigation grid hover background */
#flasWrapper #master_contentBody .flasOptionRow li a:hover,
#flasWrapper #master_contentBody .flasOptionRow li.selected a:hover,
#flasWrapper #master_contentBody .flasGridRow li a:hover,
#flasWrapper #master_contentBody .flasGridRow li.current a:hover,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered a:hover,
#flasWrapper #master_contentBody .flasGridRow li.answered a:hover
/*{{TA14}}*/{ background-color: #E73D05; }

/* option buttons and navigation grid hover font */
#flasWrapper #master_contentBody .flasOptionRow li a:hover,
#flasWrapper #master_contentBody .flasOptionRow li.selected a:hover,
#flasWrapper #master_contentBody .flasGridRow li a:hover,
#flasWrapper #master_contentBody .flasGridRow li.current a:hover,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered a:hover,
#flasWrapper #master_contentBody .flasGridRow li.answered a:hover
/*{{TA15}}*/{ color: #FFFFFF; }

/* option buttons and navigation grid answered background */
#flasWrapper #master_contentBody .flasOptionRow li.selected.example a:hover,
#flasWrapper #master_contentBody .flasOptionRow li.selected a,
#flasWrapper #master_contentBody .flasGridRow li.answered.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.answered a,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered a
/*{{TA16}}*/{ background-color: #A52300; }

/* option buttons and navigation grid answered font */
#flasWrapper #master_contentBody .flasOptionRow li.selected.example a:hover,
#flasWrapper #master_contentBody .flasOptionRow li.selected a,
#flasWrapper #master_contentBody .flasGridRow li.answered.example a:hover,
#flasWrapper #master_contentBody .flasGridRow li.answered a,
#flasWrapper #master_contentBody .flasGridRow li.currentAnswered a
/*{{TA17}}*/{ color: #FFFFFF; }

/* diagrammatic assessment example answer font */
#flasWrapper #master_contentBody .flasOptionRow .diagrammaticExampleAnswer
/*{{TA18}}*/{ color: #A52300; }
