.question-tree-hide {
    display: none;
}

div[name=questionTreeEditorHeader] {
    display: inline-block;
    width: 100%;
    min-height: 75px;
}

div[name=questionTreeEditorTitle] {
    float: left;
}

div[name=questionTreeEditorToolbar] {
    float: right;
    margin-right: 8px;
    background-color: white;
    padding: 2px;
    border-radius: 2px;
}

div[name=questionTreeEditorToolbar].fixed {
    position: fixed;
    top: 0;
    right: 20px;
}

div[name=questionTreeEditorMessages] {
    color: red;
    position: relative;
    margin: 5px 0 5px 0;
}

div[name=questionTreeEditorCanvas] {
    border: solid 1px black;
    overflow: auto;
}

div[name=questionTreeEditorMiniCanvas] {
    border: solid 1px black;
    position: fixed;
    right: 25px;
    bottom: 25px;
    background-color: white;
    z-index: 1000;
    overflow: hidden;
    width: 200px;
    height: 200px;
    margin: 0;
    padding: 0;
}

div[name=questionTreeEditorMiniCanvas] > div[name=toolbar] {
    width: 100%;
    height: 10px;
    border-bottom: solid 1px black;
    cursor: all-scroll;
    font-family: monospace;
    font-size: 10px;
    line-height: 10px;
    margin: 0;
    padding: 0;
    text-align: right;
}

div[name=questionTreeEditorMiniCanvas] > div[name=toolbar] a {
    cursor: pointer;
}

div.questionTreeInScreen {
    display: none;
    position: absolute;
    z-index: 10000;
    min-width: 635px;
}

div.questionTreeInScreen > fieldset,
div.questionTreeInScreen > form > fieldset {
    border: 1px solid #666666;
    border-radius: 5px;
    background-color: #efefef;
}

div.questionTreeInScreen > fieldset > legend,
div.questionTreeInScreen > form > fieldset > legend {
    border-top: 1px solid #666666;
    border-left: 1px solid #666666;
    border-right: 1px solid #666666;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: #efefef;
}

div.questionTreeInScreen > form label.error {
    margin: 0 0 0 5px;
}

div.questionTreeInScreen fieldset > :not(.additionalSettingsView) input,
div.questionTreeInScreen fieldset > :not(.additionalSettingsView) select {
    width: 300px; 
    margin: 2px;
}

div.questionTreeInScreen input.datum {
    width: 90px;
}

div.questionTreeInScreen input.datum + img {
    margin-top: 3px;
    right: 40px;
}

div.questionTreeInScreen textarea {
    width: 595px;
    height: 50px;
    display: block;
    border: none;
    background-color: #ffffff;
    position: relative;
    padding-left: 10px;
    resize: none;
}

div.questionTreeInScreen fieldset fieldset {
    padding: 0 0 5px 10px;
    background-color: #ffffff;
    border-radius: 5px;
}

div.questionTreeInScreen textarea:focus {
    outline: 0;
}

div.questionTreeInScreen .error {
    border-color: red;
}

div.questionTreeInScreen div.file {
    display: inline-block;
    min-width: 300px;
}

div.questionTreeInScreen div.icon img {
    max-width: 100%;
    height: auto;
}

div.questionTreeInScreen fieldset div label > span {
    display: block;
    float: left;
    width: 120px;
    margin-top: 5px;
}

div.questionTreeInScreen fieldset div input[type=checkbox] {
    height: 16px;
}

div.questionTreeInScreen div[name=toolbar] {
    position: relative;
    top: 15px;
    height: 40px;
}

div.questionTreeInScreen div[name=toolbar] a {
    float: right;
    border-color: #666666;
}

div.questionTreeInScreen tr:hover > td.drag {
    background: url("../../../cp/img/updown.gif") no-repeat scroll center center rgba(0, 0, 0, 0);
}

div.questionTreeInScreen tr.onDrag {
    background-color: #d7ebf9;
}

div.questionTreeInScreen tr > td.drag {
    width: 25px;
}

div[name=questionTreeEditorLeafDetails] div[name=htmlContainer] {
    width: 780px;
    height: 550px;
    float: left;
}

div[name=questionTreeEditorLeafDetails] textarea[name=html] {
    height: 100%;
}

div[name=questionTreeEditorLeafDetails] div[name=variablesAndAnswersContainer] {
    min-width: 200px;
    height: 550px;
    float: right;
    padding: 0;
    margin-left: 5px;
}

div[name=questionTreeEditorLeafDetails] select[name=variablesAndAnswers] {
    height: 100%;
    margin: 0;
}

