/************************************************************************************************
*																								*
*	qbuilder/css/template_qbuilder.css															*
*	22/06/04 - CM																				*
*																								*
*	Stylesheet template for qbuilder to be used in different sites. Defaults are specified		*
*	in qbuilder.css so these are overriding styles.	Also see qbuilder/common/common_init.php	*
*	for qboptions which can also control layout.												*
*																								*
*************************************************************************************************/

/*********************** Page Layout ***********************/

/* qBuilder main table layout style - should contain font settings and border-collapse.
   width and alignment can also be defined in directives 'qb_overall_align' and 'qb_total_width' */
.qb_main_table {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	border-collapse:collapse;	
}
/* Answer block (the grid/listing section below a question) style - should contain font settings and border-collapse */
.qb_answerblock{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	border-collapse:collapse;
}
/* Cell containing answer block */
.qb_answerblock_holder {
	padding-left:20px;
}
/* Header style for page */
.qb_header {
	font-size:10pt;
	font-weight:bold;
	
}
/* Question number
   alignment can also be defined in directive 'qb_question_number_align' */
.qb_question_number {}
/* Cell holding the page number */
.qb_page_num_holder {}


/*********************** Progress Bar  ***********************/

/* The style for the progress bar text */
.qb_progress_text {
	color:#000000;
	font-weight:bold;
}
/* The style for the actual progress bar. This is a div block so can contain an image (specified as a background) or a block of color (also as a bg) */
.qb_progress_bar {
	background-color:#CEE9FF; 
}
/* The outer container cell for the progress bar */
.qb_progress_container {
	border:1px solid #5999E8;
}


/************************* Buttons ************************/
/* Styles for any image buttons in the form, for when the button is off, on or pressed */
.qb_form_button_off {
	margin:1px;
}
.qb_form_button_on {
	margin:0px;
	border:1px solid #000000;
}
.qb_form_button_press {
	margin:0px;
	border:1px solid #FF8C19;
}

/* Style for an HTML based button (only used if draw mode is QB_DRAW_PLAIN) */
.qb_form_button {
	font-family:Tahoma, Arial, Helvetica, sans-serif;
	background-color:#FF8C19;
	font-size:7pt;
	vertical-align:middle;
	text-align:left;
	color:#FFFFFF;
	border:1px solid #FFFFFF;
	padding-left:2px;
	padding-right:2px;	
}

/************************* Questions ************************/

/* --------- Layout  */

/* Question text. If more precise spacing between questions is required placing padding-top/bottom here.
   width and alignment can also be defined in directives 'qb_question_width' and 'qb_question_align' */
.qb_question_text {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	font-weight:bold;
	border-bottom:1px solid #89C9F8;
	padding-top:15px;
}
/* Style for questions that were missed when server-side validation (QB_VALIDATE_SERVERONLY) is used
   width and alignment can also be defined in directives 'qb_question_width' and 'qb_question_align' */
.qb_question_text_missed {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	font-weight:bold;
	border-bottom:1px solid #89C9F8;
	padding-top:15px;
	color:#FF0033;
}

/* --------- Text boxes (includes multiple choice other text) */
/* Style for HTML text boxes */
.qb_text {
	border:1px solid #89C9F8;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	padding-left:2px;
}
/* Style for cell containing text boxes */
.qb_text_holder {}
/* Style for text box when its disabled */
.qb_text_disabled {
	border:1px solid #89C9F8;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	padding-left:2px;
	background-color:#E9E9FE;
}
/* Style for a prefix that goes in front of a text box */
.qb_text_prefix {}

/* --------- Options (Radio) */

/* Style for the an HTML radio button (only used if draw mode is QB_DRAW_PLAIN) */
.qb_option {}
/* Style for the text for an option (radio button) */
.qb_option_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* Style for the cell containing an option (radio button) */
.qb_option_holder {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
}
/* In grid questions, this is the style for text for options going down the page */
.qb_option_vert_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* In grid questions, this is the style for text for options going accross the page */
.qb_option_horiz_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}
/* Row colours for alternating rows in a list of options (radio buttons) */
.qb_option_row_1 {
	color:#000000;
}
.qb_option_row_2 {
	color:#000000;
}
/* Style for missed rows */
.qb_option_missed_vert_text {
	color:#FF0033;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;	
}

