.uqInfoTitle {
	width: 100%;
	padding-right: 1.5em;
	position: relative;
}

.uqInfoTitle:after {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	font-size: 1em;
	right: 0;
	content: "\f05a";
	color: var(--text-question-light-color);
}

.panel h2.uqQuestionTitle {
	width: 100%;
	padding-right: 1.5em;
	position: relative;
	box-sizing: border-box;
}

.uqQuestionTitle:after {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	font-size: 1em;
	right: 0;
	content: "";
	color: var(--text-question-light-color);
	top: 0;
	animation-name: questionAnsweredPopup;
	animation-duration: 0.5s;
}

.uqQuestionTitle.uqQuestionAnsweredTitle:after {
	content: "\f058";
	color: var(--text-question-answered-color);
}

.uqQuestionTitle.uqQuestionAnsweredTitle:after {
	content: "\f058";
	color: var(--text-question-answered-color);
}

.uqQuestionTitle.uqQuestionDiffersTitle:after {
	content: "\f06a";
	color: var(--link-color);
}

.uqQuestionTitle.uqQuestionConfirmedTitle:after {
	content: "\f058";
	color: var(--text-question-answered-color);
}

.uqQuestionTitle.uqQuestionPendingTitle:after {
	content: "\f2f2";
	color: var(--text-color);
}

.uqQuestionTitle.uqQuestionChangedTitle:after {
	content: "\f058";
	color: var(--link-color);
}


@keyframes questionAnsweredPopup {
    0%   { opacity: 0; transform: scale(0.25); }
    30%   { opacity: 1; transform: scale(1.1); }
    100% { opacity: 1; transform: scale(1); }
}

.uqQuestionTitle.uqQuestionDiffersTitle:after {
	content: "\f06a";
	color: var(--link-color);
	animation-name: questionAnsweredPopup;
	animation-duration: 0.5s;
}

.uqDiffersComment {
	color: var(--link-color);
	font-size: 0.9em;
}

#previousQuestionnaireNote {
	margin-bottom: 2em;
}

.uqQuestion {
	font-weight: bold;
	font-size: 1.1em;
}

.uqAnswers {
	margin: 1.5em 0;
}

.uqAnswers label {
	display: block;
	font-weight: 600;
	font-weight: normal;
	margin: 1.25em 0;
}

.uqAnswers label.selected.differs,
.uqAnswers td.differs {
	color: var(--link-color);
}

.uqAnswers label.selected {
	font-weight: bold;
}

.uqAnswers label span {
	font-weight: normal;
	opacity: 0.6;
}

.uqAnswers label.selected span {
	font-weight: 600;
	opacity: 1;
}

.uqAnswers .fieldCols label {
	display: block;
	font-weight: 600;
	margin: 0;
}

.panel p + div.answersWithPrev {
	margin-top: 1em;
}

.answersWithPrev > div {
	display: flex;
}

.answersWithPrev > div > div {
	width: 40px;
	text-align: center;
	margin-right: 10px;
	padding: 0.625em 0;
}

.answersWithPrev > div > div + div {
	width: calc(100% - 50px);
	text-align: left;
}

.answersWithPrev > div.answersWithPrevHeader {
	font-size: 0.8em;
	opacity: 0.8;
}

.answersWithPrev > div.answersWithPrevHeader > div {
	padding: 0 0 0.5em 0;
}


.uqAnswers .answersWithPrev label {
	margin: 0;
}


.uqFootnote {
	font-size: 0.8em;
}

.uqPageListPanel {
	position: sticky;
	top: 2em;
	top: 0;
}

.uqPageListHeader {
	height: 75px;
}


.uqPageListHeader h3 {
	margin: 0 0 0.5rem 0;
}

.uqPageListHeader span {
	display: block;
	font-size: 0.8em;
	line-height: 1.2em;
}

.uqPageListHeader em.statusIcon.config {
	color: var(--text-question-light-color);
}


.uqPageListContainer {
	height: calc(100vh - 65px - 184px - var(--page-content-top));
	max-height: 500px;
	overflow-y: auto;
	padding-left: 1em;
	margin: 0 -1em;
	position: relative;
}

#uqQuestionPanel {
	display: none;
}

#questionnaireContainer {
	min-height: calc(100vh - var(--page-content-top));
}


#questionnaireContainer.results {
	min-height: 0;
}
.results .uqPageListHeader {
	height: auto;
}

.results .uqPageListHeader .pageListPanelText {
	
}

/*
.results .uqPageListPanel {
	position: relative;
}


.results .uqPageListContainer {
	height: auto;
	max-height: none;
}
*/

ul.uqPageList {
	padding-left: 0;
	list-style: none;
	margin-left: 0;
}

ul.uqPageList li {
	position: relative;
	padding-bottom: 0.3em;
}

