:root
{
	--survey-content-min-height: 12em;
	--survey-font-family: ;
	--survey-font-size: ;
	--survey-spot-color: #6BB632;
	--survey-invalid-color: ;
	--survey-btn-icon-color: rgba(107,182,50,0.8);
	--survey-radio-checkbox-opacity: 0.9;
	--survey-disabled-opacity: 0.5;
	--survey-element-focus-color: transparent;
	--survey-element-nonfocus-opacity: 1.0;
	--survey-focus-visible-color: #6BB632;
	--survey-button-color: ;
	--survey-button-background-color: ;
	--survey-button-border-color: ;
	--survey-comment-color: ;
	--survey-comment-font-size: ;
	--survey-comment-font-style: ;
	--survey-comment-font-weight: ;
	--survey-intro-color: ;
	--survey-intro-font-size: ;
	--survey-intro-font-style: ;
	--survey-intro-font-weight: ;
	--survey-question-color: ;
	--survey-question-font-style: ;
	--survey-question-font-size: ;
	--survey-question-font-weight: ;
	--survey-note-color: ;
	--survey-note-font-size: ;
	--survey-note-font-style: ;
	--survey-note-font-weight: ;
	--survey-instruction-color: ;
	--survey-instruction-font-size: ;
	--survey-instruction-font-style: ;
	--survey-instruction-font-weight: ;
	--survey-option-color: ;
	--survey-option-font-size: ;
	--survey-option-font-style: ;
	--survey-option-font-weight: ;
	--survey-option-header-color: ;
	--survey-option-header-font-size: ;
	--survey-option-header-font-style: ;
	--survey-option-header-font-weight: ;
	--survey-option-specify-color: ;
	--survey-option-specify-font-size: ;
	--survey-option-specify-font-style: ;
	--survey-option-specify-font-weight: ;
	--survey-option-dk-color: ;
	--survey-option-dk-font-size: ;
	--survey-option-dk-font-style: ;
	--survey-option-dk-font-weight: ;
	--survey-option-none-color: ;
	--survey-option-none-font-size: ;
	--survey-option-none-font-style: ;
	--survey-option-none-font-weight: ;
	--survey-option-na-color: ;
	--survey-option-na-font-size: ;
	--survey-option-na-font-style: ;
	--survey-option-na-font-weight: ;
	--survey-option-nap-color: ;
	--survey-option-nap-font-size: ;
	--survey-option-nap-font-style: ;
	--survey-option-nap-font-weight: ;
}

.survey-content
{
	font-family: var(--survey-font-family);
	min-height: var(--survey-content-min-height);
	overflow: hidden;
}

.survey-content div, .survey-dialog div, .survey-button,
.survey-content input, .survey-content select, .survey-content textarea, .survey-content button,
.survey-dialog input, .survey-dialog select, .survey-dialog textarea, .survey-dialog button
{
	font-family: var(--survey-font-family);
	font-size: var(--survey-font-size);
}

.survey-content .survey-comment { color: var(--survey-comment-color); font-size: var(--survey-comment-font-size); font-style: var(--survey-comment-font-style); font-weight: var(--survey-comment-font-weight); }
.survey-content .survey-intro { color: var(--survey-intro-color); font-size: var(--survey-intro-font-size); font-style: var(--survey-intro-font-style); font-weight: var(--survey-intro-font-weight); }
.survey-content .survey-question { color: var(--survey-question-color); font-size: var(--survey-question-font-size); font-style: var(--survey-question-font-style); font-weight: var(--survey-question-font-weight); }
.survey-content .survey-note { color: var(--survey-note-color); font-size: var(--survey-note-font-size); font-style: var(--survey-note-font-style); font-weight: var(--survey-note-font-weight); }
.survey-content .survey-instruction { color: var(--survey-instruction-color); font-size: var(--survey-instruction-font-size); font-style: var(--survey-instruction-font-style); font-weight: var(--survey-instruction-font-weight); }

.survey-content .survey-comment strong { text-decoration:none }
.survey-content .survey-question strong {  }

