:root{
	--color-1: #f86524;
	--color-2: #5a5a5a;
	--color-3: #cc006a;
	--color-text: #848484;
	--color-background: #f5f5f5;
	--color-background-dark: #f2f2f2;
	--color-general: #777777;
	--color-general-overlay: #ffffff;
	--color-environment: #2d9bbc;
	--color-environment-overlay: #ffffff;
	--color-ethics: #fcbd1b;
	--color-ethics-overlay: #ffffff;
	--color-health: #c53308;
	--color-health-overlay: #ffffff;
	--color-labor: #70c2b4;
	--color-labor-overlay: #ffffff;
	--color-management: var(--color-3);
	--color-management-overlay: #ffffff;
	--color-red: var(--color-health);
	--color-amber: var(--color-ethics);
	--color-light-grey-module: #ededed;
	--color-learnster: #533d98;
	--color-learnster-overlay: #ffffff;
}

/****/

@font-face{
font-family: "Body"; font-style: normal; font-weight: 400;
src: url("../_lib/_media/fonts/lato-regular.woff2") format("woff2");
}

@font-face{
font-family: "Body"; font-style: italic; font-weight: 400;
src: url("../_lib/_media/fonts/lato-italic.woff2") format("woff2");
}

@font-face{
font-family: "Body"; font-style: normal; font-weight: 700;
src: url("../_lib/_media/fonts/lato-bold.woff2") format("woff2");
}

@font-face{
font-family: "Body"; font-style: italic; font-weight: 700;
src: url("../_lib/_media/fonts/lato-bolditalic.woff2") format("woff2");
}

@font-face{
font-family: "Header"; font-style: normal; font-weight: 700;
src: url("../_lib/_media/fonts/ubuntu-bold.woff2") format("woff2");
}

@font-face{
font-family: "Header"; font-style: italic; font-weight: 700;
src: url("../_lib/_media/fonts/ubuntu-bolditalic.woff2") format("woff2");
}

@font-face{
font-family: "Button"; font-style: normal; font-weight: 700;
src: url("../_lib/_media/fonts/ubuntu-bold.woff2") format("woff2");
}

/****/

.uiButton.reverse{
	background: var(--color-background-light-grey);
	color: var(--color-1);
}

.uiButton.reverse:hover, .uiButton.reverse:focus, .uiButton.reverse.current{
	background: var(--color-1);
	color: var(--color-1-overlay);
}

.learnsterButton{
	background: var(--color-learnster);
	color: var(--color-learnster-overlay);
}

th svg path{
	fill: var(--color-text);
}

.alertIcon.site{
	color: var(--color-1);
}

/****/

body{
	color: var(--color-text);
}

input, select, textarea{
    /*border-radius: 0;*/
}

.uiButton, .fileInput + label, .ui-dialog .ui-button, .ui-dialog .ui-button:hover, .ui-dialog .ui-button:focus, .uiButton.alertTag{
    /*border-radius: 0;*/
	text-transform: uppercase;
	font-size: 0.8em;
    padding: 1.5em;
}

.alertTag .uiButton.alertTag{
	font-size: 1em;
}

.alertTag{
    font-family: "Button", sans-serif;
    font-size: 0.8em;
    padding: 0.7em 1.6em;
}

.dataTable .iconColumn .uiButton{
    padding: 0.5em;
}

.dataTable td .fileInput + label{
    padding: 0.8em 0.6em;
}

.ui-dialog .ui-dialog-titlebar .ui-button{
    margin-top: -10px;
    padding: 1em;
}

.ui-dialog .ui-button-icon{
    text-indent: 0;
}

.ui-dialog-buttonpane .ui-button{
	min-width: 5em;
}

.functionButtons{
	font-size: 0.8em;
}

.functionButtons .uiButton{
    padding: 1em;
}

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

	.functionButtons{
		font-size: 0.85em;
	}

}

.tabButtons .uiButton{
    padding: 1em;
}

.secondaryTabs{
    margin-top: 2em;
}

/****/

#footerWrap{
    padding: 30px 5%;
    background: var(--color-2);
}

footer{
    text-align: right;
	color: var(--color-2-overlay);
}

footer a{
	font-weight: 700;
	color: var(--color-2-overlay);
}

footer a:hover{
    color: var(--color-1);
}

footer .social{
    margin-top: -5px;
    margin-bottom: 5px;
}

footer .social a{
    font-size: 1.8em;
    padding-left: 0.3em;
}

footer .social svg{
    height: 1em;
    width: auto;
    fill: #ffffff;
    position: relative;
    top: 0.1em;
}

footer .info .title{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-size: 1.4em;
}

footer .info .description{
	margin-top: 0.5em;
    opacity: 0.8;
    font-weight: 700;
}

footer .copyright{
    padding: 0;
}

footer .column-50{
    text-align: left;
}

footer .column-50:last-of-type{
    text-align: right;
}

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

	footer .column-50:last-of-type{
		text-align: left;
		margin-top: 2em;
		margin-bottom: 0;
	}

	footer .social a{
		padding-left: 0;
		padding-right: 0.5em;
	}

}

/****/

.navMenu li a{
    color: var(--color-text);
	text-transform: uppercase;
	font-size: 0.8em;
    border: 1px solid transparent;
}

.navMenu li a.current{
    color: var(--color-1);
    border-bottom-color: var(--color-1);
}

.navMenu li a:hover, .navMenu li a:focus{
    color: var(--color-2);
    border-bottom-color: var(--color-1);
}

.navMenu li.loginMenuItem a{
    /*border-radius: 0;*/
    padding: 1.5em 2.5em;
}

.navMenu li.loginMenuItem a:before{
    font-family: "FontAwesome";
	font-weight: 400;
	content: "\f023";
    margin-right: 0.5em;
}

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

	.navMenu li a.current, .navMenu li a:hover, .navMenu li a:focus{
		border-bottom-color: transparent;
	}

	.navMenu li.loginMenuItem a{
		padding: 0.8em 2.5em;
	}

}

/****/

.subMenuColumn{
    padding: 2em 0;
}

.subMenu{
	padding: 0;
    margin: 0;
    text-transform: none;
}

.subMenu li{
    font-size: 0.8em;
    list-style: none;
    padding: 0;
    margin-bottom: 0.8em;
}

.subMenu li a{
    color: inherit;
    font-weight: inherit;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
}

.subMenu li a:hover, .subMenu li a:focus{
    color: var(--color-2);
	text-decoration: none;
	outline: 0;
}

.subMenu li a.current{
    color: var(--color-1);
}

@media only screen and (max-width: 750px){
    
	.subMenuColumn{
		display: none;
	}

	.subMenuContentColumn{
		margin: 0;
		border-left: none;
		width: auto;
		padding: 0;
	}

	.subMenuContentColumn .adminModule{
		margin-top: 2em;
		margin-left: auto;
	}

}

/****/

.module{
	margin: 2em auto;
}

.module a{
	font-weight: 400;
}

.module a:not(.uiButton):hover, .module a:not(.uiButton):hover i{
	text-decoration: none;
    color: var(--color-2);
}

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

	.module .buttons .uiButton{
		width: 100%;
		margin: 0.2em auto;
	}
}

.module h1, .module h2, .module h3{
	text-transform: uppercase;
}

.module h1{
	font-size: 1.2em;
}

.module h2{
    margin: 2em 0 1em 0;
    font-size: 1.2em;
    text-transform: uppercase;
}

.module h3{
    margin: 1em 0;
    padding: 0.8em 1em;
    font-size: 0.8em;
    background: var(--color-1);
    color: var(--color-1-overlay);
	font-weight: 700;
	text-align: center;
}

.module p.note{
    font-size: 0.9em;
}

.module ul.pointer > li{
    position: relative;
    margin: 0 0 6px 2em;
    padding: 4px 8px;
    list-style: none;
    font-size: 1em;
}

.module ul.pointer > li:before{
	font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f0c8";
    position: absolute;
    top: 5px;
    left: -2em;
    width: 1.8em;
    margin-right: 8px;
    color: var(--color-3);
    text-align: center;
}

.module .illustration{
    max-width: 1000px;
    margin: 2em auto;
}

.module .strategy{
    border-top: 2px solid #ffffff;
    padding-top: 2em;
    border-bottom: 2px solid #ffffff;
    padding-bottom: 2em;
}

.module .buttons{
    text-align: left;
}

.homeAbout .buttons .uiButton{
	margin: 0.3em;
}

.module th a{
	font-weight: 700;
}

.module .informationBox{
    font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-size: 0.9em;
	padding: 1em;
	background-color: var(--color-background);
    border: 1px solid var(--color-border-grey);
	color: inherit;
}

.module .informationBox.alertTag{
	font-weight: 600;
	border: none;
	width: 100%;
	display: inline-block;
}

.sideColumn .adminModule .informationBox.alertTag{
	margin: 0.2em 0;
}

.module .foundationalCommitments{
    font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-size: 0.9em;
	padding: 1em;
    background: var(--color-2);
	color: var(--color-2-overlay);
	text-align: center;
}

.module .card{
	padding: 1.5em;
	margin: 1em auto;
	background: #ffffff;
    position: relative;
    font-size: 1em;
}

.module .card:hover{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

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

	.module .card{
		width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
	}

}

.module .auditSteps{
	margin: 4em auto;
}

.module .auditSteps .card{
	max-width: 600px;
	margin: 3em auto;
	padding-top: 1em;
    text-align: center;
}

.module .auditSteps .card .number{
	background: var(--color-1);
	display: inline-block;
	padding: 0.2em 0.5em;
	border-radius: 100px;
	color: #ffffff;
	font-family: "Header", sans-serif;
	font-size: 2em;
	position: relative;
	top: -1em;
}

.module .auditSteps .card .title{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-size: 1.2em;
	position: relative;
	top: -0.5em;
}

.module .auditSteps .card .text{
    text-align: left;
}

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

.module.flex .text{
	padding: 2em;
}

.module.flex .flexibleImage{
	max-width: 1000px;
}

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

	.module.flex .flexibleImage{
		display: none;
	}

}

.module.dark{
    background: var(--color-light-grey-module);
    padding: 2em;
}

.module.light{
    background: #ffffff;
    padding: 2em;
}

.module.grey{
    background: var(--color-2);
}

.module.orange{
    background: var(--color-1);
}

.module.grey, .module.orange{
    color: #ffffff;
}

.module.grey h1, .module.orange h1{
	color: #ffffff;
}

.module.dark h2, .module.light h2{
	margin: 0 0 1em 0;
}

.module.grey a:not(.uiButton), .module.orange a:not(.uiButton){
	color: #ffffff;
}

.module.grey a:not(.uiButton){
    opacity: 0.7;
}

.module.grey a:hover:not(.uiButton){
    color: var(--color-1);
    opacity: 1;
}

.module.orange a:not(.uiButton), .module.orange a:hover:not(.uiButton){
	color: var(--color-2);
}

.module.orange a:hover:not(.uiButton){
    opacity: 0.7;
}

.module.orange a.uiButton:hover{
    background: var(--color-2);
}

.module.center h2{
    color: var(--color-1);
}

.module.venue{
    margin-bottom: 0;
}

.module input.text, .module textarea{
    padding: 1.1em;
    background: #ffffff;
    border-color: transparent;
}

