:root{
	--color-1: #98054e;
	--color-2: #c60071;
	--color-3: #ffde00;
	--color-3-light: #ffde0030;
	--color-text: #434343;
	--color-background: #f5f5f0;
	--color-footer: #ebebe6;
	--color-pact: #e8e616;
	--color-pact-light: #e8e61630;
}

/****/

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

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

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

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

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

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

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

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

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

/****/

strong{
	font-weight: 900;
}

/****/

#headerWrap{
    padding: 0 5%;
    z-index: 11;
}

header h1{
	position: relative;
	top: -10px;
}

header h1 svg, header h1 img{
	min-width: 220px;
	max-width: 250px;
}

.pact header svg .background{
	fill: var(--color-pact);
}

/****/

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

footer .logo .flexibleImage{
    max-width: 120px;
}

footer .logo .description{
    font-size: 0.9em;
    margin-top: 1em;
    line-height: 1.6em;
    max-width: 25em;
}

footer .social{
    margin-top: 0.5em;
    margin-bottom: 1em;
}

footer .social a{
    padding: 0.6em 0.5em;
    margin: 0.2em;
    background: var(--color-text-grey);
}

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

footer .social a:hover, footer .social a:focus{
    background: var(--color-1);
    outline: 0;
}

footer .copyright{
    font-size: 0.9em;
}

footer .copyright div{
    margin-bottom: 0.5em;
}

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;
	}

}

/****/

.navMenu li a{
    color: var(--color-text);
	text-transform: uppercase;
	border: 4px solid transparent;
}

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

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

.navToggle{
	color: var(--color-text);
}

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

	.navMenu li{
		text-align: left;
	}

	.navMenu ul li{
		margin-left: 20px;
	}

}

/****/

.subMenuColumn{
    float: left;
    margin: 0;
    width: 20%;
    padding: 40px 0;
}

.subMenuContentColumn{
    margin: 0;
    padding: 1em 0 0 40px;
    float: left;
    width: 80%;
}

.pact .subMenuContentColumn{
    padding-top: 0;
    margin-top: -1%;
}

.subMenuContentColumn .module:first-of-type{
    margin-top: 0;
}

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

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

.subMenu li a{
    color: inherit;
	font-family: "Button", sans-serif;
	text-transform: uppercase;
	width: 100%;
	display: block;
	padding: 0.5em;
}

.subMenu li a.current, .subMenu li a:hover, .subMenu li a:focus{
    color: var(--color-1-overlay);
	background: var(--color-1);
	text-decoration: none;
	outline: 0;
	border-bottom-color: transparent;
}

.subMenu.pact  li a.current, .subMenu.pact  li a:hover, .subMenu.pact  li a:focus{
    color: var(--color-pact-overlay);
	background: var(--color-pact);
}

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

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

	.subMenu li{
		margin-bottom: 0;
	}
}

/****/

.adminModule{
    background: #ffffff;
    border-color: transparent;
}

.adminModule h1{
	text-transform: uppercase;
}

.adminModule h2{
    border-bottom: 1px solid var(--color-border-grey);
    padding-bottom: 0.5em;
    font-size: 0.9em;
}

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

.adminModule .informationBox{
	background-color: var(--color-background);
	color: var(--color-text);
}

.adminModule .informationBox.alertTag{
	width: 100%;
}

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

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

.sideColumn .adminModule .informationBox{
	margin: 0.1em;
}

/****/

.module{
	font-size: 1.1em;
	margin: 3em auto;
}

.module ul.pointer{
    margin-left: 1.2em;
}

.module ul.pointer > li{
    position: relative;
    margin: 0 0 10px 0;
    padding: 4px 8px;
    list-style: none;
}

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

.module .uiButton{
    text-transform: uppercase;
    font-size: 0.9em;
    padding: 0 3em;
    height: 2.8em;
    line-height: 2.8em;
}

/****/

.bannerGradient{
	background: transparent linear-gradient(117deg, var(--color-3) 50%, var(--color-pact) 100%) 0% 0% no-repeat padding-box;
	position: relative;
	overflow: hidden;
}

