/***
Copyright USoft B.V. (C) 1995-2024
This file includes the selectors that can be used by developers
to customize the style of their documents.
***/

html {
	overflow: hidden;
}
body {
	height: 100%;
}
body > .Pages {
	overflow-y: scroll;
}

.ui-button-icon-primary.ui-icon.folder{
	height: 16px;
	width: 16px;
	background-image: url(../images/folder.png) !important;
}

.clearFloat
{	clear:both;
}
.rightFloat
{	float:right;
}

.flex-wrap {
	flex-wrap: wrap;
}

.flex-nowrap {
	flex-wrap: nowrap;
}

.flex-grow {
	flex-grow: 1;
}

.flex {
	display: flex;
}

.uiDataSetNumbersControl li a {
	padding: 5px;
}


ul.radio{
	list-style: none;
}
.input-radio {
	margin-top: 6px;
	display: inline-block;
	margin-left: -15px !important;
	position: absolute !important;
}
 .form-group input[type=radio] {
	margin-top: 4px;
	margin-bottom: 16px;
	margin-left: -15px !important;
	position: absolute !important;
}
/***** Custom additions for PIA *****/
/*** Questionnaire: checkbox/radio ***/
ul.checkbox	{
	list-style: none;
	margin: 0px;
	padding: 0px;
}
ul.checkbox > li, ul.radio > li {
	margin-bottom: 10px;
}
ul.checkbox > li > label, ul.radio > li label{
	padding-left: 20px;
	padding-right: 20px;
	display: inline-block;
}
/*ul.checkbox > li > label, ul.radio > li label{
	cursor: pointer;
}*/
.input-radio-round[type=radio]:not([disabled]) + label, input[type=radio]:checked:not([disabled]) + label, input[type=checkbox]:checked:not([disabled]) + label{
  cursor: pointer;
}
.readonly_Y > .document-delete.icon-trash-can{
	display:none !important;
}

.input-checkbox-answer{
	position: absolute !important;
	margin-top: 6px;
	display: inline-block;
	margin-left: -15px !important;
}
.select-answers {
	border-style: solid;
	border-color: #888;
	border-width: 0px 0px 1px;
	position: relative;
	margin-right: 0px !important;
	margin-left: 0px !important;
	margin-bottom: 10px;
}
.answer-options > * {
	float: left;
	margin-right: 10px;
}
/* Overwrite from Bootstrap.css */
.navbar-default{
	background-image: none !important;
	background-color: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	border-bottom: 1px solid #e9e8e3 !important;
}
li.dropdown-menu{
	background-color: transparent;
}
li.dropdown-menu ul{
	background-color: white;
	margin-top: -2px;
}
ul.dropdown-menu > li > a > span {
	color: #0094D9;
}
.dropdown-menu > li:hover,
.dropdown-menu > li:focus {
	color: #262626;
	text-decoration: none;
	background-color: #f5f5f5;
}
/* END Overwrite from Bootstrap.css */
.cp {
	cursor: pointer;
}
.intro-border{
	border: 1px solid #e9e8e3 !important;
}
.intro-border td{
	padding: 5px;
}
.intro-border-tb{
	margin: 5px 0 5px 0;
	border-top: 1px solid #e9e8e3 !important;
	border-bottom: 1px solid #e9e8e3 !important;
}
td.uiInputControl input{
	width: 100%;
}

div#replicated-chapter div.selectedRow{
	font-weight: bold;
}
.fs-20{
	font-size: 20px;
}
.fw-b{
	font-weight: bold;
}
.page-title{
	font-size: 24px !important;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.1;
	color: inherit;
}
.divider-line{
	min-height: 1px;
	border-top: 1px solid #e5e5e5;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
}
.vertical-divider-line{
	min-height: 1px;
	border-left: 1px solid #e5e5e5;
}

.col-3-05 {
    flex: 0 0 28.08333333333%;
    max-width: 28.08333333333%;
}
.col-05 {
    flex: 0 0 4.1666666666%;
    max-width: 4.1666666666%;
}
.col-025 {
    flex:  0 0 2.0833333333%;
    max-width: 2.0833333333%;
}

#sideMenu {
  position: fixed;
  left: 0;
  top: 50%;
  width: 8em;
  margin-top: -2.5em;
}