.module input.text:hover, .module input.text:focus, .module textarea:hover, .module textarea:focus{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.module.breakout{
    padding: 2em 5%;
    margin: -0.1% 0;
    max-width: none;
	font-size: 1em;
}

.module.breakout .column-25{
	text-align: right;
}

.module.breakout p{
	margin: 0.5em 0;
	font-weight: 700;
}

.module.breakout p.note{
	font-size: 0.9em;
}

.module.breakout a{
	font-weight: 700;
}

.module.breakout input.text{
    background: var(--color-text);
    color: #ffffff;
}

.module.breakout input.text:focus{
    background: #ffffff;
    color: var(--color-text);
}

.module.breakout .informationBox{
    padding: 1em 4em;
}

@media only screen and (min-width: 900px){

	.module.breakout form{
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
		align-content: center;
		align-items: center;
	}

	.module.breakout .formInput{
		flex: 1 1 200px;
		padding: 0.3em;
		margin: 0;
	}

	.module.breakout .formInput.submit{
		flex: 0 0 15em;
	}

	.module.breakout .formInput.submit .uiButton{
		width: 100%;
	}

}

.module.breakout h1{
    border: 0;
    padding: 0;
}

.module.breakout .address a{
    color: inherit;
    opacity: 0.7;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    font-weight: 400;
    font-size: 1em;
}

.module.breakout .googleMap{
    height: 350px;
    margin: 1em 0;
    overflow: hidden;
    text-align: center;
}

.module.breakout.mailingListModule{
	margin-bottom: -1.1%;
}

.mailingListModule input.text{
	width: 100%;
}

/****/

.conferencesModule .flexibleImage{
	max-width: 700px;
	margin: 2em auto 0 auto;
}

.videoModule{
	max-width: 700px;
}

.videoModule p{
	margin: 0.5em 0;
	font-weight: 700;
	font-size: 1em;
}

.videoModule p a{
	font-weight: 700;
}

/****/

.adminModule{
    background: #ffffff;
    border-color: transparent;
    /*border-radius: 0;*/
}

.adminModule a{
	font-weight: 400;
}

.adminModule a:not(.uiButton):hover{
	text-decoration: none;
    color: var(--color-2);
}

.adminModule h1, .adminModule h2, .adminModule h3{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
}

.adminModule.survey h2 .note{
	font-family: "Body", sans-serif;
	text-transform: none;
	padding-top: 0.5em;
}

.adminModule h1{
	font-size: 1.2em;
	opacity: 0.9;
}

.adminModule h1 svg{
    height: 1em;
    width: auto;
    margin-right: 0.3em;
}

.adminModule h1 svg path{
    fill: var(--color-text);
}

.adminModule h2, .adminModule .markdown h1, .sideColumn .adminModule h1{
    font-size: 1em;
    text-transform: uppercase;
    color: inherit;
}

.adminModule h2{
    margin: 2em 0 1em 0;
}

.sideColumn .adminModule h1, .sideColumn .adminModule p.note{
    text-align: center;
}

.sideColumn .adminModule .markdown h1{
    text-align: left;
    font-size: 0.9em;
    margin: 3em 0 0 0;
    padding-bottom: 0.5em;
    border-bottom: 1px solid var(--color-border-grey);
}

.sideColumn .adminModule address{
    margin: 2em 0;
}

.adminModule h3{
    margin: 3em 0 2em 0;
    padding: 0 0 0.5em 0;
    font-size: 0.8em;
    border-bottom: 1px solid var(--color-border-grey);
    background: none;
    color: currentColor;
	font-weight: 700;
}

.adminModule p.note{
    font-size: 0.9em;
}

.adminModule .illustration{
    max-width: 750px;
    margin: 40px auto;
}

.adminModule th a{
	font-weight: 700;
}

.centeredButtons .languageFilter select{
    padding: 0.6em;
    margin: 1em 0;
    width: 100%;
}

.adminModule .informationBox{
	background-color: var(--color-background);
	color: inherit;
    font-family: "Header", sans-serif;
	font-size: 0.9em;
}

.adminModule .informationBox.alertTag{
	font-weight: 600;
	border: none;
	width: 100%;
	display: inline-block;
}

.adminModule .card{
	padding: 1em;
	margin: 1em auto;
	background: var(--color-background);
    position: relative;
    font-size: 1em;
}

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

	.adminModule > .card{
		width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
	}

}

.adminModule.contactDetails .fa{
	margin-right: 0.5em;
}

/****/

.alertTag{
    /*border-radius: 0;*/
}

/****/

.bannerGradient{
	background: transparent linear-gradient(117deg, var(--color-1) 50%, var(--color-management) 100%) 0% 0% no-repeat padding-box;
    height: 175px;
	margin-top: -1.1%;
	position: relative;
}

.bannerGradient.large{
    height: 400px;
}

.bannerWrap.hero{
	height: 100%;
    background-size: cover;
    background-position: center center;
    opacity: 0.5;
	mix-blend-mode: screen;
	position: absolute;
}

.bannerWrap.hero.homeBanner{
    background-image: url("../_media/images/banner_home.jpg");
}

.bannerWrap.hero.aboutBanner{
    background-image: url("../_media/images/banner_about.jpg");
}

.bannerWrap.hero.whatBanner{
    background-image: url("../_media/images/banner_what.jpg");
}

.bannerWrap.hero.newsBanner{
    background-image: url("../_media/images/banner_news.jpg");
}

.bannerWrap.hero.eventsBanner{
    background-image: url("../_media/images/banner_events.jpg");
}

.bannerWrap.hero.resourcesBanner{
    background-image: url("../_media/images/banner_resources.jpg");
}

.bannerWrap.hero.contactBanner{
    background-image: url("../_media/images/banner_contact.jpg");
}

.banner.module{
    position: relative;
    max-width: none;
	width: 100%;
	height: 100%;
    padding: 3% 5%;
    margin: 0;
}

.banner .bannerContent{
    max-width: 600px;
    position: absolute;
    bottom: 30%;
}

.banner.module h1{
    color: #ffffff;
    font-size: 3em;
    line-height: 1;
}

.banner.module .bannerButtons{
    margin-top: 1.5em;
}

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

	.home .banner.module h1{
		font-size: 2.6em;
		width: 80%;
	}

}

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

	.home .banner.module h1{
		font-size: 2.1em;
		width: 80%;
	}

}

/***/

.home .organisations.tiledLinks{
	height: 72px;
	overflow: hidden;
}

.home .organisations.tiledLinks{
	align-content: flex-start;
}

.home .organisations.tiledLinks .tile{
	width: 150px;
	height: 72px;
	margin: 0;
	padding: 0;
}

.home .tiledLinks .tile:hover{
	box-shadow: none;
}

.homeAbout{
	position: relative;
	margin: 5% auto;
}

.homeAbout .card{
	background: #ffffff;
	padding: 3em;
}

.homeAbout .card p{
	font-size: 1em;
}

@media screen and (min-width: 1200px){

	.homeAbout{
		width: 80%;
	}

	.homeAbout .flexibleImage{
		margin-left: 20%;
		width: 80%;
	}

	.homeAbout .card{
		position: absolute;
		top: 2%;
		left: 0;
		width: 50%;
	}

}

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

	.homeAbout{
		max-width: 900px;
	}

}

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

	.homeAbout .uiButton{
		width: 100%;
		margin: 0.1em auto;
	}

}

/****/

.module.breakout.promotionModule{
    padding: 0.1em 5%;
}

.module.breakout.promotionModule .flexibleImage{
    width: 120px;
    padding: 5px;
}

.module.breakout.promotionModule .flexWrap{
	align-items: center;
}

.module.breakout.promotionModule .flexWrap > .flexibleImage{
	flex: 0 0 120px;
}

.module.breakout.promotionModule .flexWrap > .buttons{
	flex: 0 0 120px;
}

.module.breakout.promotionModule .flexWrap > .text{
	flex: 1 1 400px;
    padding: 5px;
}

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

	.module.breakout.promotionModule .flexibleImage{
		display: none;
	}

	.module.breakout.promotionModule{
		padding: 2em 5%;
	}

}

/****/

.module.breakout.twitterFeed{
    font-size: 1.2em;
    font-weight: 700;
}

.tweet{
    margin: 1.5em auto;
	max-width: 700px;
}

.tweet .time{
	margin-top: 1em;
    font-size: 0.7em;
}

/****/

.keywords li, .keywords .dataTable.sortable tr{
    padding: 0.2em 1em;
    background: transparent;
}

.keywords li, .keywords .dataTable.sortable tr, .keywordFilter .keywordSelect, .keywordFilter .keywordSelect select, .clearFiltersButton{
	text-transform: uppercase;
}

.keywords li, .keywords .dataTable.sortable tr{
	font-size: 0.7em;
}

.keywordFilter .keywordSelect, .clearFiltersButton{
    padding: 1em 1em;
    margin: 0.3em 0.2em 0.3em 0;
	font-size: 0.6em;
	/*border-radius: 0;*/
}

.keywordFilter .keywordSelect, .clearFiltersButton{
	background: var(--color-light-grey-module);
	color: var(--color-2);
}

.keywordFilter .keywordSelect .uiButton{
	color: var(--color-2);
}

.keywordFilter .keywordSelect:hover, .keywordFilter .keywordSelect:hover select{
	color: #ffffff;
	background: var(--color-2);
}

.keywordFilter .keywordSelect:hover .uiButton{
	color: #ffffff;
}

.keywords .assessmentType li:before, .keywordFilter .assessmentType:before{
    content: "\f0ea";
}

.keywords .auditSection li:before, .keywordFilter .auditSection:before{
    content: "\f0ca";
}

.keywords .committee li:before, .keywordFilter .committee:before{
    content: "\f0c0";
}

.keywords .training li:before, .keywordFilter .training:before{
    content: "\f19d";
}

.keywords .event, .keywords .topic{
    display: block;
}

.filterWrap div.search{
    /*border-radius: 0;*/
    background: #ffffff;
}

.filterWrap div.search:hover{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/****/

.resources .pageChooser{
	text-align: center;
}

/****/

.profile h1{
    display: inline-block;
    margin: 0.5em 0 0 0;
}

.profile .role{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    font-size: 1em;
    margin: 0.5em 0;
}

.profile .jobTitle{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    margin: 0.5em 0;
}

.profile .description{
    margin: 2em 0;
}

.profile .quote{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--color-1);
	background: #ffffff;
	padding: 0.5em 2em;
	font-size: 0.9em;
}

.profile .quote p:first-child:before{
	content: "“";
	padding-right: 0.2em;
}

.profile .quote p:last-child:after{
	content: "”";
	padding-left: 0.2em;
}

.profile .social{
    margin-top: 1em;
}

footer .social svg{
    height: 1em;
    width: auto;
	color: var(--color-1);
    position: relative;
    top: 0.1em;
	margin-right: 0.1em;
}

.profile .infoBox h3{
    border-top: none;
    padding-top: 0;
    margin-top: 0;
}

.profile .flexibleImage{
	max-width: 400px;
	margin: auto;
}

.profile img{
    border: none !important;
    -webkit-filter: grayscale(1);
	filter: grayscale(1);
}

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

	.profile .image2{
		width: 80%;
		display: block;
		margin-top: 2em;
	}

	.profile .twitter, .profile .linkedIn{
		font-size: 1em;
	}

}

/****/

.captionCards{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: flex-start;
}

.home .captionCards{
	margin-top: -50px;
}

.home .captionCard{
	z-index: 2;
	height: 275px;
}

.captionCard{
	position: relative;
	background-color: #ffffff;
	border: 0;
	margin: 1em 0;
	text-align: center;
	margin: 5px;
	max-width: 450px;
}