ul.uqPageList li a {
	color: var(--text-color);
	font-weight: normal;
	display: block;
	padding-left: 1.5em;
	position: relative;
}

ul.uqPageList li a:before {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	content: "\f05a";
	font-size: 1em;
	color: var(--text-question-light-color);
	width: 1.25em;
	left: 0;
	text-align: center;
}
/*
ul.uqPageList li.uqPage:after {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	font-size: 1em;
	top: 0;
	right: 0;
	content: "\f05a";
	color: var(--text-question-light-color);
}
*/
ul.uqPageList li.uqFormPage a:before {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	content: "\f059";
	font-size: 1em;
	color: var(--text-color);
	width: 1.25em;
	left: 0;
	text-align: center;
}

ul.uqPageList li.uqQuestionPage a:before {
	font-family: "Open Sans";
	content: attr(data-number);
	color: var(--text-color);
} 

ul.uqPageList li.uqQuestionPage:after,
ul.uqPageList li.uqFormPage:after {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	font-size: 1em;
	top: 0;
	right: 0;
	animation-name: questionAnsweredPopup;
	animation-duration: 0.5s;
}

ul.uqPageList li.uqQuestionAnswered a {
	color: var(--text-question-answered-color);
}

ul.uqPageList li.uqQuestionAnswered:after {
	content: "\f058";
	color: var(--text-question-answered-color);
}

ul.uqPageList li.uqQuestionDiffers:after {
	content: "\f06a";
	color: var(--link-color);
}

ul.uqPageList li.uqQuestionConfirmed:after {
	content: "\f058";
	color: var(--text-question-answered-color);
}

ul.uqPageList li.uqQuestionPending:after {
	content: "";
	color: var(--text-color);
}

ul.uqPageList li.uqQuestionChanged:after {
	content: "\f058";
	color: var(--link-color);
}


ul.uqPageList li.uqCurrentPage:before {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	content: "\f0da";
	font-size: 1.5em;
	left: -0.65em;
	color: var(--text-color);
	transition: right 0.25s;
}


.panel table.uqProducts {
	margin: 2em 0;
	background: var(--panel-question-background);
	color: var(--text-info-color);
}

.panel table.uqProducts tr > * {
	font-size: 1em;
	padding: 1.25em 1em;
}

.panel table.uqProducts th {
	color: var(--text-question-color);
	font-weight: bold;
}

.panel table.uqProducts td:first-child {
	font-weight: bold;
}

.panel table.uqProducts td:first-child small {
	font-weight: normal;
}


.panel table.uqProducts tr:last-child {
	border-bottom: 0;
}

.panel table.uqProducts tr > *:nth-child(4n+1) {
	width: calc(100% - 8em - 8em - 8em);
}

.panel table.uqProducts tr > *:nth-child(4n+2) {
	width: 8em;
	text-align: left;
}

.panel table.uqProducts tr > *:nth-child(4n+3) {
	width: 8em;
	text-align: left;
}

.panel table.uqProducts tr > *:nth-child(4n+4) {
	width: 8em;
	text-align: right;	
}

.inner {
    max-width: 1440px;
}



.panel p.uqChangesHeader {
	margin-top: -1em;
	font-size: 0.9em;
}

.panel p + div.uqChangesList {
	margin-top: 0;
}

.uqChangesList > div {
	display: flex;
	flex-direction: row;
}

.uqChangesList > div em.statusIcon {
	display: block;
	font-size: 2em;
	width: 40px;
	text-align: left;
	margin-bottom: 1.5rem;
}

.uqChangesList > div p {
	margin: 0.7rem 0 1.5rem 0;
	width: calc(100% - 40px);
}

.uqChangesList > div:last-child em.statusIcon,
.uqChangesList > div:last-child p {
	margin-bottom: 0;
}

.uqHeader {
	display: flex;
	align-items: center;
}

.uqHeader > * {
	width: 50%;
	margin-top: 0;
}

.uqHeader > h3 {
	font-size: 1.2em;
	text-align: right;
}

.panel .uqSmallCustomerTable {
	width: auto;
	margin-top: 0;
}

.panel .uqSmallCustomerTable tbody {
	width: auto;
}

.panel .uqSmallCustomerTable tr {
	vertical-align: middle;
}

.panel .uqSmallCustomerTable th,
.panel .uqSmallCustomerTable td {
	font-size: 1em;
	padding: 1em 2em 1em 0;
}

.panel .uqSmallCustomerTable th {
	font-size: 0.8em;
	opacity: 0.8;
}

.panel .uqSmallCustomerTable select {
	min-width: 220px;
}


@media screen and (max-width: 960px) {

	.uqHeader {
		display: block;
	}

	.uqHeader > * {
		width: 100%;
	}

	.uqHeaderText {
		text-align: left;
		margin-top: 0;
	}
}