.pact .bannerGradient{
	background: transparent linear-gradient(292deg, var(--color-3) 0%, var(--color-pact) 100%) 0% 0% no-repeat padding-box;
}

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

	.pact .bannerGradient{
	  width: 100vw !important;
	  margin-left: calc(50% - 50vw) !important;
	  margin-right: calc(50% - 50vw) !important;
	  padding-left: 1.5em;
	  padding-right: 1.5em;
	}

}

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

	.pact .bannerGradient{
		margin-right: 5%;
	}

}

.banner.module{
    position: relative;
    max-width: none;
    padding: 7% 25% 5% 5%;
    margin: 0;
    min-height: 350px;
    z-index: 10;
    font-weight: 700;
}

.pact .banner.module{
    padding: 5% 25% 5% 5%;
    min-height: auto;
    padding-bottom: 100px;
}

.pact .banner.module.narrow{
    padding-right: 300px;
}

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

	.pact .banner.module{
		padding: 9% 10% 5% 10%;
	}

	.pact .banner.module.narrow{
		padding: 9% 100px 5% 10%;
	}

}

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

	.pact .banner.module h1{
		font-size: 1.5em;
	}

}

.banner.module h1{
    color: var(--color-text);
    font-size: 2em;
}

.banner.module h1.large{
    font-size: 2.8em;
    line-height: 1em;
}

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

	.pact .banner.module h1{
		font-size: 1.8em;
	}

}

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

	.pact .banner.module h1{
		font-size: 1.5em;
	}

}

.pact .banner h1 .flexibleImage{
    width: 200px;
}

.bannerWrap .earth{
    position: absolute;
    width: 30%;
    right: -10%;
    bottom: -4px;
}

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

	.bannerWrap .earth{
		right: 0%;
	}

}

.bannerWrap .cable{
    position: absolute;
    width: 80%;
    height: auto;
    left: 0;
    bottom: 10%;
}

.bannerWrap .globe{
    position: absolute;
    width: 600px;
    right: -250px;
    bottom: -200px;
}

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

	.bannerWrap .globe{
		right: -450px;
		top: -50px;
	}

}

.bannerWrap .thumb{
    position: absolute;
    width: 90px;
    right: 40px;
    top: 40px;
}

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

	.bannerWrap .thumb{
		display: none;
	}

}

.bannerWrap .earth2{
    position: absolute;
    width: 100px;
    right: 40px;
    top: 40px;
}

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

	.bannerWrap .earth2{
		display: none;
	}

}

.bannerWrap .progress{
    position: absolute;
    width: 90px;
    right: 40px;
    top: 40px;
}

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

	.bannerWrap .progress{
		display: none;
	}

}

.bannerWrap .sun{
    position: absolute;
    width: 110px;
    right: 40px;
    top: 40px;
}

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

	.bannerWrap .sun{
		display: none;
	}

}

.pact .module.white{
	background: #ffffff;
	padding: 2.5em;
	max-width: 9999em;
}

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

	.pact .module.card{
		margin-left: 5%;
		margin-top: -70px;
	}

}

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

	.pact .module.card{
		padding: 2.5em;
	}

}

.pact .module.card h1{
	color: inherit;
	text-transform: uppercase;
	font-size: 1.3em;
}

.pact .module.card .centeredButtons{
	max-width: 9999px;
}

.pact .module.card .uiButton{
	text-transform: none;
	background: var(--color-background);
	color: inherit;
	font-size: 0.9em;
	height: 4.5em;
	line-height: 4.5em;
}

.pact .module.card .uiButton:hover{
	background: var(--color-pact);
}

.pact .module.card .tiledLinks .tile{
	width: 150px;
	height: 80px;
}

.pact .module.card .tiledLinks .tile a:hover{
	border-color: transparent;
}

.pact .module.card .tiledLinks .tile a:hover:after{
	content: '';
}

.pact .pactProgressReport{
	margin: 0 auto 2em 0;
}

/****/

.commitments{
	margin: 1em auto;
	display: flex;
	flex-flow: row wrap;
}

.commitment{
	text-align: center;
	padding: 1.5em;
	list-style: none;
	margin: 5px;
	border: 4px solid var(--color-pact);
	flex: 1 1 300px;
	font-size: 0.8em;
}

.commitment2{
	border-color: var(--color-3);
}

.commitment h2{
	margin: 0;
	text-transform: uppercase;
	font-size: 1.4em;
}

.commitment h2 span{
	text-transform: none;
}

.commitment .flexibleImage{
	width: 70px;
	margin: 0 auto;
}