.captionCard:hover{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.captionCard{
	flex: 1 1 280px;
}

.captionCard .flexibleImage{
	height: 175px;
	overflow: hidden;
}

.captionCard svg{
	margin: 3em auto 2em auto;
	width: 30%;
	text-align: center;
}

.captionCard .userImage svg{
	margin: 0;
	width: 100%;
}

.captionCard .uiButton, .captionCard .uiButton:hover{
	background: transparent;
}

.captionCard .uiButton{
	color: var(--color-text);
}

.captionCard .content{
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 0.5em 2em;
	background: #ffffff;
}

.captionCard .content .title{
    margin: 0.5em;
}

.captionCard .title{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    color: var(--color-1);
    margin: 1.5em;
    text-align: center;
}

.captionCard .text{
	font-size: 0.9em;
	display: none;
}

.captionCard:hover .uiButton{
	color: #ffffff;
}

.captionCard:hover .content .title{
	color: #ffffff;
}

.captionCard:hover .content{
	background: var(--color-1);
	color: #ffffff;
}

/****/

.membershipTotals{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	color: var(--color-1);
	font-size: 1.2em;
}

.membershipTotal{
	border-top: 4px solid var(--color-1);
	border-bottom: 4px solid var(--color-1);
	margin: 1em;
	padding: 0.8em;
}

.membershipTotal .number{
	font-size: 4.5em;
	line-height: 0.8em;
	padding-right: 0.1em;
}

.membershipTotals{
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: row wrap;
}

.membershipTotal{
	flex: 1 1 100px;
}

.membershipTotal{
	display: flex;
	align-items: flex-end;
}

/****/

.memberResponsibilities{
	font-size: 1em;
}

.memberResponsibilities th{
	font-family: "Body", sans-serif;
	text-transform: uppercase;
	padding: 2em 0;
}

.memberResponsibilities .full{
	background: #ffffff;
	color: var(--color-1);
}

.memberResponsibilities .fa{
	font-size: 0.8em;
}

.memberResponsibilities tr:hover td{
	background: #ffffff;
}

/****/

.captionCards.team{
	justify-content: center;
}

.captionCards.team .captionCard{
	margin: 5px;
	max-width: 275px;
	flex: 1 1 275px;
}

.captionCards.team .captionCard .detail{
	padding: 0 0.3em 0.3em 0.3em;
}

.captionCards.team .captionCard .flexibleImage{
	height: 275px;
}

.captionCards.team .captionCard.small{
	margin: 5px;
	max-width: 175px;
	flex: 1 1 175px;
}

.captionCards.team .captionCard.small .flexibleImage{
	height: 175px;
}

.sideColumn .captionCards.team .captionCard, .committee .captionCards.team .captionCard{
	max-width: 120px;
}

.sideColumn .captionCards.team .captionCard, .committee .captionCards.team .captionCard{
	flex: 1 1 120px;
}

.sideColumn .captionCards.team .captionCard .flexibleImage, .committee .captionCards.team .captionCard .flexibleImage{
	height: 120px;
}

.captionCards.team img{
    -webkit-filter: grayscale(1);
	filter: grayscale(1);
}

.captionCards.team .title{
	margin: 0.8em 0 0 0;
	font-size: 0.9em;
}

.captionCards.team .role{
	margin: 0.3em 0 0 0;
	font-size: 0.8em;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-weight: 700;
}

.captionCards.team .jobTitle{
	margin: 1em 0;
	font-size: 0.8em;
	font-weight: 700;
}

/****/

.partner img{
	border: 0;
    width: 100%;
    max-width: 250px;
    height: auto;
}

.partner h2{
	margin: 0;
}

@media only screen and (min-width: 1000px){

	.partner .imageDetail{
		align-items: center;
	}

}

/****/

.testimonial .author, .testimonial .jobTitle, .testimonial .supplierGroup{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
	margin-top: 0.4em;
}

.testimonial .author{
	font-weight: 600;
}

.testimonial .jobTitle{
	font-size: 0.9em;
}

/****

.auditFirm:hover, .auditFirm.expanded{
    border: 1px solid var(--color-2);
}

.auditFirm .expandToggle{
	background: var(--color-1);
    padding: 1.5em;
    color: #ffffff;
  	font-weight: 700;
  	font-family: "Header", sans-serif;
	text-transform: uppercase;
}

.auditFirm:hover .expandToggle, .auditFirm.expanded .expandToggle{
	background: var(--color-2);
}

.auditFirm:after{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f067";
    position: absolute;
    top: 1.5em;
    color: #ffffff;
    right: 1em;
}

.auditFirm.expanded:after{
    content: "\f068";
}





.principlesSmall .principleInfo{
    font-size: 0.5em;
    width: 180px;
	margin: 0;
}

.principleInfo.legislationIssue{
    max-width: 750px;
}

****/

.auditFirm{
    margin: 0.5em auto;
    position: relative;
    border: 1px solid var(--color-1);
}

.auditFirm:hover{
    border: 1px solid var(--color-2);
}

.auditFirmDisplay{
    padding: 0.5em 2em 1em 2em;
}

.auditFirmDetail{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	gap: 1em;
	margin-top: 2em;
}

.auditFirm .showcaseHeader{
    display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em;
	gap: 2em;
	background: var(--color-1);
}

.auditFirm:hover .showcaseHeader{
    background: var(--color-2);
}

.auditFirm .showcaseHeader h1{
    flex-grow: 1;
    text-align: left;
	padding: 0;
	color: var(--color-1-overlay);
  	font-family: "Header", sans-serif;
	text-transform: uppercase;
	font-size: 1em;
}

.auditFirm > .showcaseHeader .expandIcon{
    width: 50px;
    height: 50px;
    flex-shrink: 0;
}

.auditFirm > .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.auditFirm .showcaseHeader.expanded .expandIcon.more, .auditFirm .showcaseHeader .expandIcon.less{
    display: none;
}

.auditFirm .showcaseHeader.expanded .expandIcon.less, .auditFirm .showcaseHeader .expandIcon.more{
    display: flex;
}

.auditFirm .contactDetails{
    font-size: 0.9em;
    width: 300px;
}

.auditFirm .resourceLink{
    width: 300px;
}

.auditFirm .contactDetails .contactName{
  	font-weight: 700;
}

.auditFirm .contactDetails div{
    margin-top: 0.5em;
}

.auditFirm div.website{
    margin-top: 1em;
    margin-bottom: 1em;
}

/****/

.attendanceProfile{
	width: 22%;
	margin: 1%;
	padding: 1%;
	display: inline-block;
	font-size: 0.6em;
	vertical-align: top;
}

.attendanceProfile h1{
	margin: 0.5em 0 0 0;
}

.attendanceProfile .role{
	font-weight: 700;
}

.attendanceProfile .role{
	font-size: 0.9em;
}

/****/

.session{
    background: var(--color-background);
    font-weight: 400;
    font-size: 0.9em;
	margin: 1em auto;
    padding: 1em 5%;
    position: relative;
}

.session h1{
    font-size: 1.1em;
}

.session h1 .date{
	margin-top: 0.5em;
    font-size: 0.8em;
}

.session .displayToggle:after{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f067";
    position: absolute;
    top: 1.5em;
    right: 2em;
}

.session .displayToggle.expanded:after{
    content: "\f068";
}

.session .description{
    margin: 1em 0;
}

.session .informationBox{
    margin-bottom: 0;
}

.session .markdown li{
	background-color: var(--color-background);
}

/****/

.speakers{
    margin: 2em 0;
}

.speaker{
    background: var(--color-background);
    font-weight: 400;
    font-size: 0.9em;
    margin: 0.5em 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.speaker .image{
    text-align: center;
    padding: 1.5em;
    flex: 1;
}

.speaker .image img{
    border-radius: 1000px;
    border: 0;
    width: 100%;
    min-width: 150px;
    max-width: 200px;
}

.speaker .detail{
    flex: 4;
    padding: 1em;
    min-width: 200px;
}

.speaker .name{
    font-weight: 700;
    font-size: 1.3em;
    margin-bottom: 0.5em;
}

.speaker .company{
    font-size: 1.1em;
    opacity: 0.6;
    font-weight: 400;
}

.speaker .twitter{
    margin: 0.9em 0 0 0;
}

.speaker .twitter:before{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f099";
    color: var(--color-3);
}

.speaker .description{
    margin: 1em 0;
}

/****/

.pageChooserMore{
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.05);
    max-width: 750px;
	text-transform: uppercase;
	font-size: 0.9em;
}

.pageChooserMore:hover{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.pageChooserMore a:hover{
    text-decoration: none;
}

/****/

.googleMapFallback{
    display: none;
}

.host{
	margin: 1em;
	color: var(--color-1);
}

.host .flexibleImage{
	display: inline-block;
	max-width: 150px;
	margin: 1em;
}

/****/

.secretariatLogo{
    text-align: center;
    margin: 2em auto;
    max-width: 200px;
}

/****/

.audit{
	position: relative;
	padding: 10px;
	margin: 20px 0;
}

.audit h2{
	font-size: 1.1em;
}

.audit .title{
	font-weight: 700;
}

.audit .company{
	font-size: 0.8em;
}

.audit .date{
	margin-bottom: 0.5em;
	font-size: 0.8em;
}

.audit .buttons{
	margin-bottom: 2em;
}

.audit .expandToggle{
	text-align: right;
	margin-top: 1em;
}

.auditInfo{
	margin: 40px 20px;	
}

/****/

.auditSectionAuditSubsections .name{
	font-weight: 700;
}

/****/

.auditFindingsTable .note{
	font-size: 0.9em;
}

.auditFindingResponses .created{
	font-weight: 700;
	font-size: 0.9em;
	padding-right: 1em;
}

/****/

.submitProposal .reversedInput .labelSpan{
	font-size: 1.2em;
	padding-top: 0.4em;
	font-weight: 400;
}

.submitProposal .reversedInput .labelSpan a{
	font-size: 1em;
}

.sessions .reversedInput .labelSpan{
	font-size: 1em;
	padding: 1rem 0;
}

/****/

.createBuddy .topicsList{
	margin-top: 1em;
	margin-bottom: 3em;
}

.createBuddy .topicsList h2{
	margin-top: 2em;
	margin-bottom: 0.5em;
}

.createBuddy .topicsList .labelSpan{
	padding-top: 1em;
}

/****/

form.editUserNotifications .expandToggle, form.editOrganisationLapsePeriods .expandToggle{
    margin: 10px auto;
    text-align: center;
}

.dataTable td.total{
	font-weight: 700;
}

.dataTable tr.total th, .dataTable tr.total td{
	border-bottom-color: transparent;
	padding-top: 1em;
}

/****/

.filterWrap{
    max-width: 750px;
}

.filterWrap div.search .uiButton, .filterWrap div.search .uiButton:hover{
    color: var(--color-text);
}

.filterWrap div.search .uiButton{
    top: 0.7em;
}

.filterWrap div.search input{
    box-shadow: none !important;
}

.filterWrap .expandToggle{
    color: var(--color-1);
	font-family: "Button", sans-serif;
	text-transform: uppercase;
}

/****/

.tiledLinks .tile:hover, .tiledLinks .tile:focus{
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.tiledLinks .tile a:hover, .tiledLinks .tile a:focus{
	border-color: transparent;
}

.tiledLinks .tile a:hover:after, .tiledLinks .tile a:focus:after{
    color: var(--color-1);
}

/****/

.keyResources{
	line-height: 1.2;
    margin: 2em auto;
    text-align: center;
}

.keyResources.flex{
	display: flex;
	align-items: stretch;
	justify-content: center;
	flex-flow: row wrap;
}

.keyResource{
	margin: 0.2em;
	padding: 1em;
	background: var(--color-1);
	color: #ffffff;
	text-align: left;
	display: flex;
	gap: 1em;
	align-items: center;
    border-radius: 3px;
}

.keyResourceContent{
	flex: 5;
}

.keyResource.upcoming{
	opacity: 0.6;
}

.keyResources.flex .keyResource{
	width: 32%;
	min-width: 250px;
	position: relative;
}

.keyTopics.flex .keyResource{
	height: 150px;
}

.keyAuditResources.flex .keyResource{
	width: 48%;
}

.home .keyResources.flex .keyResource{
	width: 24%;
}

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

	.keyAuditResources.flex .keyResource, .keyResources.flex .keyResource{
		width: 100%;
	}

}

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

	.home .keyResources.flex .keyResource{
		width: 100%;
	}

}

.keyResource:hover{
	background: var(--color-2);
}

.resourceType{
	font-size: 0.8em;
	font-weight: 700;
	opacity: 0.8;
	display: flex;
	align-items: center;
}

.resourceType svg{
	height: 1.3em;
	width: auto;
	margin-right: 0.5em;
}

.resourceType svg *{
	fill: #ffffff;
}

.keyResource .name{
	font-family: "Header", sans-serif;
    margin: 0.5em 0;
	text-overflow: ellipsis;
}

.resourceCompletedToggle{
	font-size: 2.5em;
}

.resourceCompletedToggle .modifiedDate{
	font-size: 0.3em;
	text-align: center;
    margin: 0.3em;
}

.keyResource:hover a .resourceCompletedToggle i{
	color: #ffffff;
}

.resourceCompletedToggle svg{
    vertical-align: inherit;
}

.resourceCompletedToggle button{
	padding: 0.15em 0.3em;
}

.resourceCompletedToggle .tickCross{
	font-size: 0.8em;
	padding: 0.15em 0.3em;
}

/****/

.post{
	padding: 1em;
	margin: 1% auto;
	max-width: 750px;
}

.post .postContent{
	padding: 1em;
}

.post .summary{
	font-weight: 400;
	margin-bottom: 2em;
}

.post .alertTag div{
	display: inline-block;
	vertical-align: middle;
	padding: 0 0.2em;
}

.post .alertBanner .uiButton{
	background: rgba(0, 0, 0, 0.05) !important;
	line-height: 2;
	min-width: 5em;
	margin: 0;
}

.post .alertBanner  .uiButton.alertTag{
	font-size: 0.8em;
}

.post .alertBanner .uiButton:hover{
	background: rgba(0, 0, 0, 0.1) !important;
}

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

	.post .alertBanner .buttons{
		margin-top: 1em;
	}

}