.survey-content label>.survey-option { color: var(--survey-option-color); font-size: var(--survey-option-font-size); font-style: var(--survey-option-font-style); font-weight: var(--survey-option-font-weight); }
.survey-content label>.survey-option.survey-option_other { color: var(--survey-option-specify-color); font-size: var(--survey-option-specify-font-size); font-style: var(--survey-option-specify-font-style); font-weight: var(--survey-option-specify-font-weight); }
.survey-content label>.survey-option.survey-option_dk { color: var(--survey-option-dk-color); font-size: var(--survey-option-dk-font-size); font-style: var(--survey-option-dk-font-style); font-weight: var(--survey-option-dk-font-weight); }
.survey-content label>.survey-option.survey-option_none { color: var(--survey-option-none-color); font-size: var(--survey-option-none-font-size); font-style: var(--survey-option-none-font-style); font-weight: var(--survey-option-none-font-weight); }
.survey-content label>.survey-option.survey-option_na { color: var(--survey-option-na-color); font-size: var(--survey-option-na-font-size); font-style: var(--survey-option-na-font-style); font-weight: var(--survey-option-na-font-weight); }
.survey-content label>.survey-option.survey-option_nap { color: var(--survey-option-nap-color); font-size: var(--survey-option-nap-font-size); font-style: var(--survey-option-nap-font-style); font-weight: var(--survey-option-nap-font-weight); }
.survey-content label>.survey-option.system_option { }

.survey-content .survey-option-header { color: var(--survey-option-header-color); font-size: var(--survey-option-header-font-size); font-style: var(--survey-option-header-font-style); font-weight: var(--survey-option-header-font-weight); }