.commitments.tinted .header{
	background-color: #ffffff;
	margin: -1.5em -1.5em 1.5em -1.5em;
	padding: 2em 1.5em 1em 1.5em;
	min-height: 250px;
}

.commitments.tinted .commitment{
	background-color: var(--color-pact-light);
}

.commitments.tinted .commitment2{
	background-color: var(--color-3-light);
}

.commitment .details ul{
	margin: 0;
}

.commitment .details ul li{
	list-style: none;
	margin-bottom: 2em;
}

.commitment .details .flexibleImage{
	width: 60px;
	margin: 0 auto;
}

.commitment .definitions{
	text-align: left;
	margin-top: 3em;
	font-size: 0.9em;
}

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

	.joinRequirement.imageDetail > .image {
		flex: 1 1 50%;
	}

	.joinRequirement.imageDetail > .detail {
		flex: 1 1 50%;
	}

}

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

	.joinRequirement.imageDetail > .image {
		display: none;
	}

}

.joinRequirement.imageDetail{
	margin: 1em auto;
	align-items: center;
}

.joinRequirement.imageDetail img{
	border-radius: 0;
	max-width: 9999px;
}

.joinRequirement.imageDetail .detail .flexibleImage{
	width: 70px;
	margin: auto;
}

.joinRequirement.imageDetail .detail{
	text-align: center;
}

/****/

div.homeText{
    float: left;
    width: 65%;
    padding-right: 2em;
}

.twitterFeed{
    float: left;
    width: 35%;
    border-left: 1px solid var(--color-border-grey);
    margin: 1em 0 2em 0;
    padding-left: 2em;
}

.twitterFeed h2{
    font-size: 1.2em;
    line-height: 1.5em;
    margin-top: 0;
}

.twitterFeed .social svg{
    height: 1.5em;
    width: auto;
    fill: var(--color-text);
    position: relative;
    top: 0.3em;
}

.tweets{
    height: 40em;
    overflow-y: scroll;
    overflow-x: hidden;
    margin-bottom: 2em;
}

.tweet{
    font-size: 0.9em;
    margin: 1.5em 0;
	line-height: 1.5em;
}

.tweet .time{
	display: inline-block;
	font-size: 0.9em;
}

.tweet .time a{
    color: var(--color-text-grey);
}

.tweet .description{
	display: inline-block;
}

.tweet .image, .tweet .detail{
    float: left;
}

.tweet .image{
    display: none;
    width: 0%;
}

.tweet .detail{
    width: 100%;
}

.tweet img{
    margin: 0 1em 0 0;
    width: 100%;
    height: auto;
}

.tweet a:hover img{
	outline: 0;
	opacity: 0.8;
	text-decoration: none;
}

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

	div.homeText{
		float: none;
		width: 100%;
		padding-right: 0;
	}

	.twitterFeed{
		float: none;
		width: 100%;
		border-left: none;
		padding-left: 0;
	}

	.tweets{
		height: 20em;
	}

	.tweet .image{
		width: 8%;
	}

	.tweet .detail{
		width: 88%;
	}

}

/****/

.googleMap{
    height: 350px;
    margin-top: 2em;
    overflow: hidden;
    text-align: center;
}

.googleMapFallback{
    display: none;
}

.contactLinks{
    margin-top: 1em;
}

.contactLinks td{
    padding: 0.2em 0.5em;
}

.contactLinks a{
    font-weight: inherit;
}

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

	.columnGroup .contactInfo{
		padding-right: 15%;
	}

}

/****/

.initiative{
    margin: 1em 0;
    padding: 2em;
    background: #ffffff;
}

.imageDetail img{
    border-radius: 1000px;
    max-width: 250px;
}

.initiative .name{
    font-weight: 700;
    font-size: 1.1em;
    display: inline-block;
    margin-right: 0.2em;
    margin-bottom: 0.3em;
}

.initiative .company{
    font-size: 0.9em;
    opacity: 0.6;
    font-weight: 400;
    display: inline-block;
}

.initiative .description{
    font-size: 0.9em;
}

/****/

.module.document{
    margin: 1em auto;
    padding: 1.5em;
    background: #ffffff;
}

.module.document .name{
    font-weight: 700;
    font-size: 1.1em;
}