.post h1{
	margin-bottom: 0.5em;
	color: var(--color-1);
}

.post h1 a, .post h1 a:hover{
	color: inherit;
}

.post .markdown h1{
	font-size: 1em;
	margin-top: 2em;
}

.post .type{
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    font-size: 0.8em;
    opacity: 0.8;
}

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

	.post .type{
		text-align: center;
	}

}

.post .googleMap{
    height: 340px;
    margin: 1em 0;
    overflow: hidden;
    text-align: center;
}

.post .tiledLinks{
    margin: 0;
}

.post .tiledLinks .tile{
    width: 150px;
    height: 72px;
}

.post .tiledLinks .tile:hover{
    box-shadow: none;
}

.post .tiledLinks .tile a:hover:after, .post .tiledLinks .tile a:focus:after{
    content: '';
}

.post .expandToggle{
	padding: 1em;
    font-family: "Button", sans-serif;
	text-transform: uppercase;
	font-size: 0.8em;
	color: var(--color-1);
	background-color: var(--color-background);
	margin: 1.5em auto;
	text-align: center;
	max-width: 450px;
}

.post .keywords{
	margin-bottom: 0;
    text-align: center;
}

.post .centeredButtons{
	margin-top: 3em;
}

.post .postActions{
	line-height: inherit;
	font-size: 1em;
	text-align: right;
}

.post .postActions form{
	width: auto;
}

.post .postActions .buttons{
	text-align: right;
}

.post .postActions .uiButton{
	min-width: 1em;
	height: auto;
	line-height: 1;
	display: inline-block;
}

.post .postActions .uiButton:hover{
	color: var(--color-2);
	text-decoration: none;
}

.post .postActions .uiButton.grey{
	color: var(--color-1);
}

.post .postActions .uiButton.site{
	color: var(--color-2);
}

.post .postActions .uiButton span{
	font-size: 0.6em;
	margin-left: 0.1em;
}

.post .postActions .tickCross, .post .postActions .uiButton{
	font-size: 2em;
	color: var(--color-1);
	padding: 0;
	-webkit-transition: color 0.15s ease;
	-moz-transition: color 0.15s ease;
	-o-transition: color 0.15s ease;
	transition: color 0.15s ease;
	background: transparent;
}

.post .postActions .tickCross.status-ticked{
	color: var(--color-2);
}

.post .postActions .tickCross.status-unticked{
	color: var(--color-1);
}

.post .postActions .note{
	margin-bottom: 0.5em;
	padding-right: 0.5em;
	vertical-align: bottom;
	display: inline-block;
}

.post .flexibleImage, .post .videoWrap{
    margin-bottom: 2em;
}

.post .flexibleImage img{
  object-fit: cover;
  object-position: center;
  max-height: 340px !important;
  height: 50vw !important;
}

.post .type{
	vertical-align: middle;
	padding-bottom: 0.5em;
	margin-bottom: 1em;
	color: var(--color-1);
	border-bottom: 2px solid var(--color-1);
	font-weight: 700;
}

.post .type svg{
	width: auto;
	height: 1em;
	margin-right: 0.2em;
	display: inline-block;
	vertical-align: middle;
}

.post .type svg path{
	fill: var(--color-1);
}

/****/

.pollResults{
	margin: 2em auto 1em auto;
	width: 90%;
}

.pollResults .expandToggle{
	text-align: center;
	font-size: 0.8em;
	margin: 1em;
    color: var(--color-1);
}

.pollResults .information{
	font-weight: 700;
	text-align: center;
	font-size: 0.8em;
	color: inherit;
	opacity: 0.5;
}

.pollResults .uiButton{
	width: 100%;
	margin-bottom: 0.5em;
	white-space: normal;
}

.pollResults .response{
	margin-bottom: 1em;
}

.pollResults .uiButton.current{
	color: var(--color-1) !important;
	border-color: var(--color-1) !important;
	background-color: #ffffff !important;
}

.pollResults .uiButton.current:before{
	font-family: "FontAwesome";
  	font-weight: 400;
	content: "\f00c";
	padding-right: 0.2em;
}

.pollResults .answer{
	margin-bottom: 0.8em;
	font-size: 0.9em;
}

.pollResults .answer.current{
	font-weight: 700;
}

.pollResults .answer.current:before{
	font-family: "FontAwesome";
  	font-weight: 400;
	content: "\f00c";
	padding-right: 0.2em;
}

.pollResults .barWrap{
	width: 100%;
}

.pollResults .bar{
	height: 1.8em;
	background: var(--color-1);
	position: relative;
}

.pollResults .percentage{
	font-size: 0.9em;
	color: var(--color-1);
	position: absolute;
	right: -2.5em;
	top: 0.4em;
}

.pollResults .bar.wide .percentage{
	right: 0.5em;
	color: #ffffff;
}

.pollResults .uiButton{
	display: block;	
}

.pollResults .responseText{
	margin-top: 0.5em;
	font-size: 0.8em;
	opacity: 0.8;
	line-height: 1.2;
}

.pollAnswers td.note{
	padding: 1em;
}

.createAnswer{
	margin-top: 1em;
	margin-bottom: 1em;
}

.pollResponses{
	border-top: 1px solid var(--color-border-grey);
}

.pollResponses .responseRow{
	padding: 1em;
	font-size: 0.8em;
	border-bottom: 1px solid var(--color-border-grey);
}

.pollResponses .responseDate{
	font-weight: 700;
	font-size: 0.8em;
	margin-right: 0.5em;
}

.pollResponses .responseAnswer, .pollResponses .responseText{
	margin-top: 0.5em;
}

.pollResponses .responseText{
	opacity: 0.6;
}

/****/

.modalDisplayWrap .displayToggle{
	color: inherit;
	background: var(--color-light-grey-module);
}

.createButtons{
    margin: 0.5em auto;
    max-width: 750px;
    font-size: 0.8em;
    text-align: center;
}

.createButtons .uiButton{
    width: 24%;
}

.adminModule.committee, .adminModule.post{
    border-top: 5px solid transparent;
}

.adminModule.committee.ethics, .adminModule.post.ethics{
	border-top-color: var(--color-ethics);
}

.adminModule.committee.labor, .adminModule.post.labor{
	border-top-color: var(--color-labor);
}

.adminModule.committee.health, .adminModule.post.health{
	border-top-color: var(--color-health);
}

.adminModule.committee.environment, .adminModule.post.environment{
	border-top-color: var(--color-environment);
}

.adminModule.committee.management, .adminModule.post.management{
	border-top-color: var(--color-management);
}

.adminModule .subHeading{
    font-size: 0.9em;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
    margin-top: -0.8em;
    margin-bottom: 1.5em;
    line-height: 1.6;
    opacity: 0.7;
}

.adminModule.committee .team{
    margin-top: 2em;
}

.committeeMembership .insetButtons button{
    padding: 0 0.1em;
    font-size: 1.3em;
    margin-top: -0.5em;
}