/*** Padding ***/
.pt-0 {
	padding-top: 0px;
}
.pt-10 {
	padding-top: 10px;
}
.pt-12 {
	padding-top: 12px !Important;	/* vertical align text htmlarea as text */
}
.pb-0 {
	padding-bottom: 0px;
}
.pb-10 {
	padding-bottom: 10px;
}
.ptb-0 {
	padding-top: 0px !Important;
	padding-bottom: 0px !Important;
}
.ptb-10 {
	padding-top: 10px;
	padding-bottom: 10px;
}
.ptb-4 {
	padding-top: 4px !Important;
	padding-bottom: 4px !Important;
}
.ptb-0_8 {
	padding-top: 0px !Important;
	padding-bottom: 8px !Important;
}
.pr-15 {
	padding-right: 15px;
}
.pl-4 {
	padding-left: 4px !Important;
}
.pl-6 {
	padding-left: 6px !Important;
}
.pl-10 {
	padding-left: 10px !Important;
}
.pl-15 {
	padding-left: 15px !Important;
}
.plr-15 {
	padding-left: 15px !Important;
	padding-right: 15px !Important;
}
.pl-24 {
	padding-left: 24px !Important;
}
.pl-26 {
	padding-left: 26px !Important;
}
.pl-40 {
	padding-left: 40px !Important;
}
.p-24 {
	padding: 24px !Important;
}
.no-pad {
	padding: 0px !Important;
}
.noPadding{
	padding: 0px !Important;
}
.no-pad-hori {
	padding-right: 0px !Important;
	padding-left: 0px !Important;
}
.no-pad-right {
	padding-right: 0px !Important;
}
.noPaddingRight {
	padding-right: 0 !important;
}
.no-pad-left {
	padding-left: 0px !Important;
}
.noPaddingLeft {
	padding-left: 0 !important;
}
.no-pad-top {
	padding-top: 0px !Important;
}
.noPaddingLeftRight {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
/*** END padding ***/
/*** Margins ***/
.noMargin{
	margin: 0px !important;
}
.mt-0 {
	margin-top: 0px;
}
.mt-4 {
	margin-top: 4px !important;
}
.mt-5 {
	margin-top: 5px !important;
}
.mt-10 {
	margin-top: 10px !important;
}
.mt-12 {
	margin-top: 12px !important;
}
.mt-15 {
	margin-top: 15px;
}
.mt-17 {
	margin-top: 17px;
}
.mt-20 {
	margin-top: 20px !important;
}
.mt-50{
	margin-top: 50px;
}
.mb-4 {
	margin-bottom: 4px !important;;
}
.mb-8 {
	margin-bottom: 8px;
}
.mb-10 {
	margin-bottom: 10px;
}
.mb-20{
	margin-bottom: 20px;
}
.mb-30{
	margin-bottom: 30px;
}
.mtb-10{
	margin: 10px 0;
}
.ml-3 {
	margin-left: 3px !important;
}
.ml-5 {
	margin-left: 5px;
}
.ml-15 {
	margin-left: 15px !important;
}
.ml-20 {
	margin-left: 20px;
}
.ml-30 {
	margin-left: 30px !important;
}
.ml-40 {
	margin-left: 40px;
}
.ml-10n{
	margin-left: -10px !important;
}
.ml-15n{
	margin-left: -15px !important;
}
.mr-0 {
	margin-right: 0px;
}
.mlr-0{
	margin-right: 0px !important;
	margin-left: 0px !important;
}
.mlr-15{
	margin-right: 15px !important;
	margin-left: 15px !important;
}

.h-100P{
	height: 100%;
}
.h-95P{
	height: 95%;
}
.h-90P{
	height: 90%;
}
.h-89P{
	height: 89%;
}

.dialog-details-size{
	width:85% !important;
	min-height:370px !important;
}

.dialog-details-action-size{
	width:85% !important;
	min-height: 75vh !important;
}

.dialog-details-action-tab-size{
/*	min-width: 127vh !important;*/
}

.dialog-question-size{
	width:880px !important;
}

.dialog-wizard-size{
	max-width:95vw !important;
	width:100vw !important;
	max-height:95vh !important;
	height:100vh !important;
}

.dialog-wizard-grid{
	margin-left: 15px;
	padding-right: 15px
}

/*** END of Margins ***/
/*** END General ***/

/*** Sticky footer ***/
html {
	position: relative;
	min-height: 100%;
}

body > .container {
	min-height: calc(100% - 260px);
}
.container .text-muted {
	margin: 20px 0;
}

code {
	font-size: 80%;
}
/*** END Sticky footer ***/

/*** Page Styles ***/
/* Sign in page */
.form-signin {
	/*max-width: 330px;*/
	max-width: 450px;
	padding: 15px;
	background: transparent;
	border-radius: 4px;
	margin: 0 auto;
	margin-top: 200px;
}

.form-reset-passwd {
	/*max-width: 330px;*/
	max-width: 510px;
	padding: 15px;
	background: transparent;
	border-radius: 4px;
	margin: 0 auto;
	margin-top: 200px;
}

.form-signin-heading{
	margin-top: 0px;
}
/* End Sign in page */
div.htmlarea {
	border-width: 0px;
	border-style: none;
	padding: 0 0px;
	font-weight: inherit;
}

div#upload label{
	border: none;
	color: black;
}