.module.document .year{
    font-size: 0.9em;
    opacity: 0.6;
    font-weight: 400;
    margin-left: 0.2em;
}

.module.document .author{
    font-size: 0.8em;
    opacity: 0.6;
    margin: 0.8em 0;
}

.module.document .company{
    font-size: 1.1em;
    margin: 0.5em 0.2em 0.5em 0;
}

.module.document .description{
    font-size: 0.9em;
}

.module.document .buttons{
    margin-top: 1.5em;
}

.module.document .uiButton{
    padding: 0 4em;
    text-align: center;
}

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

	.module.document .uiButton{
		display: inline-block;
		width: 100%;
	}

}

/****/

.reports{
    padding: 1.5em;
    background: #ffffff;
}

.pact .reports{
    padding: 0;
}

.reports .organisationFilterWrap{
    position: relative;
}

.reports .organisationFilterWrap:after{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f078";
    color: #ffffff;
    position: absolute;
    top: 2.2em;
    right: 1em;
}

.reports .organisationFilter select{
    font-size: 1.1em;
    font-weight: 700;
    width: 100%;
    border: 0;
    color: #ffffff;
    background: var(--color-text);
    padding: 1em;
    margin: 1em auto;
}

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

	.reports .organisationFilter select{
		width: 80%;
	}

}

.reports .logo{
    max-width: 200px;
    margin: 2em auto;
}

.reports .document:first-of-type{
    border-top: 1px solid var(--color-border-grey);
}

.reports .document{
    border-bottom: 1px solid var(--color-border-grey);
}

.reports .document .name:before{
    font-family: "FontAwesome";
    font-weight: 400;
    content: "\f019";
    color: var(--color-text-grey);
    margin-right: 0.8em;
}

.reports .document.external .name:before{
    content: "\f08e";
}

/****/

.propertyInfoList .flexibleImage{
	margin: 2em auto;
}

/****/

.pageChooserMore{
    background: #ffffff;
    border-radius: 3px;
    max-width: 750px;
}

.pageChooserMore a{
    color: inherit;
	font-size: 0.9em;
	text-transform: uppercase;
}

.pageChooserMore a:hover{
    color: var(--color-1);
	text-decoration: none;
}

/****/

.mailingListModule.breakout{
    padding: 0 5%;
    margin-top: 2em;
    padding-top: 2em;
    background: #ffffff;
	text-align: left;
    max-width: none;
    border-top: 1px solid var(--color-border-grey);
}

.mailingListModule.breakout h1{
	color: var(--color-1);
	text-transform: none;
	text-align: left;
	font-size: 1.3em;
	margin: 0;
}

.mailingListModule.breakout p{
	font-size: 1.2em;
	margin: 0.5em 0;
}

.mailingListModule.breakout p.note{
	font-size: 0.8em;
}

.mailingListModule input.text{
    padding: 1em;
    background: var(--color-background-light-grey);
	width: 100%;
}

.mailingListModule .formInput.submit{
    width: 100%;
}

.mailingListModule .formInput.submit r{
	padding: 0 3em;
}

.mailingListModule .informationBox{
    padding: 1em 4em;
    background: var(--color-1);
}

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

	.mailingListModule .formInput{
		display: inline-block;
		width: 33%;
	}

}

/****/

.signatories .captionCards{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	margin-top: 1em;
}

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

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

}

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

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

.signatories .captionCard{
	flex: 1 1 200px;
}

.signatories .captionCard .tiledLinks{
	margin: 1em;
}

.signatories .captionCard .tiledLinks .tile img, .signatories .captionCard .tiledLinks .tile svg{
	padding: 0;
}

.signatories .captionCard .title{
    margin: 0 1.5em 1.5em 1.5em;
    text-align: center;
    font-size: 0.8em;
    min-height: 80px;
}

.signatories .captionCard .name{
	font-family: "Header", sans-serif;
    margin: 0 1.5em;
    text-align: center;
}

.signatories .captionCard .date{
	color: var(--color-1);
}

.signatories .captionCard .level{
	background-color: var(--color-pact);
	padding: 0.5em;
	text-transform: uppercase;
	font-family: "Header", sans-serif;
    font-size: 0.9em;
}

.signatories .captionCard .level1{
	background-color: var(--color-3);
}

.signatories .captionCard .level .flexibleImage svg{
	display: inline-block;
	position: relative;
	width: 1em;
	top: 0.1em;
	margin-right: 0.3em;
}