.committeeUsersList{
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.committeeUsersList h1{
    text-align: center;
}

td .svg-icon.svg-star{
	font-size: 1.2em;
	color: var(--color-amber);
}

.backLink{
	margin: 1em 0;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
}

.sideColumn .centeredButtons{
	max-width: 300px;
}

.sideColumn .centeredButtons{
	margin-top: 1em;
}

.favourite.keywordSelect .uiButton{
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
}

.favourite.keywordSelect .uiButton.booleanToggleButton[data-value=Yes]:after{
    content: "\f005";
    margin-left: 0;
}

.favourite.keywordSelect .uiButton.booleanToggleButton[data-value='']:after{
    font-family: "FontAwesome";
	font-weight: 400;
    content: "\f006";
}

.adminModule .informationBox.boxLink{
    margin-top: 2em;
    margin-bottom: 0;
}

.adminModule .commentsTable{
	margin-bottom: 0;
	font-size: 0.8em;
}

.adminModule.guideConversationComments .commentsTable{
	font-size: 0.9em;
}

.createComment{
	margin-top: 0.5em;
}

.createComment textarea{
	padding: 1em;
}

/****/

.survey .propertyInfoList{
    max-width: 650px;
}

.survey .additional .labelSpan{
    text-align: left;
}

.survey .propertyInfo.note{
    font-size: 0.9em;
}

.survey label{
    font-size: 1.2em;
    line-height: 1.6em;
}

.survey label .note{
    line-height: 1.4em;
}

.survey label:before{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f054";
    padding: 0.1em 0.5em 0 0;
    color: var(--color-1);
}

.survey .additional label:before, .survey .radioOptionRow label:before{
    content: "";
    padding: 0;
}

.survey .uiButton:not(.closeButton, .postActions .uiButton, .submit_submitSurvey){
    width: 40%;
}

/****/

.questionnaire .pageStatus{
    margin: 2em auto 2em auto;
    font-size: 0.8em;
    font-weight: 700;
	width: 100%;
	overflow-x: auto;
}

.questionnaire .pageStatus a{
    color: var(--color-text);
}

.questionnaire .pageStatus a:hover{
    text-decoration: none;
}

.questionnaire .pageStatus .pageStatusBoxes{
    width: 100%;
    display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
}

.questionnaire .pageStatusBox{
    color: var(--color-text);
    background: var(--color-background);
    width: 2.3em;
    padding: 0.5em 0 0.4em 0;
    position: relative;
    display: inline-block;
    text-align: center;
    z-index: 2;
    border-radius: 50px;
}

.questionnaire .pageStatusBox.current{
  	font-weight: 700;
  	font-size: 1.6em;
}

.questionnaire .pageStatusBox{
    background: var(--color-red);
    color: var(--color-red-overlay);
}

.labourQuestionnaire .pageStatusBox, .publisherQuestionnaire .pageStatusBox{
    background: var(--color-amber);
    color: var(--color-amber-overlay);
}

.questionnaire .pageStatusBox.complete{
    background: var(--color-1);
    color: var(--color-1-overlay);
}

.questionnaire .pageStatus .line{
    border-bottom: 3px solid var(--color-border-grey);
    position: relative;
    top: -1.5em;
    z-index: 1;
    margin: 0 2%;
}

.questionnaireContent{
    padding: 0.5em;
    position: relative;
}

.questionnaireSection{
    padding: 3em 2em;
    max-width: 1000px;
    margin: auto;
}

.questionnaire h1{
	margin: 1.5em  0 1em 0;
}

.questionnaire h2{
    font-size: 1.3em;
	margin: 0;
	border-bottom: 0;
}

.questionnaire .showcaseHeader{
    margin: 0.2em;
    padding: 0;
    color: var(--color-text);
    background: var(--color-background);
    text-align: center;
}

.questionnaire .showcaseHeader.expanded{
    background: var(--color-1-light);
}

.questionnaire .showcaseHeader h1{
    font-size: 1.3em;
    padding: 0.5em;
    margin: auto;
}

.questionnaire h1 .pageStatusBox{
	font-size: 0.7em;
    width: 2.3em;
    padding: 0.3em 0 0.3em 0;
    margin-right: 0.6em;
    position: relative;
    top: -0.1em;
}

.questionnaire div.submit{
    border-top: 1px solid var(--color-border-grey);
    position: relative;
    padding: 1em 0 1em 0;
}

.questionnaire .propertyInfoSubList label{
    font-size: 0.9em;
}

.questionnaire label:before{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f054";
    color: var(--color-1);
    padding: 0.1em 0.8em 0 0;
}

.questionnaire .additional label:before{
    content: "";
    padding: 0;
}

.questionnaire .formInput .labelSpan{
    font-size: 1em;
}

.questionnaire form{
    display: block;
}

.questionnaire .formInput .inputSpan{
    padding: 1em 0 0.2em 0;
}

.questionnaire .formInput input.text:not([size]), .questionnaire .formInput select, .questionnaire .formInput textarea:not(.fullWidth){
	width: auto;
	max-width: 100%;
}

.createParticipant .formInput textarea{
	width: 100%;
}

.questionnaire td.smallColumn, .questionnaire td.largeColumn{
    background-color: var(--color-background);
    color: var(--color-text);
    border: 1px solid #fff;
}

.questionnaire td.smallColumn input.text, .questionnaire td.largeColumn select{
    border-color: transparent;
    padding: 0.8em 1em;
}

.questionnaire td.smallColumn input.text:focus, .questionnaire td.largeColumn select:focus{
    background-color: transparent;
}

.questionnaire .formInput input.text, .questionnaire .formInput select, .questionnaire .formInput textarea, .questionnaire .responseRow select{
    background-color: var(--color-background);
    border-color: transparent;
    padding: 0.8em 1em;
}

.questionnaire .formInput input.text:focus, .questionnaire .formInput textarea:focus, .questionnaire .formInput select:focus{
	border-color: transparent;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.questionnaire .formInput.hasValue input.text, .questionnaire .formInput.hasValue select, .questionnaire .formInput.hasValue textarea, .questionnaire .keywords .dataTable.sortable tr, .questionnaire td.smallColumn.completed, .questionnaire td.largeColumn.completed{
    background-color: var(--color-1);
    color: var(--color-1-overlay);
}

.questionnaire .keywords .dataTable.sortable tr{
    padding: 0.6em 1em 0.5em 1em;
}

.questionnaire .additional .labelSpan{
	opacity: 1;
    text-align: left;
    font-size: 0.8em;
}

.questionnaire .additional .inputSpan{
    font-size: 0.8em;
}

.questionnaire .formInput.invalid input.text, .questionnaire .formInput.invalid select, .questionnaire .formInput.invalid textarea, .questionnaire td.smallColumn:not(.transparent).invalid, .questionnaire td.largeColumn:not(.transparent).invalid{
    background-color: var(--color-red);
    color: var(--color-red-overlay);
}

.questionnaire .formSpecify:not(.hasValue) input.text, .questionnaire .formSpecify:not(.hasValue) textarea{
    background-color: var(--color-background);
    color: var(--color-text);
}

.questionnaire .currency:not(.hasValue) select{
    background-color: var(--color-background);
    color: var(--color-text);
}

.questionnaire .formInput:not(.hasValue) input.text, .questionnaire .formInput:not(.hasValue) select, .questionnaire .formInput:not(.hasValue) textarea, .questionnaire td.smallColumn:not(.completed, .transparent), .questionnaire td.largeColumn:not(.completed, .transparent){
    background-color: var(--color-amber);
    color: var(--color-amber-overlay);
}

.questionnaire .formInput:not(.hasValue) input.text.required, .questionnaire .formInput:not(.hasValue) select.required, .questionnaire .formInput:not(.hasValue) textarea.required, .questionnaire td.smallColumn:not(.completed, .transparent).required, .questionnaire td.largeColumn:not(.completed, .transparent).required{
    background-color: var(--color-red);
    color: var(--color-red-overlay);
}

.questionnaire .formInput:not(.hasValue) input.text.optional, .questionnaire .formInput:not(.hasValue) select.optional, .questionnaire .formInput:not(.hasValue) textarea.optional, .questionnaire td.smallColumn:not(.completed, .transparent, .invalid).optional, .questionnaire td.largeColumn:not(.completed, .transparent, .invalid).optional{
    background-color: var(--color-background-dark);
    color: var(--color-text);
}

.questionnaire .formSpecify:not(.hasValue) input.text, .questionnaire .formSpecify:not(.hasValue) textarea{
    background-color: var(--color-amber);
    color: var(--color-amber-overlay);
}

.questionnaire .currency:not(.hasValue) select{
    background-color: var(--color-amber);
    color: var(--color-amber-overlay);
}

.questionnaire .keywords .dataTable td{
    font-family: "Body";
    font-weight: 400;
	font-size: 1.2em;
}

.questionnaire .keywords .dataTable.sortable tr .uiButton{
	margin-top: 0.2em;
}

.questionnaire .linkedListInput .inputSpan{
	max-width: 100%;
}

.questionnaire .prefix{
	font-size: 1.5em;
	margin-right: 0.2em;
}

.questionnaire th.rowHeader{
	padding: 2em 0 0.5em 0;
	font-size: 1.2em;
    font-family: "Header Light", sans-serif;
    font-weight: 400;
}

.questionnaire .linkedListInput .tableWrap{
	margin: auto;
	text-align: right;
}

.questionnaire .linkedListInput table{
	font-size: inherit;
}

.questionnaire .formInput.linkedListInput td{
	border-bottom-color: transparent;
	padding: 0;
}

.questionnaire .formInput.linkedListInput tr:hover td{
	background: transparent;
}

.questionnaire .additional .formInput .labelSpan, .questionnaire .additional .formInput .inputSpan{
    padding-top: 0;
}

.questionnaire .formInput .note{
	margin: 1em 0 0 2em;
	opacity: 0.5;
	font-size: 0.9em;
}

.questionnaire .formInput .inputSpan .note{
    margin: 0.5em 0 0 0;
}

.questionnaire .uiButton.leftButton{
	top: 1em;
}

.questionnaire .formInput.clearfix.submit{
	height: 5em;
}

.questionnaire ::placeholder{
    opacity: 1;
}

/****/

.formAgreement h2{
    margin: 1em auto;
    text-align: center;
}

.formAgreement, .radioOptions{
    border: none;
	background-color: var(--color-background);
	color: inherit;
}

/****/

.saveLink{
	font-weight: 700;
	font-size: 1.2em;
	text-align: center;
	margin-top: 2em;
}

/****/

.itemMarks{
	margin-left: 2px;
	display: inline-block;
}

.itemMark{
	width: 0.5em;
	height: 0.5em;
	margin: 1px;
	font-size: 1em;
}

.itemMark.alertCell{
	border-left: 0;
	border-right: 0;
}

/****/

.auditQuestion{
	margin: 1em 0;
}

.auditQuestion.subQuestion{
	margin: 0.5em 0 0.5em 10%;
	font-size: 0.85em;
}

.auditQuestion.subSubQuestion{
	margin: 0.5em 0 0.5em 15%;
	font-size: 0.75em;
}

.auditQuestion td{
	border-bottom: 1px solid transparent;
	padding: 0;
}

.auditQuestion td .inputSpan{
	width: 100%;
	float: none;
}

.auditQuestion td.mediumColumn{
	width: 15em;
	text-align: right;
}

.auditQuestion td.largeColumn{
	text-align: right;
}

.auditQuestion .labelSpan{
	font-size: 0.82em;
	line-height: 1.5em;
}

.auditQuestion .questionLabel{
	font-size: 1.2em;
	margin-right: 0.5em;
	margin-left: -0.3em;
}

.auditQuestion:not(.subQuestion) .formInput:not(.file) label:before{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f054";
    padding: 0.1em 0.5em 0 0;
}

.auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection .coachingTip{
    color: var(--color-general);
}

.auditSection.ethics .auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditSection.ethics .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection.ethics .coachingTip{
	color: var(--color-ethics);
}

.auditSection.labor .auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditSection.labor .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection.labor .coachingTip{
	color: var(--color-labor);
}

.auditSection.health .auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditSection.health .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection.health .coachingTip{
	color: var(--color-health);
}

.auditSection.environment .auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditSection.environment .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection.environment .coachingTip{
	color: var(--color-environment);
}

.auditSection.management .auditQuestion:not(.subQuestion) .formInput:not(.file) label:before, .auditSection.management .auditQuestion:not(.subQuestion) .formInput:not(.file) label .questionLabel, .auditSection.management .coachingTip{
	color: var(--color-management);
}

.editQuestionnaireEmployees input, .auditQuestion input, .auditQuestion select, .auditQuestion textarea{
	color: #ffffff;
	border-color: transparent !important;
	background-color: transparent !important;
}

.auditQuestion .textareaCount{
	color: #ffffff;
	padding: 0.5em 0.5em 0 0;
}

.auditQuestion .units{
	color: #ffffff;
	padding-right: 0.5em;
}

.auditQuestion .optionalNote{
	margin-bottom: 0.3em;
	font-size: 1.1em;
}

.auditQuestion .inputSpan{
	margin: 0.5em auto;
	text-align: center;
}

.auditQuestion input, .auditQuestion select{
	padding: 0.3em;
}

.auditQuestion select{
	min-width: 6em;
}

.auditQuestion .note{
	text-align: right;
}

.auditQuestion .previousResponse{
	text-align: right;
	opacity: 0.8;
	font-size: 0.9em;
}

.auditQuestion .previousResponse div{
	display: inline-block;
	background: var(--color-background);
	padding: 0.5em;
}

.auditQuestion .labelSpan .note{
	text-align: left;
	padding-top: 0;
	font-size: 1em;
}

.auditQuestion .formHelp{
	margin: 0;
}

.auditQuestion .formInput:not(.file) .inputSpan{
    padding: 0.4rem;
}

.auditQuestion .formInput.invalid .inputSpan{
	background-color: var(--color-red);
}

.auditQuestion input:disabled, .auditQuestion select:disabled{
	opacity: 1;
}

.auditQuestion .fileActions{
	text-align: right;
	margin-top: 0.5em;
	font-size: 0.8em;
}

.auditQuestion .fileActions div{
	display: inline-block;
}

.auditQuestion .fileActions form{
	width: auto;
}

.editQuestionnaireContacts .inputSpan, .editQuestionnaireBiological .inputSpan, .editQuestionnaireEmployees td.smallColumn, .createAuditQuestionResponse .inputSpan, .createAuditQuestionResponse .formInput.file .inputSpan label{
	background-color: var(--color-background-grey) !important;
}

.editQuestionnaireContacts .inputSpan, .editQuestionnaireBiological .inputSpan, .editQuestionnaireEmployees td.smallColumn, .createAuditQuestionResponse .inputSpan, .createAuditQuestionResponse .formInput.file .inputSpan label{
	opacity: 0.8;
}

.editAuditQuestionResponse .inputSpan, .editQuestionnaireEmployees td.smallColumn.completed, .editAuditQuestionResponse .formInput.file .inputSpan label, .fileActions .uiButton, .auditUploadedDocuments .uiButton{
	background-color: var(--color-general) !important;
	opacity: 1;
}

.auditSection.ethics .editAuditQuestionResponse .inputSpan, .auditSection.ethics .editAuditQuestionResponse .formInput.file .inputSpan label, .auditSection.ethics .fileActions .uiButton, .auditUploadedDocuments .uiButton.ethics{
	background-color: var(--color-ethics) !important;
}

.auditSection.labor .editAuditQuestionResponse .inputSpan, .auditSection.labor .editAuditQuestionResponse .formInput.file .inputSpan label, .auditSection.labor .fileActions .uiButton, .auditUploadedDocuments .uiButton.labor{
	background-color: var(--color-labor) !important;
}

.auditSection.health .editAuditQuestionResponse .inputSpan, .auditSection.health .editAuditQuestionResponse .formInput.file .inputSpan label, .auditSection.health .fileActions .uiButton, .auditUploadedDocuments .uiButton.health{
	background-color: var(--color-health) !important;
}

.auditSection.environment .editAuditQuestionResponse .inputSpan, .auditSection.environment .editAuditQuestionResponse .formInput.file .inputSpan label, .auditSection.environment .fileActions .uiButton, .auditUploadedDocuments .uiButton.environment{
	background-color: var(--color-environment) !important;
}

.auditSection.management .editAuditQuestionResponse .inputSpan, .auditSection.management .editAuditQuestionResponse .formInput.file .inputSpan label, .auditSection.management .fileActions .uiButton, .auditUploadedDocuments .uiButton.management{
	background-color: var(--color-management) !important;
}

.auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-general);
}

.auditSection.ethics .auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-ethics);
}

.auditSection.labor .auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-labor);
}

.auditSection.health .auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-health);
}

.auditSection.environment .auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-environment);
}

.auditSection.management .auditQuestion:not(.optional) .formInput:not(.hasValue) .inputSpan{
	border: 2px solid var(--color-management);
}