div#upload label i{
	margin-left: -10px;
}

.upload-exists{
	color: black;
	background-color: white;
}

.Page {
	width:100%;
}

.login-background {
	background-color: #012750
}

.Page .Page {
	background-color: transparent;
}

.ptop20 { padding-top:20px;}
#filters { padding-top:20px;}
#filters label { padding:5px 0px; width:100%; display:block; font-weight:normal;}
#filters label .check { margin-right:10px;}
#filters .multicol2 label { width:50%; float:left;}

.greybar { width:100%; background-color:#eeeeee; padding:20px 0px;}
.greyline { width:100%; background-color:#eeeeee; padding:8px 0px;}
.whitebar { width:100%; padding:10px 0px;}

.greybar
{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

.ReplicatedColumnsControl {
	padding-left: 15px;
}

.TitleLabelControl {
	font-size: 16px;
	font-weight:bold;
	padding-top:10px;
	padding-bottom:4px;
}

.SubTitleLabelControl {
/*	font-size: 14px !important;*/
	font-weight:bold !important;
	padding-top:10px;
	padding-bottom:4px;
}
.subtitle-container {
	font-family: "Open Sans", sans-serif;
	font-style: normal;
	font-weight: 400 !important;
	font-size: 18px !important;
	margin: 0;
}

div.SmallLineWhiteGroup {
	padding-left: 5px;
	width: 100%;
	height: 1px;
	background-color: white;
	border-style: solid;
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-left-width:0px;
	border-right-width: 0px;
	border-color: white;
	margin-left: 15px;
	margin-right: 15px;
}

/* Warning buttons*/
.btn-red {
	background-color:#c22121;color:#fff;border-color:#c22121;margin-right:10px;}
.btn-red:hover {
	background-color:#a21818;color:#fff;border-color:#a21818;}

/* bootstrap-theme.css */
.header {
	background: transparent;
}

.box-blue {
	background: #16a085;
	color: white;
}

.no-border, .no-border input{
	border-width: 0px;
	border-bottom-width: 0px;
	margin: 5px;
}
.noBorder, .noBorder input{
	border-width: 0px;
	border-bottom-width: 0px;
}
/* einde bootstrap-theme.css */

/* Select active menu item from dropdown list */

li.open.dropdown-menu > a {
	color: #fff;
	background-color: #0094D9;
}

/*** END Page Styles ***/
/***** END Custom additions for PIA *****/

td #DUE_DATE_COLOR {
	width: 20px;
	height: 67px;
	margin: -8px;
	display: block;
}

td #DUE_DATE_COLOR div {
	height: 100%;
}

td.CenterButton {
	vertical-align: middle !important;
}

.RccTreeNode{
	font-size: 11pt;
	font-weight: bold;
}

/* Used to show 3 dots (...) when the field is not big enaugh to display the complete value. */
.divValueEllipsis div {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* Needed to allow custom uiInputControl for showing a tooltip of it's own value but keep the . */
table.tableValueEllipsis {
	table-layout: fixed;
}

/*	Start Multi Language Section	*/
.nav-lang { list-style: none; float:right; margin:0 10px 0 0; padding:0px; }
.nav-lang li { position: relative; margin: 0 5px; padding: 0px; display: block; cursor: pointer; float: left; }
.nav-lang li a { padding: 2px 15px 1px 15px; display: block; cursor: pointer; color: #666; text-decoration: none; float: left; }

/* Language settings */
/*
Verouderd:
body.nlNL .enUS { display:none!important; }
body.nlNL .nlNL { display:block!important; }
body.nlNL label.nlNL, body.nlNL span.nlNL { display:inline!important; }
body.enUS .nlNL, body .nlNL { display:none!important; }
body.enUS .enUS { display:block!important; }
body.enUS label.enUS, body.enUS span.enUS { display:inline!important; }*/
/*	End Multi Language Section	*/
body.nl .en .it{ display:none!important; }

body.en .nl, body.en .it,
body.nl .en, body.nl .it,
body.it .nl, body.it .en { display:none!important; }

body.nl .nl { display:block!important; }
body.nl label.nl, body.nl span.nl, body.nl span.nl > div { display:inline!important; }
body.en .en { display:block!important; }
body.en label.en, body.en span.en, body.en span.en > div  { display:inline!important; }
body.it .it { display:block!important; }
body.it label.it, body.it span.it, body.it span.it > div  { display:inline!important; }



.uiButtonControl > span {
	float: none;
}

/* Questionnaire: chapters with completion icons */
#replicated-chapter {
	display: table;
	width: 100%;
}

#replicated-chapter .rcc-row [id='child-page-code']{
	display: table-row;
}

#replicated-chapter .rcc-row [id='child-page-code'] .pull-left[id='child-complete'] {
	display: table-cell;
}

#replicated-chapter .rcc-row [id='child-page-code'] [id='CHILD_DESCRIPTION'].uiColumnControl {
	display: table;
}

/** Adjusted WaitControl (more transparent) **/
.WaitControl {
	cursor: wait;
	opacity: inherit;
	filter: inherit;
	width:	inherit;
	height:	inherit;
	left:	inherit;
	top:	inherit;
	z-index:	inherit;
	position:	inherit;
/*	background:#FFFFFF;*/
	background-color:transparant;
}

div.WaitControl {
	opacity: 0.1;
	filter: alpha(opacity=10);
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 9999;
	position: absolute;
}

table.WaitControl {
	left: 50%;
	top: 50%;
	position: absolute;
	z-index: 9999;
}

.rqc-row ul.radio li span {
	white-space: normal;
}

.uiGridControl td div.htmlarea span {
	white-space: normal;
}

.close {
	line-height: 10px;
}

.uiLabelControl{
	text-align: left;
	word-break: break-word;
}

.form-group.required .uiLabelControl:after, .form-group.required .col-4.col-sm-4.uiLabelControl:after, .form-group.required .col-4.col-sm-4.uiLabelControl:after, .form-group.required .col-12.col-sm-12.uiLabelControl:after {
	content:" *";
	color:red;
}

ul.checkbox li span {
	white-space: pre-wrap;
	padding-left: 2px;
	padding-right: 5px;
}

.uiGridControl .wait tr {
	height: 40px;
	background: rgba(255,255,255,0.75) url(../images/loading.gif) no-repeat center center;
}
.uiGridControl .wait td {
	height: 40px;
	background: rgba(0,0,0,0) no-repeat center center;
}
.option-box.wait select {
	height: 50px;
	background: rgba(255,255,255,0.75) url(../images/loading.gif) no-repeat center center;
}

.answer_width {
	width: 220px;
}

.question_width {
	width: 220px;
}

.subject_width {
	width: 220px;
}
 .DataInputHelp {
    min-width: 6px;
    padding: 2px 5px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #777;
    border-radius: 10px;
    margin-top: 6px;
    font-size: 80%;
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin-left: 10px;
}

#CommentGrid td .htmlarea {
	white-space: initial;
}