.qb_option_section_head {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	font-weight:bold;
}

/* --------- Check boxes */

/* Style for the an HTML checkbox (only used if draw mode is QB_DRAW_PLAIN) */
.qb_check {}
/* Style for the text for a checkbox */
.qb_check_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* Style for the cell containing a checkbox */
.qb_check_holder {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
}
/* In grid questions, this is the style for text for checkboxes going down the page */
.qb_check_vert_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* In grid questions, this is the style for text for checkboxes going accross the page */
.qb_check_horiz_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}
/* Row colours for alternating rows in a list of options (checkboxes) */
.qb_check_row_1 {
	color:#000000;
}
.qb_check_row_2 {
	color:#000000;
}
/* Style for missed rows */
.qb_check_missed_vert_text {
	color:#FF0033;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;	
}

.qb_check_section_head {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	font-weight:bold;
}

/* --------- Matrix Options (Radio) */

/* Style for the an HTML radio button (only used if draw mode is QB_DRAW_PLAIN) */
.qb_matrix_option {}
/* Style for the text for an option (radio button) 
.qb_option_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}*/
/* Style for the cell containing an option (radio button) */
.qb_matrix_option_holder {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
}
/* In matrix questions, this is the style for text for options going down the page */
.qb_matrix_option_vert_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* In matrix questions, this is the style for text for options going accross the page */
.qb_matrix_option_horiz_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}
/* Row colours for alternating rows in a list of options (radio buttons) */
.qb_matrix_option_col_1 {
	color:#000000;
}
.qb_matrix_option_col_2 {
	color:#000000;
	background-color:#FAFAFA;	
}
/* Style for missed rows */
.qb_matrix_option_missed_horiz_text {
	color:#FF0033;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;	
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}

.qb_matrix_option_section_head {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	font-weight:bold;
}

/* --------- Matrix Check boxes */

/* Style for the an HTML checkbox (only used if draw mode is QB_DRAW_PLAIN) */
.qb_matrix_check {}
/* Style for the text for a checkbox 
.qb_check_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* Style for the cell containing a checkbox */
.qb_matrix_check_holder {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
}
/* In matrix questions, this is the style for text for checkboxes going down the page */
.qb_matrix_check_vert_text {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
}
/* In matrix questions, this is the style for text for checkboxes going accross the page */
.qb_matrix_check_horiz_text {
	padding:1px;	
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}
/* Row colours for alternating rows in a list of options (checkboxes) */
.qb_matrix_check_col_1 {
	color:#000000;
}
.qb_matrix_check_col_2 {
	color:#000000;
	background-color:#FAFAFA;
}
/* Style for missed rows */
.qb_matrix_check_missed_horiz_text {
	color:#FF0033;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;	
	text-align:center;
	padding-left:5px;
	padding-right:5px;
}

.qb_matrix_check_section_head {
	padding:1px;
	border-bottom:1px solid #B7CFD2;
	font-size:7pt;
	font-weight:bold;
}


/*  ---------  Date Controls */

/* The style for the actual row that holds the date controls */
.qb_date {
}

/* The style for the day/month/year text above the controls */
.qb_date_day_text {
	font-size:7pt;
	color:#377793;
}
.qb_date_month_text {
	font-size:7pt;
	color:#377793;
}
.qb_date_year_text {
	font-size:7pt;
	color:#377793;
}

/* The style for the actual day/month/year controls (day & month are drop-downs and year is textual) */
.qb_date_day {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
}
.qb_date_month {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
}
.qb_date_year {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
	border:1px solid #89C9F8;	
}

/* Style to indicate when the year box is disabled */
.qb_date_year_disabled {}

/*  ---------  Dropdown Controls */
/* Style for an HTML drop down box */
.qb_dropdown {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:8pt;
}
/* Style for the cell containing a dropdown */
.qb_dropdown_holder {}

/*  ---------  Misc */