.survey-content .survey-option-ranking {     }
.survey-content .survey-statements-header { color:#333333;   }
.survey-content .survey-statements-row { color:#333333;   }
.survey-content .survey-statements-row.statement-header {   }

.survey-content .swipe-text .statement.survey-option {   }
.survey-content .swipe-text-only .statement.survey-option {   }

.survey-input-container div.active
{
	background-color: var(--survey-spot-color) /*{active-background-color}*/;
	color:#ffffff;  /*{active-color}*/;
	text-shadow: 0 /*{active-shadow-x}*/ 0 /*{active-shadow-y}*/ 0 /*{active-shadow-radius}*/ #ffffff /*{active-shadow-color}*/;
}

button.survey-button {
	-webkit-border-radius: 0.5em;
	border-radius: 0.5em;
    border-width: 1px;
    color: var(--survey-button-color);
    background-color: var(--survey-button-background-color);
	border-color: var(--survey-button-border-color);
}

div.survey-input-box div.disabled, div .survey-input-div.disabled, div.survey-statements-option div.disabled, *[disabled].survey-button
{
	opacity: var(--survey-disabled-opacity);
}

.survey-dialog
{
	background: #fff;
	cursor: default;
	box-shadow: 0 0 5px #000, 0 0 10px rgba(192,192,192,64);
	border-radius: 0.3em /*{global-radii-blocks}*/;
	-webkit-border-radius: 0.3em /*{global-radii-blocks}*/;
	overflow: hidden;
}

.survey-dialog-title
{
	height: 1.6em;
	padding-top: 0.3em;
	border-bottom: 1px solid #bbb;
	background: linear-gradient(#fff,#ddd);
	text-align: center;
	user-select: none; -webkit-user-select: none
}

.survey-dialog-content { padding: 1em; overflow: hidden }
.survey-dialog-content:first-child { padding-top: 2em }

.survey-error-border
{
	border: 1px solid #ff0000 !important;
}

.survey-input-box
{
	border-radius: 0.3em /*{global-radii-blocks}*/;
	-webkit-border-radius: 0.3em /*{global-radii-blocks}*/;
}

.survey-input-box .survey-input-div input, .survey-input-box .survey-input-div textarea
{
	width: 100%;
	display: block;
}

.survey-input-box .survey-input-div input, .survey-input-box .survey-input-div textarea, .survey-range-slider input
{
	line-height: 1.4em;
	padding: 0.4em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	min-height: 2.2em;
	text-align: left;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
}

.survey-range-wrap input.survey-range-input
{
	-webkit-border-radius: 0.5em /*{global-radii-buttons}*/;
	border-radius: 0.5em /*{global-radii-buttons}*/;
}

.survey-input-box .survey-input-div input:invalid
{
	color: var(--survey-invalid-color);
}

.survey-input-box select
{
	line-height: 1.4em;
	padding: 0.4em;
	display: inline-block;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	min-height: 2.2em;
	text-align: left;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
}

.survey-root .survey-question-label:focus-visible
{
	outline: none;
}

.survey-root *:focus-visible, .survey-root .survey-element-container .survey-commit-root *[tabindex]:focus-visible.survey-root *:focus-visible
{
	outline-color: var(--survey-focus-visible-color);
	outline-style: auto;
}

.survey-root *[role]:focus-visible, .survey-root .survey-range-input:focus-visible,.survey-root .survey-active-element:focus-visible 
{
	outline-offset: 0.25em;
}

.survey-root .survey-element-container
{
	opacity: 0.8;
}

.survey-root .survey-element-container
{
	opacity: var(--survey-element-nonfocus-opacity);
}

.survey-root .survey-element-container:focus-within
{
	outline: var(--survey-element-focus-color) solid 1px;
	outline-offset: 0.5em;
	opacity: 1;
}

.survey-input-box li:first-child > a { border-radius: 0.3em 0.3em 0px 0px; -webkit-border-radius: 0.3em 0.3em 0px 0px;  }
.survey-input-box li:last-child > a { border-radius: 0px 0px 0.3em 0.3em; -webkit-border-radius: 0px 0px 0.3em  0.3em; }
.survey-input-box .survey-thumbnail-box li:first-child > a img { border-top-left-radius: inherit; -webkit-border-top-left-radius: inherit;  }
.survey-input-box .survey-thumbnail-box li:last-child > a img { border-bottom-left-radius: inherit; -webkit-border-bottom-left-radius: inherit; }

.survey-radio-option .survey-option
{
	color:#333333;
}

/*
.survey-single-option:first-child
{ 
	border-top-left-radius: 0.3em;
	-webkit-border-top-left-radius: 0.3em;
	-moz-border-top-left-radius: 0.3em;
	border-top-right-radius: 0.3em;
	-webkit-border-top-right-radius: 0.3em;
	-moz-border-top-right-radius: 0.3em;
}

.survey-single-option:last-child
{
	border-bottom-left-radius: 0.3em;
	-webkit-bottom-left-border-radius: 0.3em;
	-moz-border-bottom-left-radius: 0.3em;
	border-bottom-right-radius: 0.3em;
	-webkit-border-bottom-right-radius: 0.3em;
	-moz-border-bottom-right-radius: 0.3em;
}
*/

.survey-single-option { background-color:transparent;border-color:transparent; }
.survey-single-option:not(.survey-option-header):not(.survey-option-separator):hover { background-color:#ffffff; }
.survey-single-option:not(.survey-option-header):not(.survey-option-separator):active { background-color:#f9f9f9; }

.survey-single-option.checked .survey-option {  }
.survey-single-option.checked .survey-radio {   }

*[role=radio] span.survey-radio
{
	opacity: var(--survey-radio-checkbox-opacity);
}

.survey-radio
{
	background-color: var(--survey-spot-color);
	-webkit-border-radius: 1em;
	border-radius: 1em;
}

.survey-multiple-option .survey-option
{
	color:#333333;
}

/*
.survey-multiple-option:first-child
{ 
	border-top-left-radius: 0.3em;
	-webkit-border-top-left-radius: 0.3em;
	-moz-border-top-left-radius: 0.3em;
	border-top-right-radius: 0.3em;
	-webkit-border-top-right-radius: 0.3em;
	-moz-border-top-right-radius: 0.3em;
}

.survey-multiple-option:last-child
{
	border-bottom-left-radius: 0.3em;
	-webkit-bottom-left-border-radius: 0.3em;
	-moz-border-bottom-left-radius: 0.3em;
	border-bottom-right-radius: 0.3em;
	-webkit-border-bottom-right-radius: 0.3em;
	-moz-border-bottom-right-radius: 0.3em;
}
*/

.survey-multiple-option { background-color:transparent;border-color:transparent; }
.survey-multiple-option:not(.survey-option-header):not(.survey-option-separator):hover { background-color:#ffffff; }
.survey-multiple-option:not(.survey-option-header):not(.survey-option-separator):active { background-color:#f9f9f9; }

.survey-multiple-option.checked .survey-option {  }
.survey-multiple-option.checked .survey-checkbox {   }

*[role=checkbox] span.survey-checkbox
{
	opacity: var(--survey-radio-checkbox-opacity);
}

.survey-checkbox
{
	background-color: var(--survey-spot-color);
	border-radius: 0.2em;
	-webkit-border-radius: 0.2em;
}

a .survey-option
{
	color:#333333;

}

/*
.survey-ranking-option:first-child
{ 
	border-top-left-radius: 0.3em;
	-webkit-border-top-left-radius: 0.3em;
	-moz-border-top-left-radius: 0.3em;
	border-top-right-radius: 0.3em;
	-webkit-border-top-right-radius: 0.3em;
	-moz-border-top-right-radius: 0.3em;
}

.survey-ranking-option:last-child
{
	border-bottom-left-radius: 0.3em;
	-webkit-bottom-left-border-radius: 0.3em;
	-moz-border-bottom-left-radius: 0.3em;
	border-bottom-right-radius: 0.3em;
	-webkit-border-bottom-right-radius: 0.3em;
	-moz-border-bottom-right-radius: 0.3em;
}
*/

.survey-ranking-option { background-color:transparent; border-color:transparent;  }
.survey-ranking-option:not(.survey-ranking-header):not(.survey-option-separator):hover { background-color:#ffffff; }
.survey-ranking-option:not(.survey-option-header):not(.survey-option-separator):active { background-color:#f9f9f9; }
.survey-ranking-option.checked { background-color: transparent; border-color: transparent; }
.survey-ranking-option.checked .survey-option
{
	
}

.survey-ranking-option.checked {   }
.survey-ranking-option.checked .survey-option {  }


.survey-distribute-points-sum .survey-input-box > div
{
	border-width: 1px;
	border-style: solid;
	border-radius: 0.3em;
	-webkit-border-radius: 0.3em;
}

.survey-distribute-points-sum .survey-input-box > div.checked
{
	background-color:var(--survey-spot-color);
}

.survey-image-list .survey-text-container
{
	color:#888888; 
}

/** TODO REMOVE *///
div.survey-input-box li.survey-image-container > a.checked
{
	border-color:var(--survey-spot-color);
}

div.survey-input-box li.survey-image-container > a.checked .survey-option
{
	color:#333333;
}

div.survey-input-box li.survey-image-container > a
{
	background-color:transparent
}

div.survey-input-box li.survey-image-container > a:hover
{
	background-color:#ffffff
}

div.survey-input-box li.survey-image-container > a:active
{
	background-color:#f9f9f9
}
/* END TODO REMOVE */

div.survey-input-box li.survey-image-container > [role].checked
{
	border-color:var(--survey-spot-color);
}

div.survey-input-box li.survey-image-container > [role].checked .survey-option
{
	color:#333333;
}

div.survey-input-box li.survey-image-container > [role]
{
	background-color:transparent
}

div.survey-input-box li.survey-image-container > [role]:hover
{
	background-color:#ffffff
}

div.survey-input-box li.survey-image-container > [role]:active
{
	background-color:#f9f9f9
}


.survey-range-slider .survey-slider-track
{
	-webkit-border-radius: 0.5em /*{global-radii-buttons}*/;
	border-radius: 0.5em /*{global-radii-buttons}*/;
}

.survey-range-slider .survey-slider-track .survey-slider-handle
{
	background-color: #f9f9f9 /*{d-body-background-color}*/;
	border-color: #555555 /*{d-body-border}*/;
	color:#333333;  /*{d-body-color}*/;
}

/*
.survey-statements-option .survey-single-option { border-radius: 0.3em 0.3em 0.3em 0.3em; -webkit-border-radius: 0.3em 0.3em 0.3em 0.3em;  }
.survey-statements-option:last-child .survey-single-option { border-radius: 0px 0.3em 0.3em 0px; -webkit-border-radius: 0px 0.3em 0.3em 0px; }

.survey-statements-option:first-child .survey-multiple-option{ border-radius: 0.3em 0px 0px 0.3em; -webkit-border-radius: 0.3em 0px 0px 0.3em;  }
.survey-statements-option:last-child .survey-multiple-option { border-radius: 0px 0.3em 0.3em 0px; -webkit-border-radius: 0px 0.3em 0.3em 0px; }
*/
.survey-statements-row:nth-of-type(even) { background-color:#f9f9f9 }
.survey-statements-row:nth-of-type(odd) { background-color:#e9e9e9 }

.survey-statements-option.survey-image-container a:hover
{
    outline: #555555 solid medium;
    z-index:1;
}
.survey-statements-option.survey-image-container a.checked
{
    outline: #333333 solid medium;
    z-index:1;
}


.survey-statements-option-theme1 {    }
.survey-statements-option-theme2 {    }
.survey-statements-option-theme3 {    }
.survey-statements-option-theme4 {    }
.survey-statements-option-theme5 {    }

/*
.survey-statements-option-theme1 {    }
.survey-statements-option-theme2 {    }
.survey-statements-option-theme3 {    }
.survey-statements-option-theme4 {    }
.survey-statements-option-theme5 {    }
*/

.survey-button-container
{
	
}

.survey-button-container .no-padding
{
	padding: 0;
	box-shadow: none;
}

.survey-button-bar.survey-align-center { text-align:center; }

.survey-button-bar.survey-align-justified .survey-button-finish { float: right }

.survey-button-close
{
	float: right;
}

.survey-button-exit
{
	float: right;
}

.survey-button-previous
{
	
/*	float:left; */
	
}

.survey-button-previous::after
{
	
}

.survey-button-previous img
{
	width:100%;
}

.survey-button-next
{
	
	float:right;
	
}

.survey-button-next::after
{
	
}

.survey-button-next img
{
	width:100%;
}

.survey-title
{
	display:inline-block;
	vertical-align:middle;
	overflow:hidden;
}

.survey-progress
{
	width:100%;
	vertical-align:middle;
	overflow:hidden;
	color:#333333; ;
	font-size:75%;
}

.survey-progress-text
{
}

div.portal-main-header-content .survey-progress
{
	display:inline-block;
}

div.portal-main-footer-content .survey-progress
{
	display:none;
}

.survey-progress-bar
{
	display:none;
	width: 100%;
}

div.survey-progress-percentage-bar .survey-progress-bar
{
	display:inline-block;
}

.survey-progress-bar-outer
{
	display:inline-block;
	width: calc(100% - 4em);
	height: 10px;
	line-height: 10px;
	border: 1px solid #333333;
	background-color: #ffffff;
	margin: 0 .3em;
	text-align:left;
}

.survey-progress-bar-inner
{
	display: block;
	background-color: var(--survey-spot-color);
	height:100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

div.survey-progress-percentage-bar .survey-progress-sections
{
	display: none;
}

.survey-progress-sections
{
	display: flex; align-items: center; flex-wrap: wrap; column-gap: 1em; row-gap: 1em;
}

.survey-progress-sections .survey-section
{
	flex: 1 1;
	text-align: center;
	font-size: 150%;
}

.survey-progress-sections .survey-section.active
{
	color: var(--survey-spot-color);
	font-weight: bold;
}

.survey-progress-sections .survey-section.passed
{
	color: var(--survey-spot-color);
}

.survey-section > div, .survey-section > img
{
	display: none;
}

.survey-progress-section-text .survey-section > div, .survey-progress-section-image-with-text .survey-section > div
{
	display: block; padding: 0.2em 1em
}

.survey-progress-section-image .survey-section> img, .survey-progress-section-image-with-text .survey-section > img
{
	display: inline;
}

.survey-section > img {	max-width: 100%; opacity: 0.35;  }

.survey-section.active > img { opacity: 1; transform: perspective(1px) scale3d(1.05, 1.05, 1.05); }

.ui-btn-icon-left:after, .ui-btn-icon-right:after, .ui-btn-icon-top:after, .ui-btn-icon-bottom:after, .ui-btn-icon-notext:after
{
	background-color: var(--survey-spot-color) /*{global-icon-color}*/;
	background-color: var(--survey-btn-icon-color) /*{global-icon-disc}*/;
}