.editQuestionnaireEmployees td.smallColumn{
	border: 1px #ffffff solid;
}

.auditQuestion select > option{
	color: var(--color-text) !important;
	background-color: var(--color-background) !important;
}

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

	.auditQuestion .formInput .labelSpan{
		padding-top: 2em;
		padding-bottom: 1em;
	}

}

/****/

.adminModule .showcaseHeader{
    margin: -1.5em -1.5em 0 -1.5em;
    padding: 0;
    background: var(--color-1);
    text-align: center;
    border-radius: 3px;
}

.adminModule .showcaseHeader h1{
    color: #ffffff;
    padding: 1em;
    margin: 0;
    font-weight: 700;
}

/****/

.resultGraph .barWrap{
	display: flex;
}

.resultGraph .bar.light{
	opacity: 0.6;
}

/****/

.auditSection{
    padding-bottom: 0;
}

.auditSection .showcaseHeader{
    display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em;
	gap: 2em;
}

.auditSection .showcaseHeader h1{
    flex-grow: 1;
    text-align: left;
	padding: 0;
}

.auditSection .showcaseHeader .percentage{
    color: #ffffff;
    font-weight: 700;
    font-size: 0.8em;
}

.auditSection .showcaseHeader .resultGraph .barWrap{
	margin: 0.5em auto 0 auto;
    width: 300px;
    height: 2em;
    border: 1px solid #ffffff;
}

.auditSection .showcaseHeader .resultGraph .bar{
	background: #ffffff;
    height: 100%;
    overflow: hidden;
}

.auditSection > .showcaseHeader .expandIcon{
    width: 50px;
    height: 50px;
    flex-shrink: 0;
}

.auditSection > .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.auditSection .showcaseHeader.expanded .expandIcon.more, .auditSection .showcaseHeader .expandIcon.less{
    display: none;
}

.auditSection .showcaseHeader.expanded .expandIcon.less, .auditSection .showcaseHeader .expandIcon.more{
    display: flex;
}

.auditSubsection .showcaseHeader .expandIcon{
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

.auditSubsection .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.auditSubsection .showcaseHeader{
    margin: 0;
    padding: 0;
}

.auditSubsection .showcaseHeader h1{
    font-size: 1em;
}

.auditSection > .showcaseHeader{
    background: var(--color-general);
}

.auditSection.ethics > .showcaseHeader{
	background-color: var(--color-ethics);
}

.auditSection.labor > .showcaseHeader{
	background-color: var(--color-labor);
}

.auditSection.health > .showcaseHeader{
	background-color: var(--color-health);
}

.auditSection.environment > .showcaseHeader{
	background-color: var(--color-environment);
}

.auditSection.management > .showcaseHeader{
	background-color: var(--color-management);
}

.auditSection > .showcaseHeader:hover .expandIcon svg path.background{
    fill: #ffffff;
}

.auditSection > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-general);
}

.auditSection.ethics > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-ethics);
}

.auditSection.labor > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-labor);
}

.auditSection.health > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-health);
}

.auditSection.environment > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-environment);
}

.auditSection.management > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-management);
}

.auditSubsection .showcaseHeader{
	background-color: transparent;
}

.auditSubsection .showcaseHeader h1{
    color: var(--color-general);
}

.auditSection .auditSubsection .showcaseHeader .resultGraph .bar{
    background: var(--color-general);
}

.auditSection.ethics .auditSubsection .showcaseHeader .resultGraph .bar{
	background-color: var(--color-ethics);
}

.auditSection.labor .auditSubsection .showcaseHeader .resultGraph .bar{
	background-color: var(--color-labor);
}

.auditSection.health .auditSubsection .showcaseHeader .resultGraph .bar{
	background-color: var(--color-health);
}

.auditSection.environment .auditSubsection .showcaseHeader .resultGraph .bar{
	background-color: var(--color-environment);
}

.auditSection.management .auditSubsection .showcaseHeader .resultGraph .bar{
	background-color: var(--color-management);
}


.auditSection .auditSubsection{
    border: 2px solid var(--color-general);
}

.auditSection.ethics .auditSubsection{
	border-color: var(--color-ethics);
}

.auditSection.labor .auditSubsection{
	border-color: var(--color-labor);
}

.auditSection.health .auditSubsection{
	border-color: var(--color-health);
}

.auditSection.environment .auditSubsection{
	border-color: var(--color-environment);
}

.auditSection.management .auditSubsection{
	border-color: var(--color-management);
}


.auditSection .auditSubsection .showcaseHeader .resultGraph .barWrap{
    border-color: var(--color-general);
}

.auditSection.ethics .auditSubsection .showcaseHeader .resultGraph .barWrap{
	border-color: var(--color-ethics);
}

.auditSection.labor .auditSubsection .showcaseHeader .resultGraph .barWrap{
	border-color: var(--color-labor);
}

.auditSection.health .auditSubsection .showcaseHeader .resultGraph .barWrap{
	border-color: var(--color-health);
}

.auditSection.environment .auditSubsection .showcaseHeader .resultGraph .barWrap{
	border-color: var(--color-environment);
}

.auditSection.management .auditSubsection .showcaseHeader .resultGraph .barWrap{
	border-color: var(--color-management);
}

.auditSection .auditSubsection .showcaseHeader h1, .auditSection .auditSubsection .showcaseHeader.displayToggle:after, .auditSection .auditSubsection .showcaseHeader .percentage{
	color: var(--color-general);
}

.auditSection.ethics .auditSubsection .showcaseHeader h1, .auditSection.ethics .auditSubsection .showcaseHeader.displayToggle:after, .auditSection.ethics .auditSubsection .showcaseHeader .percentage{
	color: var(--color-ethics);
}

.auditSection.labor .auditSubsection .showcaseHeader h1, .auditSection.labor .auditSubsection .showcaseHeader.displayToggle:after, .auditSection.labor .auditSubsection .showcaseHeader .percentage{
	color: var(--color-labor);
}

.auditSection.health .auditSubsection .showcaseHeader h1, .auditSection.health .auditSubsection .showcaseHeader.displayToggle:after, .auditSection.health .auditSubsection .showcaseHeader .percentage{
	color: var(--color-health);
}

.auditSection.environment .auditSubsection .showcaseHeader h1, .auditSection.environment .auditSubsection .showcaseHeader.displayToggle:after, .auditSection.environment .auditSubsection .showcaseHeader .percentage{
	color: var(--color-environment);
}

.auditSection.management .auditSubsection .showcaseHeader h1, .auditSection.management .auditSubsection .showcaseHeader.displayToggle:after, .auditSection.management .auditSubsection .showcaseHeader .percentage{
	color: var(--color-management);
}

.auditSection .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-general);
}

.auditSection.ethics .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-ethics);
}

.auditSection.labor .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-labor);
}

.auditSection.health .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-health);
}

.auditSection.environment .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-environment);
}

.auditSection.management .auditSubsection .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-management);
}

.auditSection .auditSubsection .showcaseHeader:hover .expandIcon svg path.line{
	fill: #ffffff;
}

.auditSection .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-general);
}

.auditSection.ethics .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-ethics);
}

.auditSection.labor .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-labor);
}

.auditSection.health .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-health);
}

.auditSection.environment .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-environment);
}

.auditSection.management .auditSubsection .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-management);
}

.questionnairePercentage{
	text-align: center;
	font-weight: 700;
}

.questionnairePercentage .resultGraph .barWrap{
	margin: 0.5em auto 0 auto;
    width: 300px;
    height: 1em;
    border: 1px solid var(--color-general);
}

.questionnairePercentage .resultGraph .bar{
	background: var(--color-general);
    height: 100%;
    overflow: hidden;
}

/****/

.trainingTopic{
    padding-bottom: 0;
}

.trainingTopic .showcaseHeader{
    background: var(--color-general);
    display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1em;
	gap: 2em;
}

.trainingTopic .showcaseHeader h1{
    flex-grow: 1;
    text-align: left;
	padding: 0;
}

.trainingTopic .showcaseHeader .percentage{
    color: #ffffff;
    font-weight: 700;
    font-size: 0.8em;
}

.trainingTopic .showcaseHeader .resultGraph .barWrap{
	margin: 0.5em auto 0 auto;
    width: 300px;
    height: 2em;
    border: 1px solid #ffffff;
}

.trainingTopic .showcaseHeader .resultGraph .bar{
	background: #ffffff;
    height: 100%;
    overflow: hidden;
}

.trainingTopic > .showcaseHeader .expandIcon{
    width: 50px;
    height: 50px;
    flex-shrink: 0;
}

.trainingTopic > .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.trainingTopic .showcaseHeader.expanded .expandIcon.more, .trainingTopic .showcaseHeader .expandIcon.less{
    display: none;
}

.trainingTopic .showcaseHeader.expanded .expandIcon.less, .trainingTopic .showcaseHeader .expandIcon.more{
    display: flex;
}

.trainingTopic.ethics > .showcaseHeader{
	background-color: var(--color-ethics);
}

.trainingTopic.labor > .showcaseHeader{
	background-color: var(--color-labor);
}

.trainingTopic.health > .showcaseHeader{
	background-color: var(--color-health);
}

.trainingTopic.environment > .showcaseHeader{
	background-color: var(--color-environment);
}

.trainingTopic.management > .showcaseHeader{
	background-color: var(--color-management);
}

.trainingTopic > .showcaseHeader:hover .expandIcon svg path.background{
    fill: #ffffff;
}

.trainingTopic.ethics > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-ethics);
}

.trainingTopic.labor > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-labor);
}

.trainingTopic.health > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-health);
}

.trainingTopic.environment > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-environment);
}

.trainingTopic.management > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-management);
}

.learningTopic{
    border: 2px solid var(--color-general);
    padding: 0 1em 0 1em;
}

.learningTopic .showcaseHeader .expandIcon{
    width: 40px;
    height: 40px;
    flex-shrink: 0;
}

.learningTopic  .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.learningTopic .trainingLevels{
    padding: 1em 0;
}

.keyResource .traningLevel svg{
    width: 100%;
    height: auto;
    flex-shrink: 0;
}

.keyResource .trainingLevelName{
    font-size: 1.3em;
	font-family: "Header", sans-serif;
    display: flex;
    align-items: center;
    cursor: default;
    gap: 0.5em;
}

.trainingTopic.ethics .learningTopic{
	border-color: var(--color-ethics);
}

.trainingTopic.labor .learningTopic{
	border-color: var(--color-labor);
}

.trainingTopic.health .learningTopic{
	border-color: var(--color-health);
}

.trainingTopic.environment .learningTopic{
	border-color: var(--color-environment);
}

.trainingTopic.management .learningTopic{
	border-color: var(--color-management);
}

.trainingTopic.ethics .learningTopic h1, .trainingTopic.ethics .learningTopic .showcaseHeader .percentage{
	color: var(--color-ethics);
}

.trainingTopic.labor .learningTopic h1, .trainingTopic.labor .learningTopic .showcaseHeader .percentage{
	color: var(--color-labor);
}

.trainingTopic.health .learningTopic h1, .trainingTopic.health .learningTopic .showcaseHeader .percentage{
	color: var(--color-health);
}

.trainingTopic.environment .learningTopic h1, .trainingTopic.environment .learningTopic .showcaseHeader .percentage{
	color: var(--color-environment);
}

.trainingTopic.management .learningTopic h1, .trainingTopic.management .learningTopic .showcaseHeader .percentage{
	color: var(--color-management);
}

.trainingTopic.ethics .learningTopic .showcaseHeader .barWrap{
	border-color: var(--color-ethics);
}

.trainingTopic.labor .learningTopic .showcaseHeader .barWrap{
	border-color: var(--color-labor);
}

.trainingTopic.health .learningTopic .showcaseHeader .barWrap{
	border-color: var(--color-health);
}

.trainingTopic.environment .learningTopic .showcaseHeader .barWrap{
	border-color: var(--color-environment);
}

.trainingTopic.management .learningTopic .showcaseHeader .barWrap{
	border-color: var(--color-management);
}

.trainingTopic.ethics .learningTopic .showcaseHeader .bar{
	background-color: var(--color-ethics);
}

.trainingTopic.labor .learningTopic .showcaseHeader .bar{
	background-color: var(--color-labor);
}