li.tree-node.selected > .tree-node-image,
li.tree-node.selected > .tree-node-value {
	background: transparent;
	font-weight: bold;
}

li.tree-node > .tree-node-image,
li.tree-node > .tree-node-value {
	cursor: pointer;
}

.textarea.form-control {
	resize: vertical;
}

.uiGridControl .uiInputControl.static:not(.Date) {
	white-space: normal;
}

.remove-html, .add-html, .comment-html {
	cursor: pointer;
}

@font-face {
	font-family: 'FontAwesome Regular';

	src: url('../fonts/fa-regular-400.eot');
	src: url('../fonts/fa-regular-400.eot?#iefix') format('embedded-opentype'), url('../fonts/fa-regular-400.woff') format('woff'), url('../fonts/fa-regular-400.ttf') format('truetype'), url('../fonts/fa-regular-400.svg#glyphicons_halflingsregular') format('svg');
}

@font-face {
	font-family: 'FontAwesome Solid';

	src: url('../fonts/fa-solid-900.eot');
	src: url('../fonts/fa-solid-900.eot?#iefix') format('embedded-opentype'), url('../fonts/fa-solid-900.woff') format('woff'), url('../fonts/fa-solid-900.ttf') format('truetype'), url('../fonts/fa-solid-900.svg#glyphicons_halflingsregular') format('svg');
}

/* New */

.hide {
	display: none !important;
}
.hideTestRef {
	opacity: 0 !important;
	height: 0px !important;
	min-height: 0px !important;
}

html, body {
	height: 100%;
}
body > .Pages {
	height: 100%;
}
body > .Pages > .uiPage {
	/*height: 100%;*/
	min-height: calc(100vh - 0px);
}

.uiGridControl [rowId='header'] {
	cursor: pointer;
}