/* Style used for horizontal lines */
.qb_hr {
	color:#203E59;
}
/* Style for text defined as an instruction */
.qb_instruction {
	color:#203E59;
	font-size:10pt;
}
/* Style for text defined as a note */
.qb_note {
	color:#203E59;
	font-weight:bold;
}

/*  ---------  Image */
/* Style for an Image */
.qb_image {
	border:1px solid #DED5CF;
}
/* Style for an Image Caption */
.qb_image_caption {}
/* Style for the cell holding the image */
.qb_image_holder {
	text-align:center;
	padding:3px;
}


.qb_rnk_unranked_list a {
    color: 000000;
}

.qb_rnk_ranked_list a {
    color: 000000;
}

.qb_rnk_holder

.qb_rnk_unranked_list, .qb_rnk_ranked_list {
	border:1px solid #203E59;
	font-size:8pt;	
	padding:3px;
	background-color:#FFFFFF;
}

.qb_rnk_button_holder {
	padding:2px;
	text-align:center;
}
.qb_rnk_button {
	background-color:#FF8C19;
	color:#FFFFFF;
	border:1px solid #FFFFFF;
	padding:0px;
	padding-left:3px;
	padding-right:3px;
	font-size:7pt;
}

.qb_rnk_item_sel, .qb_rnk_item_sel:hover, .qb_rnk_item_sel:visited, .qb_rnk_item_sel:active {
	text-decoration:none;
	background-color:#7777AA;
	color:#CCCCCC;
	padding-left:3px;	
	padding-right:3px;	
}

.qb_rnk_item_sel:hover {
	background-color:#0066CC;
	color:#CCCCCC;
}

.qb_rnk_item, .qb_rnk_item:hover, .qb_rnk_item:visited, .qb_rnk_item:active {
	text-decoration:none;
    color: #000000 !important;
	padding-left:3px;	
	padding-right:3px;	
}

.qb_rnk_item:hover {
	background-color:#0066CC;
	color:#CCCCCC !important;
}

.qb_video_holder {
	text-align:center;
	padding:3px;
}

.qb_video_link, .qb_video_link:hover, .qb_video_link:visited, .qb_video_link:active {
	color:#FF8C19;
	font-weight:bold;
}

.qb_video_link:hover {
	color:#203E59;
	text-decoration:none;
}

.qb_option_image_off {
	border:2px solid #ffffff;
}

.qb_option_image_on {
	border:2px solid #cc0066;
}

.qb_check_image_off {
	border:2px solid #ffffff;
}

.qb_check_image_on {
	border:2px solid #cc0066;
}

.qb_collage_holder {
	margin-left:auto;
	margin-right:auto;
	width:602px;
}

.qb_collage_image_highlight {
	border:2px solid #FFaaaa;
	margin:0px;
}

.qb_collage_image_highlight .qb_image {
	border:1px solid #aa2222;
	margin:0px;
}

.qb_collage_image .qb_image {
	border:2px solid #FFFFFF;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;	
	margin:0px;
}

.qb_thankyou_header {
	font-size:10pt;
	font-weight:bold;
}


/* Image hover stuff
*/
a.gridrow_image:active .gridrow_image_hover, a.gridrow_image:visited .gridrow_image_hover, a.gridrow_image:link .gridrow_image_hover {
	position:absolute; left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:none;
}

a.gridrow_image:hover .gridrow_image_hover {
	position:absolute; left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:block;
	font-weight:bold;

}

a.gridrow_image:active, a.gridrow_image:visited, a.gridrow_image:link, {
	color:#000000;
	border-bottom:1px dotted #aaaaaa;
}
a.gridrow_image:hover  {
	color:#ffffff;
	background-color:#cc0000;
}

a.gridrow_image_emulate .gridrow_image_hover {
	position:absolute;  left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:none;

}

a.gridrow_image_emulate_hover .gridrow_image_hover {
	position:absolute;  left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:block;

}

/* Image hover stuff for matrices
*/
a.matrixcol_image:active .matrixcol_image_hover, a.matrixcol_image:visited .matrixcol_image_hover, a.matrixcol_image:link .matrixcol_image_hover {
	position:absolute; left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:none;
	padding-top:25px;
}

a.matrixcol_image:hover .matrixcol_image_hover {
	position:absolute; left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:block;
	font-weight:bold;

}