/****/

.dimpactLogo{
	max-width: 300px;
	margin: 2em auto;
}

/****/

.keywords{
	text-align: center;
	margin-top: 2em;
}

.tableWrap .keywords{
	margin-top: 1em;
}

.keywords li, .keywords .dataTable.sortable tr, .keywordFilter .keywordSelect{
	background: #ffffff;
	color: var(--color-1);
	border: 1px solid var(--color-1);
	font-weight: 700;
}

.keywords a:hover li, .keywords .dataTable.sortable tr:hover{
	color: var(--color-2);
	border: 1px solid var(--color-2);
}

.favourite.keywordSelect .uiButton{
    padding: 0;
    margin: 0;
    background: transparent;
    color: var(--color-1);
    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";
}

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

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

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

/****/

.filterWrap{
    max-width: 750px;
}

.filterWrap div.search{
    background: #ffffff;
}

.filterWrap div.search .uiButton{
    color: var(--color-1);
}

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

.filterWrap .expandToggle{
    color: var(--color-1);
}

/****/

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

.createButtons .uiButton{
    width: 24%;
}

/****/

.post{
	padding: 1em;
}

.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: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;
}

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

.post .type svg{
	height: 2em;
	width: auto;
	margin-right: 0.3em;
}

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

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

}

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

.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;
	line-height: 1;
	display: inline-block;
}

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

.post .postActions .uiButton.grey{
	color: #999;
}

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

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

.post .postActions .tickCross, .post .postActions .uiButton{
	font-size: 2em;
	color: var(--color-border-grey);
	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-1);
}

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

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

.post .commentsTable{
	margin-bottom: 0;
}

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

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

.post .flexibleImage.organisation img, .post .flexibleImage.user img{
    max-width: 250px;
    height: auto !important;
}

.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;
}

/****/

.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;
	border-radius: 5px;
	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;
    border-radius: 3px;
}

.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;
}

.adminModule .card{
	padding: 1em;
	margin: 1em auto;
	background: var(--color-background);
    position: relative;
    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: 1em 0;
}

.speaker{
    background: #ffffff;
    font-size: 0.9em;
	display: flex;
	gap: 1em;
	flex-wrap: wrap;
	align-items: center;
}

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

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

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

.speaker .name{
    font-weight: 700;
    font-size: 1.4em;
    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-1);
    margin-right: 0.5em;
}

.speaker .linkedIn:before{
    font-family: "FontAwesome";
  	font-weight: 400;
    content: "\f0e1";
    color: var(--color-1);
    margin-right: 0.5em;
}

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

/****/

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

.captionCards.team .captionCard{
	max-width: 275px;
	text-align: center;
}

.captionCards.team .captionCard{
	flex: 1 1 275px;
}

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

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

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

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

.captionCards.team .userImage svg{
	padding: 0.5em;
}

.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: 0.5em 0;
	font-size: 0.8em;
	font-weight: 700;
}

/****/

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

/****/

.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: 1.5em;
	background: var(--color-1);
	color: #ffffff;
	text-align: left;
}

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

.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.agenda{
	background: #1b68aa;
	background: var(--color-1);
}

.keyResource.document{
	background: var(--color-1);
}

.keyResource.minutes{
	background: #1b68aa;
	background: var(--color-1);
}

.keyResource.information{
	background: var(--color-management);
	background: var(--color-1);
}

.keyResource.slides{
	background: #1b68aa;
	background: var(--color-1);
}

.keyResource.template{
	background: var(--color-labor);
	background: var(--color-1);
}

.keyResource.training{
	background: var(--color-ethics);
	background: var(--color-1);
}

.keyResource.webinar{
	background: var(--color-ethics);
	background: var(--color-1);
}

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

.keyResource .type{
	font-size: 0.9em;
	font-weight: 700;
}

.keyResource .type{
	display: flex;
	align-items: center;
}

.keyResource .type svg{
	height: 1.5em;
	width: auto;
	margin-right: 0.5em;
}

.keyResource .type svg *{
	fill: #ffffff;
}

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

/****/

.groupType{
	font-family: "Header", sans-serif;
    margin-top: -0.8em;
	text-transform: uppercase;
	opacity: 0.8;
	text-align: center;
	font-size: 0.8em;
}