/******************************************************************************
 * This file should contain all css common to the nodechain extension.
 * The file should be loaded by all pages.
 * All values should be regardless of screen size.
 */

/******************************************************************************
 * DOCUMENT
 */

/*
	master font size , all other should relate to this one
	allows the base font-size of specific content
	to be independent from the rest of the website
*/
.nodechain-document-container {
	font-size: 14px;
}

/* allows children to use % to manage font size relative to parent */
.nodechain-document {
	font-size: 100%;
    position:relative;
}

.nodechain-clearfix:before{
    display: table;
    content: " ";
}
.nodechain-clearfix:after{
    clear: both;
    display: table;
    content: " ";
}

/* for use with <span> to avoid splitting words on multiple lines */
.nodechain-document .nowrap {
	white-space: nowrap;
}

/* horizontal line */
.nodechain-document .dividor {
	border: none;
	height: 2px;
	background-color: black;
}

/* put a bullet sign in front of a paragraph */
.nodechain-document .bullet:before {
    content: '\2022\a0\a0';
}

.nodechain-document p {
   position:relative;	
}

/* used to resize large images to fit when printing */
/* override setting from template */
/* put width or height in parent div element */
.img-inherit {
	height: inherit;
	width: inherit;
}

/******************************************************************************
 * PRINTING
 */

/* printer preview button that appears on top of the content or index page */
.printer-preview-button {
	display: block;
	width:100%;
	text-align:left;
	visibility:visible;
}
.printer-preview-button a {
	display:block;
	font-size:18px;
}

/* printer button that appears on top of the print preview */
.printer-button {
	display: block;
	width:100%;
	text-align:center;
	visibility:visible;
}
.printer-button a {
	display:block;
	font-size:18px;
	line-height:25px;
	margin-top:20px;
}



/******************************************************************************
 * Question and Answer
 */

/*
	Number of QandA's next to the icon
	version 3.4.1
*/
.QandA_count {
    font-weight: normal;
}

/*
	QandA Form container
*/
#QandA_form_container {
	display: none;
	width:100%;
	background-color: #f0f0f0;
	border: 2px solid black;
	margin-top: 15px;
	margin-bottom: 10px;
	margin-right: 2px;
	width: 99%
}
#QandA_form_container_inner {
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 15px;
	padding-right: 15px;
}

#QandA_form_title_create, #QandA_form_title_edit {
	display: none;
}

/*
	Q&A Form textarea
*/
.QandAform_textarea_field {
	width: 100%;
}

/*
	Q&A Form text
*/
.QandAform_text_field {
	width:40px;
	height:25px !important;
}

/*
	Visualise individual nodes so the user can clearly distinguish between them
	in order to select the node he wants to add a QandA for.
	version 3.4.1
*/
.QandA_visualise_node {
	background-color:#00FF33;
}
.QandA_selected_node {
	background-color:#00FF33;
	border: 2px solid black;
}

.QandA_form_button {
	float: right;
	margin-bottom: 15px;
	margin-right: 15px;
}

/*
	add question box for message and cancel button
	TODO improve visual appearence
	version 3.4.1
*/
.createQandA_message_box {
	display:none;
    width: 38%;
    margin: 0 auto;
    position: fixed;
    top: 5px;
    left: 0;
    right: 0;
	background-color: #00FF33;
	padding: 5px;
	z-index: 1;
}

/*
	add question actual message
	version 3.4.1
*/
.createQandA_message_box_message {
	display: inline-block;
	width: 100%;
	padding-top:5px;
	text-align: center;
}

/*
	version 3.4.1
*/
.createQandA_message_box_button {
	width: 100%;
	text-align: center;
	padding: 10px;
}

/*
	version 3.4.1
*/
.createQandA_cancel_nutton {
}

/*
	version 3.4.1
*/
.QandA_selectable_node {
	display: block;
}

/*
	version 3.4.1
*/
.QandA_popup_table_container {
	width: 100%;
	display: table;
}
.QandA_popup_table {
	padding: 3px;
	border-spacing: 2px;
	border:0;
}

.QandA_table_head {
	text-align: left;
}
/*

*/
.QandA_table_question, .QandA_table_answer {
	width: 50%;
	min-width: 50%; /* does not work ? */
	vertical-align: top;
	text-align: left;
}
.QandA_table_edit, .QandA_table_delete {
	width: 1%;
	vertical-align: top;
	text-align: left;
}
.QandA_table_edit_button, .QandA_table_delete_button {
	
}
.QandA_table_row {
	border-bottom: 1px solid #f1f1f1;
}



















/* Selftest Page */
.nodechain-document-selftest-row {
	margin-top:20px;
	margin-bottom:20px;
}
.nodechain-document-score-box p, .nodechain-document-question-num-box p{
	margin-bottom:0px;
	padding-bottom:0px;
}
.nodechain-document-score-box h4{
	margin-top:0px;
	padding-top:0px;
	margin-bottom:5px;
	padding-bottom:0px;
}
.nodechain-document-selftest-question {
	width:auto;
	height:50px;
	padding:10px;
	display:block;
	margin-bottom:10px;
	border:1px solid #000;
}
.nodechain-document-selftest-score-field-box {
	margin-top:10px;
	margin-bottom:10px;
}
.nodechain-document-selftest-score-field-box input[type="text"]{
	margin-bottom:0px;
}
.nodechain-document-selftext-score-field {
	width:40px !important;
	height:26px !important;
	padding-top:0px !important;
	padding-bottom:0px !important;
}
/*
 *
 *****************************************************************************/



.nodechain_valid_tooltip img {
    margin-right: 5px;
	margin-top:-3px;
}
.nodechain_sub_branch p a {
    margin-left: -24px !important;
}
