/* a questionblock */
.qblock{ /* CSS\QB */
	padding-left: 10px;
	width: 95%;
}

/* combination of checkbox/radiobutton (CSS\CHOI_CNTR) and the text (CSS\CHOI_CAP) CSS\CHOI_OPT */
span.choiceoption{
	width: 100%;
	vertical-align: top;
}

p.choiceoption{
	width: 100%;
	vertical-align: top;
}

/* the text belonging to a checkbox or radiobutton */
.choicecaption{
	vertical-align: top;
	margin-right: 5px;
	width: 80%;
}

/* checkbox and radiobutton */
span.choicecontroller{
	width: 25px;
	display: inline-block;
}

span.choicesum{ /* CSS\CHOI_SUM*/
	width: 15%;
	display: inline-block;	
}

/* part of a questionblock, includes the answer! */
span.question{ /* CSS\QB_QST */
	margin-bottom: 4px;
	display: block;
}

/* text after the numeric answer, e.g. '%' */
span.postfixspan{
	padding-left: 5px;
}

/* the actual question */
/* CSS\QB_LBL */
.qblock span.questionlabel{
	width: 50%;
	display: inline-block;
	vertical-align: top;
}

/* 
text in front of the numeric answer, e.g. 'EURO'
please note that this span is part of the questionlabel and not of the answer; 
this way the boxes align with other answers but if the questionlabel is too long it will move to bottom of the span !! 
probably needs other solution 
*/
span.questionlabel span.prefixspan{
	vertical-align: top;
	text-align: right;
	padding-right: 5px;
	padding-left: 5px;
	float: right;
}

/* the span containing the answer */
.qblock span.answer{
	width: 50%;
	display: inline-block;
}

/* for the description of the question ... strange as the question does not have a description property !! */
.qblock span.questiondescr{
	width: 90%;
	display: block;
	vertical-align: top;
	margin-left: 10px;
}

/* for the actual question in those cases that the questionlabel is used for listitems and so on */
.qblock span.questionheader{ /* CSS\QST_HDR*/
	width: 90%;
	padding-left: 10px;
	display: block;
	vertical-align: top;
	font-weight: bold;
	padding-bottom: 10px;	
}

/* 
if the answer is a series of radiobuttons that we want to show horizontally instead vertically 
probably an older attempt as inline is the default display anyway 
to check added the colours... 
*/
.answer .horizontal{
	vertical-align: top;
	display: inline;
	text-decoration-color: #00EEEE;
	background-color: #OOEEEE;
}

/* making checkbox/radiobuttons appear below each other */
.vertical span.choiceoption{
	vertical-align: top;
	display: block;
}

/* 
as the 'standard' view is to have the question and answer appear next to each other:
if the span with class question also has the class vertical questionlabels will appear below each other (full width of the screen instead of 50%)
*/
.question.vertical > span.questionlabel{
	display: block;
	width: 100%;	
}

/* see above [.question.vertical > span.questionlabel]; but for the answers */
.question.vertical > span.answer{
	display: block;
	width: 100%;
}

/* see above [.question.vertical > span.questionlabel]; but for the answers ... superflous ?*/
.question.vertical > span.answer.vertical{
	display: block;
	width: 100%;
}


/* 
the standard question-answer relation is 50% of the width of the screen; when only one set is shown, it may be better to have an 80/20 relation, e.g.:
 * when questionset with small space needed for answer is shown per tab;
 * when screen is divided into two (vertically) with left hand side current and right hand side previous year -
		otherwise the question only has less than 25% of the screen width
 * onset can be added to some questiontypes' qblock classes by setting render_array key REN\MV2RGT to true (see PD07, EP13))
*/
/* CSS\QB_EDT */
.qblock.edit.oneset > span.question > span.questionlabel{
	width: 80%;
}

/* see above [.qblock.edit.oneset > span.question > span.questionlabel] but for the answer bit */
.qblock.edit.oneset > span.question span.answer{
	width: 20%;
}

.qblock.view.oneset > span.question > span.questionlabel{
	width: 80%;
}

/* see above [.qblock.edit.oneset > span.question > span.questionlabel] but for the answer bit */
.qblock.view.oneset > span.question span.answer{
	width: 20%;
}

.answertabs{
	padding-left: -10px;
	width: 100%
}

.answertabs > span.answer{
	width: 60%;
}

.answertabs > span.questionlabel{
	width: 30%;
}


.tempclass1{
	margin-left: 10px;
	display: inline-block;
}


.tempclass2{
	margin-left: 10px;
	display: block;
}

.tempclass3{
	vertical-align: top;
	margin-right: 10px;
}

.tempclass4{
	vertical-align: top;
	display: block;
}



/* temp. here: for linking activities to a plan's action'*/

#sortable1, #sortable2 {
	border: 1px solid #888;
	width: 222px;
	min-height: 20px;
	list-style-type: none;
	margin: 0;
	padding: 5px 0 0 0;
	float: left;
	margin-right: 10px;
}

#sortable1 li, #sortable2 li {
	margin: 0 5px 5px 5px;
	padding: 5px;
	width: 200px;
}



.planactionselected{
	font-weight: bold;
}

/*.ui-state-default{
	color: #6AAC42;
	background: #ffffff;
}

.ui-state-highlight{
	color: #6AAC42;
	border: #9BC777;
	background: #E6E6E6;
}*/

.speakicon{
	display: inline-block;
}

h1.objectiveheader{
	margin-top: 10px;
}


div.row div{
	vertical-align: top;
}