div[name=questionTreeEditorQuestionDetails] form > fieldset {
    min-width: 818px;
}

div[name=questionTreeEditorQuestionDetails] .highlighted {
    border-color: rgba(82, 168, 236, 0.8);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(82, 168, 236, 0.6);
    outline: 0 none;
}

div[name=questionTreeEditorQuestionDetails] fieldset[name=choices] {
    min-height: 200px;
    padding: 0 5px 5px 5px;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] {
    width: 100%;
    border-collapse: collapse;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] thead th {
    padding: 0;
    vertical-align: bottom;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] input {
    width: 100% !important;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] th.key {
    width: 100px;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] th.shortDescription {
    width: 135px;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] th.drag,
div[name=questionTreeEditorQuestionDetails] table[name=choices] td.drag {
    width: 20px;
}

div[name=questionTreeEditorQuestionDetails] table[name=choices] th:last-child,
div[name=questionTreeEditorQuestionDetails] table[name=choices] td:last-child {
    width: 1px;
    padding-left: 4px;
    padding-right: 0;
}

div[name=questionTreeEditorQuestionDetails] div[name=textContainer] {
    width: 615px;
    float: left;
}

div[name=questionTreeEditorQuestionDetails] div[name=variablesAndAnswersContainer] {
    min-width: 200px;
    float: right;
}
div[name=questionTreeEditorQuestionDetails] div[name=variablesAndAnswersContainer] select {
    height: 411px;
    border-radius: 5px;
    padding: 5px;
    margin-top: 7px;
    border: solid 1px #666666;
    outline: 0 none;
}

div[name=variablesAndAnswersContainer] select[name=variablesAndAnswers] optgroup {
    margin-bottom: 20px;
}

div[name=variablesAndAnswersContainer] select[name=variablesAndAnswers] optgroup:last-child {
    margin-bottom: 5px;
}

div[name=questionTreeEditorExport] {
    margin: 5px;
}

div[name=questionTreeEditorExport] #closeExportButton {
    margin-bottom: 5px;
}

div.questionTreeInScreen div.overflow {
    min-width: 800px;
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

div.questionTreeInScreen div.controls {
    padding-left: 3px;
}

table[name=branches] th,
table[name=variables] {
    text-align: left;
}

table[name=branches] tr:hover > td.drag,
table[name=variables] tr:hover > td.drag{
    background-position: 8px 55px;
}

table[name=branches] tr > td.drag,
table[name=variables] tr > td.drag {
    /*padding-top: 15px;*/
    vertical-align: top;
}

fieldset[name=conditions] {
    margin-top: 5px;
    margin-bottom: 5px;
    min-height: 70px;
    min-width: 550px;
    cursor: default;
}

fieldset[name=conditions] legend {
    padding: 0;
}

fieldset[name=conditions] legend input,
fieldset[name=conditions] legend select {
    margin: 0;
    width: 150px;
}

fieldset[name=conditions] th {
    padding-left: 5px;
    vertical-align: bottom;
}

fieldset[name=conditions] th.small {
    padding-left: 1px;
}

fieldset[name=conditions] td.condition select {
    width: 150px;
}

fieldset[name=conditions] td.operator select {
    width: 160px;
}

fieldset[name=conditions] td.operator select optgroup option {
    padding-left: 3px;
}

fieldset[name=conditions] td.value select {
    width: 250px;
}

fieldset[name=conditions] td.value input {
    width: 250px;
}

fieldset[name=conditions] td.value div.select2-container-multi {
    width: 250px;
}

fieldset[name=conditions] label.error {
    display: none !important;
}

fieldset[name=conditions] div[name=functions] > select {
    vertical-align: top;
    margin-top: 5px
}

fieldset[name=conditions] div[name=functions] > table {
    display:inline-block;
}

fieldset[name=conditions] div[name=functions] select,
fieldset[name=conditions] div[name=functions] input {
    width: 150px;
}

/* Instellingenpopup */
div[name=questionTreeEditorSettings] div[name=labelsContainer] ,
div[name=questionTreeEditorSettings] div[name=keywordsContainer] {
    margin: 2px 0px 2px 0px;
}

div[name=questionTreeEditorSettings] input[name=labels],
div[name=questionTreeEditorSettings] input[name=keywords]{
    width: 500px;
    margin: 2px;
}

/* <Tiny MCE> */

.responsive input.mce-textbox {
    padding: 0 4px;
    border: 1px solid #c5c5c5;
}

.responsive input.mce-textbox:focus {
    box-shadow: none;
}

/* </Tiny MCE> */