.uiGridControl [rowId='header'] > .sort-asc:after {
	content: "\25b2";
}

.uiGridControl [rowId='header'] > .sort-asc.text-right:before {
	 float: left;
}

.uiGridControl [rowId='header'] > .sort-desc:after {
	content: "\25bc";
}

.uiGridControl [rowId='header'] > .sort-desc.text-right:before {
	float: left;
}

.uiGridControl [rowId='header'] > .mark-record,
.uiGridControl [rowId='header'] > .select-record,
.uiGridControl [rowId='header'] > .number-record {
	 cursor: initial;
}

.uiGridControl [rowId='header'] > .mark-record:after,
.uiGridControl [rowId='header'] > .select-record:after,
.uiGridControl [rowId='header'] > .number-record:after {
	 content: "";
}

/* Extra media-settings */
/*.body-container {
	margin: 0px 120px;
}*/
@media (min-width: 500px) {
  .us-tabs > ul {
	  padding-inline-start: 23px !important; 
  }
  .title-container, .body-container {
  padding: 24px 20px 16px 40px;
  }
  .menu__upper-wrapper > *:first-child, .menu__lower-wrapper > *:first-child {
    padding: 0px 163px 0px 40px;
/*    padding: 8px 163px 16px 40px;*/
	}
  .menu__upper-wrapper > *:last-child, .menu__lower-wrapper > *:last-child {
    padding-right: 35px;
	}
	.footer {
    margin-left: 0px;
	}
	.footer{
		padding: 24px 40px;
	}
}
@media (min-width: 576px) {
  .body-container {
    margin: 0px 40px;
    padding: 0px;
  }
  .menu__upper-wrapper > *:first-child, .menu__lower-wrapper > *:first-child {
    padding: 0px 350px 0px 40px;
/*    padding: 8px 350px 16px 40px;*/
    vertical-align: middle;
	}
	.menu__upper-wrapper > *:last-child, .menu__lower-wrapper > *:last-child {
    padding-right: 40px;
	}
}
@media (min-width: 768px) {
  .body-container {
    margin: 0px 0px;
 /*   margin: 0px 50px;*/
    padding: 24px 120px 16px;
  }
  .title-container {
    padding: 24px 120px 16px;
	}
  .menu__upper-wrapper > *:first-child, .menu__lower-wrapper > *:first-child {
    padding: 8px 8px 16px 120px;
 /*   padding: 8px 8px 16px 120px;*/
    vertical-align: middle;
	}
	.menu__upper-wrapper > *:last-child, .menu__lower-wrapper > *:last-child {
    padding-right: 120px;
	}
	.footer__wrapper{
		margin-left: -15px;
	}
	.footer {
    padding: 24px 120px;
	}
}
@media (min-width: 992px) {
  .body-container {
/*    margin: 0px 120px;*/
  }
}
@media (min-width: 1200px) {
  .body-container {
/*    margin: 0px 120px;*/
  }
}

.body-container .body-container {
	margin: inherit;
	padding: 0px;
}

.login-input-margin {
	margin-top: 8px;
	margin-bottom: 8px;
}

.login-text {
	text-align: center;
	margin-top: 50px;
}

.link-style {
	color: rgb(0,145,206);
}