.trainingTopic.health .learningTopic .showcaseHeader .bar{
	background-color: var(--color-health);
}

.trainingTopic.environment .learningTopic .showcaseHeader .bar{
	background-color: var(--color-environment);
}

.trainingTopic.management .learningTopic .showcaseHeader .bar{
	background-color: var(--color-management);
}

.trainingTopic.ethics .learningTopic .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-ethics);
}

.trainingTopic.labor .learningTopic .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-labor);
}

.trainingTopic.health .learningTopic .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-health);
}

.trainingTopic.environment .learningTopic .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-environment);
}

.trainingTopic.management .learningTopic .showcaseHeader .expandIcon svg path.line{
	fill: var(--color-management);
}

.trainingTopic .learningTopic .showcaseHeader:hover .expandIcon svg path.line{
	fill: #ffffff;
}

.trainingTopic.ethics .learningTopic .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-ethics);
}

.trainingTopic.labor .learningTopic .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-labor);
}

.trainingTopic.health .learningTopic .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-health);
}

.trainingTopic.environment .learningTopic .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-environment);
}

.trainingTopic.management .learningTopic .showcaseHeader:hover .expandIcon svg path.background{
	fill: var(--color-management);
}

.learningTopic .showcaseHeader{
    background: transparent;
    margin: 0;
}

.learningTopic .showcaseHeader h1{
    font-size: 1em;
    text-transform: none;
    flex-grow: 1;
}

.learningTopic .keyResource .name{
    font-size: 0.8em;
    text-transform: none;
}

.learningTopic .keyResource .completedDate{
    font-size: 0.8em;
}

.learningTopic .keyResource .updatedDate{
    font-size: 0.8em;
    padding: 0.2em;
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-weight: 700;
}

.learningTopic .keyResource .updatedDate[data-coaching]{
    cursor: help;
}

.learningTopic .keyResource .updatedDate svg{
    fill: #ffffff;
    vertical-align: inherit;
    height: 1.2em;
}

.maturityIndicator{
    gap: 1em;
}

.maturityIndicator.updated{
    opacity: 0.7;
}

.maturityIndicator .subtopic{
	margin-top: 0.5em;
	font-size: 0.8em;
}

.maturityIndicator .traningLevel svg{
    width: 100%;
    height: auto;
    flex-shrink: 0;
}

.trainingTopic.ethics .maturityIndicator:not(.completed) .updatedDate svg{
    fill: var(--color-ethics);
}

.trainingTopic.labor .maturityIndicator:not(.completed) .updatedDate svg{
    fill: var(--color-labor);
}

.trainingTopic.health .maturityIndicator:not(.completed) .updatedDate svg{
    fill: var(--color-health);
}

.trainingTopic.environment .maturityIndicator:not(.completed) .updatedDate svg{
    fill: var(--color-environment);
}

.trainingTopic.management .maturityIndicator:not(.completed) .updatedDate svg{
    fill: var(--color-management);
}

.trainingTopic.ethics .maturityIndicator:not(.completed) .trainingLevel svg g{
    stroke: var(--color-ethics);
}

.trainingTopic.labor .maturityIndicator:not(.completed) .trainingLevel svg g{
    stroke: var(--color-labor);
}

.trainingTopic.health .maturityIndicator:not(.completed) .trainingLevel svg g{
    stroke: var(--color-health);
}

.trainingTopic.environment .maturityIndicator:not(.completed) .trainingLevel svg g{
    stroke: var(--color-environment);
}

.trainingTopic.management .maturityIndicator:not(.completed) .trainingLevel svg g{
    stroke: var(--color-management);
}

/****/

.overallPercentage{
    background: var(--color-1);
    color: var(--color-1-overlay);
    padding: 0.5em;
    text-align: center;
    border-radius: 3px;
}

.overallPercentage.current{
    background: var(--color-2);
    color: var(--color-2-overlay);
}

.overallPercentage h1 svg path{
	fill: inherit;
}

.sideColumn .overallPercentage{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    margin: 0.3em 0;
    padding: 1em;
    font-size: 0.8em;
    text-align: left;
}

.sideColumn .overallPercentage h1{
    text-align: left;
    flex-grow: 1;
}

.overallPercentage a{
    color: #ffffff;
}

.overallPercentage a:not(.uiButton):hover{
    color: #ffffff;
}

.overallPercentage .percentage{
    color: #ffffff;
    padding-bottom: 1em;
    margin: 0;
    font-weight: 700;
}

.overallPercentage .resultGraph .barWrap{
	margin: 0.5em auto 0 auto;
    width: 300px;
    height: 1.5em;
    border: 1px solid #ffffff;
}

.overallPercentage .resultGraph .bar{
	background: #ffffff;
    height: 100%;
    overflow: hidden;
}

/****/

.principleIcon{
    width: 50px;
    height: 50px;
    background: #ffffff;
    border-radius: 100px;
    display: flex;
	justify-content: center;
	flex-shrink: 0;
}

.principleIcon svg{
    width: 50%;
    height: auto;
}

.environment .principleIcon svg path{
    fill: var(--color-environment);
}

.ethics .principleIcon svg path{
    fill: var(--color-ethics);
}

.health .principleIcon svg path{
    fill: var(--color-health);
}

.labor .principleIcon svg path{
    fill: var(--color-labor);
}

.management .principleIcon svg path{
    fill: var(--color-management);
}

/****/

.principleInfo{
    padding-bottom: 0;
}

.principleInfo.large{
    max-width: 900px;
}

.principlesSmall{
	margin: 3em auto;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 0.5em;
}

.principlesSmall .principleInfo{
    font-size: 0.5em;
    width: 180px;
	margin: 0;
}

.principleInfo.legislationIssue{
    max-width: 750px;
}

.principleInfo > .showcaseHeader{
	display: flex;
	align-items: center;
	justify-content: space-between;
    padding: 1em;
	gap: 2em;
}

.principlesSmall .principleInfo > .showcaseHeader{
	justify-content: center;
	flex-flow: column;
    height: 120px;
    padding: 3em;
}

.principleInfo > .showcaseHeader h1{
    flex-grow: 1;
    text-align: left;
    padding: 0;
}

.principlesSmall .principleInfo > .showcaseHeader h1{
    text-align: center;
    font-size: 1.5em;
}

.principleInfo > .showcaseHeader .expandIcon{
    width: 50px;
    height: 50px;
    flex-shrink: 0;
}

.principleInfo > .showcaseHeader .expandIcon svg{
    width: 100%;
    height: auto;
}

.principleInfo .showcaseHeader.expanded .expandIcon.more, .principleInfo .showcaseHeader .expandIcon.less{
    display: none;
}

.principleInfo .showcaseHeader.expanded .expandIcon.less, .principleInfo .showcaseHeader .expandIcon.more{
    display: flex;
}

.principleInfo > .showcaseHeader:hover .expandIcon svg path.background{
    fill: #ffffff;
}

.principleInfo.general > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-general);
}

.principleInfo.environment > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-environment);
}

.principleInfo.ethics > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-ethics);
}

.principleInfo.health > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-health);
}

.principleInfo.labor > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-labor);
}

.principleInfo.management > .showcaseHeader:hover .expandIcon svg path.line{
	fill: var(--color-management);
}

.principleInfo h2{
	color: #ffffff;
	padding: 0.2em 0;
	border-radius: 100px;
	display: inline-block;
	margin: 1em 0;
	font-size: 1.2em;
}

.principleInfo .number{
	color: #ffffff;
	padding: 0.2em 0.5em;
	border-radius: 100px;
	display: inline-block;
	margin-right: 0.2em;
}

.principleInfo.general > .showcaseHeader, .principleInfo.general .number{
	background-color: var(--color-general);
}

.principleInfo.environment > .showcaseHeader, .principleInfo.environment .number{
	background-color: var(--color-environment);
}

.principleInfo.ethics > .showcaseHeader, .principleInfo.ethics .number{
	background-color: var(--color-ethics);
}

.principleInfo.health > .showcaseHeader, .principleInfo.health .number{
	background-color: var(--color-health);
}

.principleInfo.labor > .showcaseHeader, .principleInfo.labor .number{
	background-color: var(--color-labor);
}

.principleInfo.management > .showcaseHeader, .principleInfo.management .number{
	background-color: var(--color-management);
}

.principleInfo.general > .showcaseHeader, .principleInfo.general h2{
	color: var(--color-general);
}

.principleInfo.environment > .showcaseHeader, .principleInfo.environment h2{
	color: var(--color-environment);
}

.principleInfo.ethics > .showcaseHeader, .principleInfo.ethics h2{
	color: var(--color-ethics);
}

.principleInfo.health > .showcaseHeader, .principleInfo.health h2{
	color: var(--color-health);
}

.principleInfo.labor > .showcaseHeader, .principleInfo.labor h2{
	color: var(--color-labor);
}

.principleInfo.management > .showcaseHeader, .principleInfo.management h2{
	color: var(--color-management);
}

.principleInfo .markdown ul{
    margin: 0;
}

.principleInfo .legislationIssueContent .markdown ul{
    margin: 2em;
}

.principleInfo .markdown ul > li, .principleInfo .markdown ol > li{
    position: relative;
    margin: 0 0 0 0.2em;
    padding: 0.2em;
    list-style: none;
    background: none;
}

.principleInfo .markdown ul > li:before{
	font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f0c8";
    position: absolute;
    top: 5px;
    left: -2em;
    width: 1.8em;
    margin-right: 8px;
    color: var(--color-3);
    text-align: center;
}

.principleInfo .markdown ol > li:before{
    content: counter(list-item);
    padding: 0.2em 0.4em;
    margin-right: 1em;
    font-size: 0.7em;
    font-weight: 700;
}

.principleColumn{
    flex: 1;
}

.principleColumn p{
    margin: 0;
}

.principleColumnContent{
    padding: 1.2em;
    margin: 0.5em 0;
	min-height: 150px;
	display: grid;
}

.principleColumnContent .markdown li{
    cursor: help;
}

.principle.environment .principleColumnContent{
	border: 3px solid var(--color-environment);
	background: var(--color-environment);
	color: var(--color-environment);
}

.principle.environment .learningPlanColumn svg path.line{
	fill: var(--color-environment);
}

.principle.environment .markdown > ol > li:before{
    background: var(--color-environment);
    color: var(--color-environment-overlay);
}

.principle.ethics .principleColumnContent{
	border: 3px solid var(--color-ethics);
	background: var(--color-ethics);
	color: var(--color-ethics);
}

.principle.ethics .learningPlanColumn svg path.line{
	fill: var(--color-ethics);
}

.principle.ethics .markdown > ol > li:before{
    background: var(--color-ethics);
    color: var(--color-ethics-overlay);
}

.principle.health .principleColumnContent{
	border: 3px solid var(--color-health);
	background: var(--color-health);
	color: var(--color-health);
}

.principle.health .learningPlanColumn svg path.line{
	fill: var(--color-health);
}

.principle.health .markdown > ol > li:before{
    background: var(--color-health);
    color: var(--color-health-overlay);
}

.principle.labor .principleColumnContent{
	border: 3px solid var(--color-labor);
	background: var(--color-labor);
	color: var(--color-labor);
}

.principle.labor .learningPlanColumn svg path.line{
	fill: var(--color-labor);
}

.principle.labor .markdown > ol > li:before{
    background: var(--color-labor);
    color: var(--color-labor-overlay);
}

.principle.management .principleColumnContent{
	border: 3px solid var(--color-management);
	background: var(--color-management);
	color: var(--color-management);
}

.principle.management .learningPlanColumn svg path.line{
	fill: var(--color-management);
}

.principle.management .markdown > ol > li:before{
    background: var(--color-management);
    color: var(--color-management-overlay);
}

.principleInfo .expectationsColumn .principleColumnContent{
	border-bottom-color: transparent;
	border-left-color: transparent;
	border-right-color: transparent;
	color: var(--color-text);
}

.principleInfo .maturityModelColumn .principleColumnContent{
	color: #ffffff;
}

.principleInfo .maturityModelColumn svg path.line, .principleInfo .maturityModelColumn .principleIcon path{
	fill: #ffffff;
}