a.matrixcol_image:active, a.matrixcol_image:visited, a.matrixcol_image:link, {
	color:#000000;
	border-bottom:1px dotted #aaaaaa;
}
a.matrixcol_image:hover  {
	color:#ffffff;
	background-color:#cc0000;
}

a.matrixcol_image_emulate .matrixcol_image_hover {
	position:absolute;  left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:none;

}

a.matrixcol_image_emulate_hover .matrixcol_image_hover {
	position:absolute;  left:500px; top:100px;
	margin-left:-50px;
	margin-top:10px;
	display:block;

}


/* Search question type */	
.qb_search_results {
	border: 1px solid #89C9F8;
	background-color: white;
	padding: 0;
	margin: 0;
	position: absolute;
	z-index: 10000;
	display: none;
	list-style: none;
	min-height:39px;
	max-height:350px;
	width:300px;
	overflow: auto;
	font-family: inherit;
	font-size:0.9em;
}

.qb_search_results li {
	padding: 2px 5px;
	white-space: nowrap;
	color: #101010;
	text-align: left;
}

.qb_search_over {
	cursor: pointer;
	background-color: #89C9F8;
}

.qb_search_match {
	text-decoration: underline;
	color: black;
	
}


/* End search question type */

/* Sliders */

.qb_slider_header_row th {
	text-align: center;
	font-size: 7pt;
	line-height: 9pt;
}

.qb_slider_row td, .qb_slider_row_other td {
	text-align: center;
}

.qb_slider_table {
	margin:0 !important;
	border-collapse:collapse;
}

.qb_slider_row_other .qb_option_holder{
	border:0;
	
}

.qb_slider_bg {
	border-left:1px solid #aaaaaf;
	border-right:1px solid #aaaaaf;
	height:22px;
	background: url(/public/qb/images/sliders/slider_range.gif) repeat-x !important;
	display:block;
	margin:1px 0;
	padding:0 !important;
	position: relative;
	margin-left:0px;
}

.qb_slider_button {
	height:22px;
	background:url(/public/qb/images/sliders/slider_button.gif) no-repeat;
	cursor:arrow;
	padding:0 !important;
	position:relative;
	width:11px;
}

.qb_slider_button_waiting {
	background:url(/public/qb/images/sliders/slider_button_waiting.gif) no-repeat !important;
}

.qb_slider_button_selected {
	background:url(/public/qb/images/sliders/slider_button_selected.gif) no-repeat !important;
}

th.qb_slider_firstcol {
	text-align: left;
}

#qb_next_button.qb_form_button {
	background: url(/public/qb/images/buttons/but_next_off.gif) no-repeat;
	float: right;
}

#qb_next_button.qb_form_button:hover {
	background: url(/public/qb/images/buttons/but_next_on.gif) no-repeat;
}

#qb_next_button.qb_form_button:active {
	background: url(/public/qb/images/buttons/but_next_on.gif) no-repeat;
}

#qb_back_button.qb_form_button {
	background: url(/public/qb/images/buttons/but_back_off.gif) no-repeat;
	float: left;
}

#qb_back_button.qb_form_button:hover {
	background: url(/public/qb/images/buttons/but_back_on.gif) no-repeat;
}

#qb_back_button.qb_form_button:active {
	background: url(/public/qb/images/buttons/but_back_on.gif) no-repeat;
}

#qb_finish_button.qb_form_button {
	background: url(/public/qb/images/buttons/but_finish_off.gif) no-repeat;
}

#qb_finish_button.qb_form_button:hover {
	background: url(/public/qb/images/buttons/but_finish_on.gif) no-repeat;
}

#qb_finish_button.qb_form_button:active {
	background: url(/public/qb/images/buttons/but_finish_on.gif) no-repeat;
}

.qb_form_button {
	width: 104px;
	height: 2;
	padding:24px 0 0 0;
	margin:0px;
	font-size:0;
	line-height:0;
	border:0;
}

.qb_form_button:active {
	background-position: 1px 1px !important;
}