.frame-container {
	min-height: calc(100vh - 220px);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active	{
	-webkit-box-shadow: 0 0 0 30px white inset !important;
}

/** Tabs Control **/
.uiTabsControl .uiButtonControl.ui-button { font-size: 90%; }

.uiTabsControl.tabs {
	margin-top: 60px;
	padding: 0;
}

.uiTabsControl.tabs > ul li.ui-tabs-active {
	background: inherit;
}


.uiTabsControl.tabs > ul.nav.nav-tabs li a.disabled {
	color: gray;
	background: #eee;
}

.us-tabs > ul {
	border-bottom: 1px solid rgba(0,0,0,.2);
	color: #34495e;
	display: flex;
	font-family: Source Sans Pro,Helvetica Neue,Arial,sans-serif;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-inline-start: 0px;
	display: flex;
	flex-wrap: wrap;
}

.us-tabs > ul li {
	list-style-type: none;
	margin-right: 40px;
	border: none;
	font-size: 100%;
	padding-bottom: 8px;
	line-height: 36px;
}

.us-tabs > ul li a {
	padding: 8px 0;
	color: #012750;
	letter-spacing: 0.05em;
	font-size: 18px;
	font-weight: 600;
	text-decoration: none;
}
.us-tabs > ul li.tab-active {
/*	border-bottom: 4px solid #FF8F1B;*/
	border-bottom: 4px solid #FD7814;
}

.us-tabs > ul li.tab-active a {
	text-shadow: 0.25px 0 0 currentColor, 0 0.25px 0 currentColor, -0.25px 0 0 currentColor, 0 -0.25px 0 currentColor;
	font-weight: bold;
}

.us-tabs > ul li.tab-disabled a {
	color: grey;
}

/** Pagination **/
.uiDataSetNumbersControl {
	list-style-type: none;
	display: flex;
	flex-direction: row;
	padding-left: 0px;
}

.uiDataSetNumbersControl > li:first-child {
	margin-left: 0;
}

.uiDataSetNumbersControl li {
	background: #E4F0F7;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 1000;
	color: #012750;
	font-size: 14px;
	font-family: "Open Sans", sans-serif;
	margin-left: 8px;
	cursor: pointer;
}

.uiDataSetNumbersControl li.active {
	background: #012750;
	color: #FFFFFF;
}

.details-card-wrapper {
	border-radius: 5px;
	background-color: #FFFFFF;
	padding: 20px;
	color: #012750;
	margin-top: 20px;
}

.table--grid > *:not(:first-child) > *, .table--grid > *:not(:first-child) > .selected, .table--grid > *:first-child > * {
	display: flex;
	flex-wrap: wrap;
	margin-right: 0px !important;
	margin-left: 0px !important;
}

.labelVerticalInput{
	font-weight: 1000;
}
th.markRecord, td.markRecord{
	padding-left: 10px !important;
	padding-right: 10px !important;
}
.markRecord > input[type="checkbox"]{
	width: 16.5px;
	height: 16.5px;
}
.dataNoControl{
	font-weight: 1000;
}
.buttonAsTextControl{
	border-radius: 5px;
	border: 1px solid #D4DDE1;
}
.search-checkbox{
	background-color: white
}
.resize-text-box-vertical{
	height: inherit;
	width: 100%;
}

/* submenu no-indent */
.uiMenuControl li li > a {
	padding: 0px;
}

.container-shadow > div > .table--questionnaire > thead > tr
, .container-shadow > div > .table--questionnaire > tbody > tr{
	margin-right: 0px !important;
	margin-left: 0px !important;
}

.container-shadow > .table--questionnaire > thead > tr
, .container-shadow > .table--questionnaire > tbody > tr{
	margin-right: 0px !important;
	margin-left: 0px !important;
}
.container-shadow > .table--questionnaire > .grid-header-content > .grid-header-row
, .container-shadow > .table--questionnaire > .grid-body > .grid-row{
	margin-right: 0px !important;
	margin-left: 0px !important;
}
/* work-a-round Tabulargrid */
.grid-cell.col-1 > .col-1 { max-width: 100%; }
.grid-cell.col-2 > .col-2 { max-width: 100%; }
.grid-cell.col-3 > .col-3 { max-width: 100%; }
.grid-cell.col-4 > .col-4 { max-width: 100%; }
.grid-cell.col-5 > .col-5 { max-width: 100%; }
.grid-cell.col-6 > .col-6 { max-width: 100%; }
.grid-cell.col-7 > .col-7 { max-width: 100%; }
.grid-cell.col-8 > .col-8 { max-width: 100%; }
.grid-cell.col-9 > .col-9 { max-width: 100%; }
.grid-cell.col-10 > .col-10 { max-width: 100%; }
.grid-cell.col-11 > .col-11 { max-width: 100%; }
.grid-cell.col-12 > .col-12 { max-width: 100%; }
/* work-a-round Tabulargrid end */

/* Marges kolommen gelijk aan oud */
/*.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td
{	padding-left: 6px !important;
	padding-right 6px !important;
}*/

.side-panel__overflow-wrapper .rcc-body[dsi][dsid], .default-record-set-form {
	display: block !important;
}

.table--questionnaire.start-assessment > *:not(:first-child) > .selected {
	background: #FFFFFF;
}

.icon-edit {
    display: inline-block;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center center;
    width: 27px;
    height: 27px;
    background-image: url(../images/icon-edit.svg);
    background-size: 30px 26px;
	margin-left: -40px;
}

.icon-logging {
  display: inline-block;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center center;
  width: 23px;
  height: 23px;
  background-image: url(../images/icon-information.svg);
}

button:focus:not(.icon-look-up) {
    background-color: #FD7814 !important;
    color: white !important;
    border: 2px solid #FD7814 !important;
}


.seperation-line {
    height: 5px !important;
}

.download-tab-area {
	margin-top: -80px;
}

/* Graph */
.txtAlignC {
    text-align: center;
}
.graphBoxCount {
    background-color: #ffffff;
    border: 1px solid #dddddd;
    height: 140px;
    text-align: center;
}
.graphTitle {
    font-size: 20px;
    font-weight: bold;
    margin-top: 15px;
    text-align: center;
    width: 100%;
}
.graphBoxCountData {
    text-align: center;
    font-size: 50px;
    color: #00008C;
    padding-top: 12px;
}

.graphBoxCountDataSmall {
    font-size: 22px;;
    color: #777777;
}
.fs-12{
	font-size: 12px;
}

.graphBox {
	background-color: #ffffff;
	border: 1px solid #dddddd;
	height: 400px;
}

.graphBodyBoxBar {
	overflow-y: auto;
    margin-top: 15px;
	height: 273px;
}
.graphBodyBoxBarNoLegenda {
	overflow-y: auto;
    margin-top: 15px;
	height: 322px;
}
.graphBodyBoxBarVert {
	border-bottom: 0px solid #000000;
    overflow-x: auto;
    margin-top: 15px;
	height: 273px;
	position: inherit;
    margin-left: 20px;
}
.graphBodyBoxPieChart {
	height: 257px;
	padding-left: 62px;
}

.colorBlueLight{
	color: #4BB9FF !important;
}
.colorBlueDark{
	color: #00008C !important;
}
.colorRed{
	color: #FF4B2D !important;
}
.colorRedDark{
	color: #aa0000 !important;
}



.btndescr, .btn1, .btn2, .btn3, .btntot {
    background-color: #fff;
    color: #ffffff;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    text-align: right;
}
.btndescr {border-right: 1px solid #000000;}
.btntot, .btndescr {background-color: #ffffff;color: #777777;}
.btntot {padding-left: 8px; padding-top: 8px; color: #777777;}
.btndescr {text-align: right;padding-right: 10px;}

/*.row {
	height: 106%;
}*/
.btn1, .btn2, .btn3, .btntot, .popup {
	height: 106%;
}

.btndescr {
	height: 110%;
	word-break: break-all;
}

.btn_1.popup .popuptext {
	width: 150px;
	margin-left: -65px;
}

/* The actual popup */

.spanPopup {
	background-color: #555;
	border-radius: 6px;
	color: #fff;
	text-align: center;
	padding: 8px 0;
	padding-left: 15px;
	padding-right: 15px;
	position: absolute;
	z-index: 1;
	left: 50%;
	font-size: 12px;
}

.putext {
	background-color: #555;
	border-radius: 6px;
	color: #fff;
	display: none;
    font-size: 12px;
	height: 64px;
	left: 50%;
	padding: 8px 0;
	padding-left: 2px;
	padding-right: 2px;
	position: absolute; 
	text-align: center;
	width: 180px;
	z-index: 1;
}

.popup:hover .putext {
	visibility: visible;
	-webkit-animation: fadeIn 1s;
	animation: fadeIn 1s;
}

/* Popup arrow */
.putext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
}


.graphLegend {
	margin-top: 10px;
/*	display: inline-grid;*/
}

.graphLegendBullet {
	height: 13px;
	width: 12px;
	margin-right: 5px;
	margin-top: 4px;
}

.graphLegendCat {
	color: #777777;
	vertical-align: 3px;
}

.graphBar {
    display: inline-block;
    margin-left: 0px;
    margin-right: 0px;
    position: absolute;
    bottom: 80px;
    border: 0px solid #ff0000;
    /* padding-left: 10px; */
    padding-bottom: 45px;
}
.bar {margin-left: 5px;
	width: 40px !important;
}
.hr {background-color: #FF4B2D;}
.lr {background-color: #F0B437;}
.nr {background-color: #BEB4C8;}
.label {height: 30px; border-top: 1px solid #000000;}

.labelTxt {
	margin-top: 20px;
	margin-left: -22px;
	transform: rotate(-40deg);
	width: 68px;
	color: #777777;
}
/* Graph End */


.usoft-message {
white-space: break-spaces;
}

/*.question-card-wrapper .question-comment-response-insert:before, .question-card-wrapper .question-comment-response .uiInputControl:before {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
  width: 18px;
  height: 15px;
  background-image: url("../images/icon-comment.svg");
  padding-left: 42px;
}
*/
.question-card-wrapper .question-comment-response {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  margin-top: 8px;
  color: #012750;
}
.question-card-wrapper .question-comment-response .rcc-body.empty {
  display: none;
}
.question-card-wrapper .question-comment-response .uiInputControl {
  display: inline;
  cursor: pointer;
  margin-left: 25px;
  /*     &:not(.Insensitive) {
          cursor: pointer;
  */
  /*      }*/
}
.question-card-wrapper .question-comment-response .uiInputControl:before {
  content: "";
  margin: 2px 8px -4px 0;
}
.question-card-wrapper .question-comment-response .uiInputControl:hover {
  text-decoration: underline;
}
.question-card-wrapper .question-comment-response .comment-response-delete {
  margin-left: 8px;
  cursor: pointer;
}
.question-card-wrapper .question-comment-response-insert {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  color: #AABBC4;
  font-style: italic;
  cursor: pointer;
  margin-left: 40px;
}
.question-card-wrapper .question-comment-response-insert:before {
  content: "";
  margin: 2px 8px -4px 0;
}
.question-card-wrapper .question-comment-response-insert:hover {
  text-decoration: underline;
}

.question-comment-insert, .icon-comment-response {
  margin-top: 8px
}

.staticInputText{
	font-family: "Open Sans", sans-serif;
	font-weight: 600;
	height: 50px;
	border-radius: 5px;
	border: thin solid #D4DDE1;
	padding: 12px 16px 0px 16px;
	display: block;
}

.container-shadow-small {
    padding: 10px;
    margin-bottom: 8px;
    border-radius: 5px;
    background-color: #FFFFFF;
	-webkit-box-shadow: 0px 2px 5px 0px rgb(101 137 157 / 25%);
    -moz-box-shadow: 0px 2px 5px 0px rgba(101, 137, 157, 0.25);
    box-shadow: 0px 2px 5px 0px rgb(101 137 157 / 25%);
	}

.changeLoggingDialog {
	width: 800px;
}

.previewHTML {
	opacity: 1 !important;
}

/* Stepper */
.stepper {
    --brand-primary: #012750;
	--brand-accent: #FD7814;
    --grey-400: #bdbdbd;
}

.stepper-steps {
    background-color: white;
    display: flex;
    justify-content: space-between;
    position: relative;
    
    counter-reset: step;
    
    /* Connector line */
    &::after {
        content: "";
        position: absolute;
        bottom: 50%;
        left: 24px;
        right: 24px;
        height: 1px;
        background: var(--grey-400);
        z-index: 1;
    }
}

.stepper-steps .stepper-step {
    padding: 12px;
    cursor: pointer;
    background: transparent;
    border: none;
    text-align: center;
    counter-increment: step;
    z-index: 2;
}

.stepper-steps .stepper-step:focus {
	border: none !important;
	color: inherit !important;
	background: none !important;
}

.stepper-steps .stepper-step:disabled {
	color: rgba(0, 0, 0, 0.38);
	cursor: not-allowed;
	border: none !important;
}

.stepper-steps .stepper-step[aria-selected="true"] {
    font-weight: bold;
	
	& > :first-child::before {
		background-color: var(--brand-accent);
	}
}

/* Step marker */
.stepper-steps .stepper-step > :first-child {
    padding-inline: 8px;
    background: white;
    
    &::before {
        content: counter(step);
        display: inline-block;
        width: 24px;
        height: 24px;
        margin-right: 8px;
        text-align: center;
        color: white;
        line-height: 24px;
        background-color: var(--brand-primary);
        border-radius: 24px;
        font-weight: 100;
    }
}

.stepper-step:disabled > :first-child::before {
    background-color: var(--grey-400);
}

.stepper [role="tabpanel"]:not([aria-current="step"]) {
	visibility: hidden;
}

.stacked {
	display: grid;
}

.stacked > * {
	grid-area: 1 / 1;
}
/* End Stepper */

.default-record-set {
	font-size: 15px !important;
	height: auto !important;
}

/* Bug Na $.udb(dsName).setDataSetSize(N); is de selected klasse verdwenen van de geseleceerde rij. In USoft 11 opgelost */
.table--task-list > *:not(:first-child) > .selectedRow,
.table--questionnaire > *:not(:first-child) > .selectedRow,
.table--my-dashboards > *:not(:first-child) > .selectedRow,
.table--top-risks-gaps > *:not(:first-child) > .selectedRow,
.selectedRow.table-row--inverted {
  background-color: #65899D;
  color: #FFFFFF;
}
/* Einde Bug Na $.udb(dsName).setDataSetSize(N); is de selected klasse verdwenen van de geseleceerde rij. In USoft 11 opgelost */

.icon-help-attribute {
    display: inline-block;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center center;
    top: 50%;
    width: 18px;
    height: 18px;
    transform: translateY(-50%);
    border-radius: 10px;
    background-image: url(../images/icon-question-answer.svg);
}

.upper-wrapper .left-wrapper .question p {
	margin: 0px;
}