.principleInfo .principleColumnContent .principleIcon{
	justify-content: flex-start;
	height: 1em;
	width: auto;
	margin-right: 0.5em;
}

.principleInfo .principleColumnContent .principleIcon svg{
	height: 100%;
	width: auto;
}

.principleInfo .maturityModelColumn .principleIcon{
	background: transparent;
}

.principleInfo .expectationsColumn .principleColumnContent, .principleInfo .learningPlanColumn .principleColumnContent{
	background: transparent;
}

.principleInfo .principleColumnContent .name{
	font-weight: 700;
	text-transform: uppercase;
	display: inline-flex;
	align-items: flex-start;
	font-size: 1.2em;
}

.principleInfo .principleInfoContent{
	font-size: 0.9em;
}

@media screen and (min-width: 900px){

.principleInfo .principleInfoContent{
	display: flex;
	gap: 1em;
}

}

.principleInfo .principleColumnContent .linkText{
	display: flex;
	align-items: center;
	width: 100%;
	justify-content: space-between;
}

.principleInfo .principleColumnContent .linkText svg{
	width: 40px;
	height: auto;
}

.principleInfo .legislationIssueContent{
	padding-bottom: 1em;
}

.principleInfo .legislationIssueContent h2{
	margin-top: 1.5em;
}

.principleInfo .legislationIssueContent .info{
	margin: -1em 0 2em 0;
	font-size: 0.8em;
	opacity: 0.6;
}

.principleInfo .legislationIssueContent p.description, .principleInfo .legislationIssueContent .markdown{
	font-size: 0.9em;
}

.principleInfo .legislationIssueContent p.description{
	margin: 1em 1em 1.5em 1em;
}

/****/

.learningPlanLink{
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	gap: 1em;
}

.learningPlanLink .name{
	display: flex;
	align-items: center;
	gap: 1em;
}

.learningPlanLink .linkIcon{
	width: 50px;
}

.learningPlanLink .linkIcon svg{
	width: 100%;
	height: auto;
}

/****/

.keywords .topic li{
	color: #ffffff;
	background-color: var(--color-general);
}

.principle.general .image, .principle.general .uiButton, .adminModule.general .keyResource, .keyResource.general, .adminModule .keyResource.general, .keyResource.general:hover, .keywords .topic li.general{
	background-color: var(--color-general);
}

.adminModule.general .keyResource.maturityIndicator{
	border: 2px solid var(--color-general);
}

.adminModule.general .keyResource.maturityIndicator:not(.completed){
	color: var(--color-general);
	background-color: transparent;
}

.principle.general ul > li:before{
    color: var(--color-general);
}

.principle.environment .image, .principle.environment .uiButton, .adminModule.environment .keyResource{
	background-color: var(--color-environment);
}

.adminModule.environment .keyResource.maturityIndicator{
	border: 2px solid var(--color-environment);
}

.adminModule.environment .keyResource.maturityIndicator:not(.completed){
	color: var(--color-environment);
	background-color: transparent;
}

.adminModule .keyResource.environment, .keyResource.environment:hover, .keyResource.environment, .keywords .topic li.environment{
	background-color: var(--color-environment);
}

.principle.environment ul > li:before{
    color: var(--color-environment);
}

.principle.ethics .image, .principle.ethics .uiButton, .adminModule.ethics .keyResource{
	background-color: var(--color-ethics);
}

.adminModule.ethics .keyResource.maturityIndicator{
	border: 2px solid var(--color-ethics);
}

.adminModule.ethics .keyResource.maturityIndicator:not(.completed){
	color: var(--color-ethics);
	background-color: transparent;
}

.adminModule .keyResource.ethics, .keyResource.ethics:hover, .keyResource.ethics, .keywords .topic li.ethics{
	background-color: var(--color-ethics);
}

.principle.ethics ul > li:before{
    color: var(--color-ethics);
}

.principle.health .image, .principle.health .uiButton, .adminModule.health .keyResource{
	background-color: var(--color-health);
}

.adminModule.health .keyResource.maturityIndicator{
	border: 2px solid var(--color-health);
}

.adminModule.health .keyResource.maturityIndicator:not(.completed){
	color: var(--color-health);
	background-color: transparent;
}

.adminModule .keyResource.health, .keyResource.health:hover, .keyResource.health, .keywords .topic li.health{
	background-color: var(--color-health);
}

.principle.health ul > li:before{
    color: var(--color-health);
}

.principle.labor .image, .principle.labor .uiButton, .adminModule.labor .keyResource{
	background-color: var(--color-labor);
}

.adminModule.labor .keyResource.maturityIndicator{
	border: 2px solid var(--color-labor);
}

.adminModule.labor .keyResource.maturityIndicator:not(.completed){
	color: var(--color-labor);
	background-color: transparent;
}

.adminModule .keyResource.labor, .keyResource.labor:hover, .keyResource.labor, .keywords .topic li.labor{
	background-color: var(--color-labor);
}

.principle.labor ul > li:before{
    color: var(--color-labor);
}

.principle.management .image, .principle.management .uiButton, .adminModule.management .keyResource{
	background-color: var(--color-management);
}

.adminModule.management .keyResource.maturityIndicator{
	border: 2px solid var(--color-management);
}

.adminModule.management .keyResource.maturityIndicator:not(.completed){
	color: var(--color-management);
	background-color: transparent;
}

.adminModule .keyResource.management, .keyResource.management:hover, .keyResource.management, .keywords .topic li.management{
	background-color: var(--color-management);
}

.principle.management ul > li:before{
    color: var(--color-management);
}

/****/

.gallery{
	position: relative;
}

.gallery .galleryImage:not(.current){
	display: none;
}

.gallery .galleryNavigation{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	cursor: pointer;
}

.gallery .galleryNavigation .previous{
	position: absolute;
	width: 50%;
	height: 100%;
}

.gallery .galleryNavigation .previous:before{
	position: absolute;
	bottom: 0.5em;
	left: 0.5em;
	font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f053";
    color: #ffffff;
    font-size: 3em;
    text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
    opacity: 0.7;
}

.gallery .galleryNavigation .next{
	position: absolute;
	width: 50%;
	height: 100%;
	left: 50%;
}

.gallery .galleryNavigation .next:after{
	position: absolute;
	bottom: 0.5em;
	right: 0.5em;
	font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f054";
    color: #ffffff;
    font-size: 3em;
    text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
    opacity: 0.7;
}

.galleryImagesTable .keywords div{
	display: inline-block;
	width: 150px;
	height: 150px;
	position: relative;
}

.galleryImagesTable .keywords form{
	position: absolute;
	top: 0;
	right: 2px;
	width: auto;
}

.galleryImagesTable .keywords form button{
	padding: 0.4em;
}

.galleryImagesTable .keywords form button:hover{
	background: var(--color-1);
}

/****/

.appStoreLinks{
	margin-top: 2em;
}

.appScreenshots{
	text-align: center;
	margin: 1em auto;
}

.appScreenshots .flexibleImage{
	display: inline-block;
	width: 30%;
}

/****/

.showcaseHeader.learnster{
	background: var(--color-learnster);
}

.showcaseHeader.learnster svg path{
	fill: #ffffff;
}

.learnsterProgress{
	display: flex;
	justify-content: center;
	gap: 2em;
	margin: 1em auto;
}

.learnsterProgressItem{
	text-align: center;
}

.learnsterProgressItem .name{
	font-size: 0.9em;
	font-family: "Header", sans-serif;
	text-transform: uppercase;
}

.learnsterProgressItem .value{
	font-size: 5em;
}

/****/

.dataTable td.total{
	font-weight: 700;
}

.dataTable tr.total th, .dataTable tr.total td{
	border-bottom-color: transparent;
	padding-top: 1em;
}

/****/

.auditAuditCompletionNotesTable, .auditAuditReturnNotesTable, .auditAuditDisqualifiedNotesTable, .questionnaireAuditCompletionNotesTable, .questionnaireAuditReturnNotesTable{
	margin: auto;
}

.inputSpan .auditAuditCompletionNotesTable .note, .inputSpan .auditAuditReturnNotesTable .note, .inputSpan .auditAuditDisqualifiedNotesTable .note, .inputSpan .questionnaireAuditCompletionNotesTable .note, .inputSpan .questionnaireAuditReturnNotesTable .note{
	text-align: left;
	margin: 0.2em 0 0 0;
}

.auditNote{
    font-family: "Header", sans-serif;
	font-size: 0.7em;
	padding: 1em;
	background: var(--color-background);
	margin: 0.5em 0;
}

.auditNote .note p{
	margin: 0.2em 0 0 0;
}

/****/

.alertTag.general, .alertCell.general{
	background: var(--color-general) !important;
}

.alertTag.general, .alertTag.general select, .alertTag.general a, .alertTag.general a:hover, .alertTag.general .uiButton, .alertTag.general .uiButton:hover, .alertTag.general .coachingTip, .alertTag.general .fa, .alertCell.general, .alertCell.general select, .alertCell.general a, .alertCell.general a:hover, .alertCell.general .uiButton, .alertCell.general .uiButton:hover, .alertCell.general .coachingTip, .alertCell.general .fa{
	color: var(--color-general-overlay) !important;
}

.alertTag.environment, .alertCell.environment{
	background: var(--color-environment) !important;
}

.alertTag.environment, .alertTag.environment select, .alertTag.environment a, .alertTag.environment a:hover, .alertTag.environment .uiButton, .alertTag.environment .uiButton:hover, .alertTag.environment .coachingTip, .alertTag.environment .fa, .alertCell.environment, .alertCell.environment select, .alertCell.environment a, .alertCell.environment a:hover, .alertCell.environment .uiButton, .alertCell.environment .uiButton:hover, .alertCell.environment .coachingTip, .alertCell.environment .fa{
	color: var(--color-environment-overlay) !important;
}

.alertTag.ethics, .alertCell.ethics{
	background: var(--color-ethics) !important;
}

.alertTag.ethics, .alertTag.ethics select, .alertTag.ethics a, .alertTag.ethics a:hover, .alertTag.ethics .uiButton, .alertTag.ethics .uiButton:hover, .alertTag.ethics .coachingTip, .alertTag.ethics .fa, .alertCell.ethics, .alertCell.ethics select, .alertCell.ethics a, .alertCell.ethics a:hover, .alertCell.ethics .uiButton, .alertCell.ethics .uiButton:hover, .alertCell.ethics .coachingTip, .alertCell.ethics .fa{
	color: var(--color-ethics-overlay) !important;
}

.alertTag.health, .alertCell.health{
	background: var(--color-health) !important;
}

.alertTag.health, .alertTag.health select, .alertTag.health a, .alertTag.health a:hover, .alertTag.health .uiButton, .alertTag.health .uiButton:hover, .alertTag.health .coachingTip, .alertTag.health .fa, .alertCell.health, .alertCell.health select, .alertCell.health a, .alertCell.health a:hover, .alertCell.health .uiButton, .alertCell.health .uiButton:hover, .alertCell.health .coachingTip, .alertCell.health .fa{
	color: var(--color-health-overlay) !important;
}

.alertTag.labor, .alertCell.labor{
	background: var(--color-labor) !important;
}

.alertTag.labor, .alertTag.labor select, .alertTag.labor a, .alertTag.labor a:hover, .alertTag.labor .uiButton, .alertTag.labor .uiButton:hover, .alertTag.labor .coachingTip, .alertTag.labor .fa, .alertCell.labor, .alertCell.labor select, .alertCell.labor a, .alertCell.labor a:hover, .alertCell.labor .uiButton, .alertCell.labor .uiButton:hover, .alertCell.labor .coachingTip, .alertCell.labor .fa{
	color: var(--color-labor-overlay) !important;
}

.alertTag.management, .alertCell.management{
	background: var(--color-management) !important;
}

.alertTag.management, .alertTag.management select, .alertTag.management a, .alertTag.management a:hover, .alertTag.management .uiButton, .alertTag.management .uiButton:hover, .alertTag.management .coachingTip, .alertTag.management .fa, .alertCell.management, .alertCell.management select, .alertCell.management a, .alertCell.management a:hover, .alertCell.management .uiButton, .alertCell.management .uiButton:hover, .alertCell.management .coachingTip, .alertCell.management .fa{
	color: var(--color-management-overlay) !important;
}