/* Sorter */
.qb_sorted {
	border: 1px solid #999999;
	text-align:center;
	font-size: 15pt;
	font-weight: bold;
	vertical-align: middle;
	color: #999999;
	overflow: hidden !important;
	cursor: arrow;

}

.qb_sorted .qb_sorted_bg {
	position: relative;
	display: block;
	background-color: #bbccdd;
	zoom: 1;
	opacity: 0;
	filter:alpha(opacity=0);
	cursor: arrow;
}

.qb_sorted_text {
	position: relative;
}

.qb_sorted_holder {
	overflow: hidden;
	margin: auto;
	
}

.qb_unsorted_holder {
	clear:both;
	overflow:hidden;
	height: 0px;
	width: 0px;
	border:1px dotted #999999;
	background-color: #fefeff;
	margin: 10px 0;	
}

.qb_unsorted_holder .qb_hover_image {
	z-index: 100;
	opacity: 1;
	filter:alpha(opacity=100);
	width: auto;
	height: auto;
	border: 1px solid #999999;
}
/* Click Grid */

.qb_clickgrid_holder {
	padding: 0px;
	margin: 0px;
	list-style:none;
	background: url(/launch/client/default/images/blue_gradient.png) repeat-y;
	overflow: hidden;
	float: left;
}

.qb_clickgrid_hotcold {
	background: url(/launch/client/default/images/hot_cold.png) repeat-y;	
}

.qb_clickgrid_left_header, .qb_clickgrid_right_header {
	height: 45px;
	float: left;
	font-size: 9pt;
	vertical-align: middle;
	text-align:center;
	line-height: 12pt;
	padding: 10px 5px;
}

.qb_clickgrid_box {
	border: 1px solid #eeeeee;
	text-align:center;
	font-size: 15pt;
	font-weight: bold;
	vertical-align: middle;
	color: #eeeeee;
	cursor: pointer;
	position: relative;
	overflow: hidden !important;
}

.qb_clickgrid_selected {
	background-color: #7dd981;
	opacity: 0.6;
}

/* Word Concept */


.wc_holder {
	margin: 10px 40px;
	border: 1px solid #000000;
	background-color: #EEEEEE;	
	padding: 8px;
	color: black;
}

.wc_holder span {
	cursor: pointer;
}

.wc_idle {
	color: black;
}

.wc_hover {
	color: blue;	
}

.wc_chosen {
	color: red;
}

/* Drag and Drop Shopping Basket Multichoice */
.st_image_holder {
	float: left;
	margin: 10px;
	position: inherit;
	cursor: move;
}

.st_basket_back {	
	background: transparent url() no-repeat bottom;
	width: 100%;
	margin: 0px auto;
}

 .st_basket_front {
 	background: transparent url() no-repeat top left;
 	position: relative;
 	z-index: 100;
 }
 
 /* Grid-row Ranking question */
 
.rq_holder_left, .rq_holder_right {
	border: 1px solid #555555;
	margin: 20px;
	width: 229px;	  
	padding: 5px;
	float: left;
	background-color: #F4F4FF;	
}

.rq_holder_right {
	margin-left: 50px;
}

.rq_option {
	border: 1px solid #AAAAFF;
	padding: 3px 3px 3px 20px;
	margin: 2px;
	width: 200px;
	font-size: 14px;
	min-height: 22px;
	background: #CCCCFF url(http://www.tpoll.com/public/scriptlets/ranking/arrow.png) no-repeat 2px 6px;
	cursor: move;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

.rq_helper {
	border: 1px solid #AAAAFF;
	padding: 3px 3px 3px 20px;
	margin: 2px;
	background-color: #CCCCFF;
	width: 200px;
	opacity: 0.6;
	filter: alpha(opacity=60);
	min-height: 22px;	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;	
}

/* Drag and drop area concept */
.ddac_item_holder {
	border: 1px solid #000000;
	float: left;
	padding: 5px;
}

.ddac_drop_area {
	border: 1px solid #000000;
	float: left;
	margin-left: 50px;
	background: transparent url() no-repeat;
}

.ddac_item {
	padding: 3px;
	cursor: move;
	margin: 0px;
}

.ddac_item_drag {
	border: 1px dashed #FF0000;
	padding: 2px;
}