/* SDG OVERZICHT */

.sdg-overview .et_pb_salvattore_content[data-columns]::before {
	content: '4 .column.size-1of4' !important;
}
@media only screen and ( min-width: 981px ) {
	.sdg-overview .column.size-1of4 {
		width: 25%!important;
		margin-right: 0%;
		background-color: grey;
	}
	.sdg-overview .column.size-1of4:hover {
		width: 50%!important;
		margin-right: 0%;
		z-index: 1;
		position: absolute;
	}	
	.sdg-overview .column.size-1of4:hover::before {
		content:" ";
		display: block;
		width: 25%!important;
		margin-right: 0%;
		background-color: grey;
	}	
}
.sdg-overview .column.size-1of4 .post-content{
	display: none;
}
.sdg-overview .column.size-1of4 .entry-title{
	display: none;
}
.sdg-overview .column.size-1of4:hover .post-content{
	display: block;
}
/* SDG PAGINA */
/** SDG-page header */

/*
body.single-sdg #main-header {
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 5;
}
body.single-sdg #main-header + * {
	border-top: 112px solid transparent;
}
body.single-sdg #breadcrumbs {
	position: fixed;
	top: 112px;
	width: 100%;
	z-index: 4;
}
body.single-sdg #breadcrumbs + * {
	border-top: 48px solid transparent;
}
*/
body.single-sdg.et-db #et-boc .et-l .et_pb_row_0 .et_pb_column {
	z-index: 3;
}

/* SDG PAGINA */

body.single-sdg #page-container #main-content > .container {
		padding-top: 0px;
}
body.single-sdg #page-container #main-content .et_pb_row_0 {
		margin-bottom: 0px;
}
body.single-sdg #page-container #main-content .et_pb_row_0 .et_pb_column {
	min-height: 0px;
}
body.single-sdg #page-container #main-content .et_pb_row_1  {
}


body.single-sdg #page-container #main-content .sdg-menu {
	background-color: #9E9E9E;
	position: fixed;
	top: 160px;
	left: 0px;
	right: 0px;
	width: 1440px;
	margin-left: auto;
	margin-right: auto;
	z-index: 1;
	padding: 0px;
}
#page-container #main-content .sdg-menu{
	display: flex;
	width: 100%;
	flex-direction: row;
	justify-content: flex-end;
/*	columns: 17; */
	column-gap: 0px;
	list-style-type: none;
	padding: 0px;
}
#page-container .sdg-menu .sdg{
	width: 100%;
	height: 100%;
	background-color: #4F4F4F;
}
#page-container .sdg-menu .sdg:nth-child(even){
	width: 100%;
	height: 100%;
	background-color: #9E9E9E;
}
#page-container .sdg-menu .sdg a,
#page-container .sdg-menu .sdg a img {
	display: block;
}

#page-container #main-content .sdg-menu .scroll-left,
#page-container #main-content .sdg-menu .scroll-right {
	display: none;
}
body.single-sdg #page-container #main-content .sdg-menu.scrolling {
	right: auto;
}

#page-container #main-content .sdg-menu.scrolling .scroll-left,
#page-container #main-content .sdg-menu.scrolling .scroll-right {
	display: block;
	position: fixed;
	top: inherit;
	background-position: center center;
	background-repeat: no-repeat;
}

#page-container #main-content .sdg-menu .scroll-left {
	left: 0px;
	background-image: url("icons/previous-white.svg");
}

#page-container #main-content .sdg-menu .scroll-right {
	right: 0px;
	background-image: url("icons/next-white.svg");
}


.single-sdg #page-container #main-content h2{
	margin-bottom: 64px;
}

/* SDG title */
#page-container  #et-boc #sdg-header {
	padding-bottom: 0px !important;
}
@media only screen and ( min-width: 1440px ) {
	#page-container  #et-boc #sdg-header {
		padding: 0px 20px;
		margin: 0px -20px;
		box-sizing: content-box;
		padding-left: calc( calc( 50vw - 50% ) - 1px);
		margin-left: calc( 1px - calc( 50vw - 50% ));
		padding-right: calc( calc( 50vw - 50% ) - 9px);
		margin-right: calc( 9px - calc( 50vw - 50% ));
	}
}
 
#page-container #main-content #sdg-header .et_pb_column {
	float: none;
	padding: 49px 86px;
	margin-bottom: 86px;
}
.sdg-11 #page-container #main-content #sdg-header .et_pb_column {
	padding: 49px 60px;
}
#page-container  #et-boc #sdg-header .entry-title{
	font-size: 141px;
	color: #FFFFFF !important;
	line-height: 132px;
	margin: 0px;
	font-weight: normal;
}
#page-container  #main-content #sdg-header .et_pb_image_wrap{
	margin: -170px 0px 0px;
	text-align: center;
}

#page-container #main-content #sdg-header::before {
	content: '';
	display: block;
	width: 100%;
	height: 0px;
	padding-bottom: 5.88235%; /* 1/17 of parent width, same as height of sdg-menu */
}
#page-container #main-content #sdg-header::after {
	content: '';
	display: block;
	visibility: visible;
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 70px;
	width: auto;
	background: linear-gradient(transparent, rgba(117,117,117,0.42));
}

#page-container  #main-content #sdg-header .et_pb_image_wrap::after{
	content:"";
	display: block;
	width: 0px;
	height: 0px;
	border-left: 150px solid transparent;
	border-right: 150px  solid transparent;
	border-top-style: solid;
	border-top-width: 150px;
	border-top-color: inherit;
	margin: -40px auto -92px;
}

/* zorgen dat de border-color de van de sdg-header geerft kan worden door .et_pb_image_wrap::after  */
#page-container  #main-content #sdg-header.sdg-background .et_pb_column,  
#page-container  #main-content #sdg-header.sdg-background .et_pb_module,  
#page-container  #main-content #sdg-header.sdg-background .et_pb_image,  
#page-container  #main-content #sdg-header.sdg-background .et_pb_image_wrap{
	border-color: inherit;
}	

#page-container  #main-content #sdg-header .et_pb_image_wrap img{
	width: 338px;
}

/** SDG-page body */
body.single-sdg #page-container .et_pb_text_inner{
	font-size: 24px;
	line-height: 28px;
	font-family: 'GT Eesti Text Regular',Helvetica,Arial,Lucida,sans-serif;
}

#page-container .intro-text .et_pb_text_inner{
	margin: 70px auto 70px;
	max-width: 910px;
}
.page #page-container .intro-text .et_pb_text_inner h1{
	padding-bottom: 48px;
}
body.single-sdg #page-container .intro-text .et_pb_text_inner{
	font-size: 32px;
	line-height: 36px;
	margin: 0px auto 86px;
}
#page-container #main-content .toggled-by-targets-toggle {
	margin-top: 28px;
	max-width: 1360px;
}
#page-container #main-content .toggled-by-targets-toggle .et_pb_column_1_3{
	width: calc(33.333333% - 50px);
	margin-right: 25px;
}
#page-container #main-content .toggled-by-targets-toggle .et_pb_column_1_3:last-child{
	margin-right: 0px;
}
#page-container #main-content .toggled-by-targets-toggle .et_pb_text_inner{
	font-size: 16px;
	line-height: 20px;
	margin: 55px 0px 55px;
}

#page-container #main-content  .toggled-by-alliantiecoordinator-toggle.full-width-background{
	background-color: #EBFF00;
}

#page-container #main-content  .toggled-by-alliantiecoordinator-toggle .et_pb_column_1_3 {
	padding-top: 32px;
	padding-bottom: 40px;
}
#page-container #main-content  .toggled-by-alliantiecoordinator-toggle .et_pb_column_2_3 {
	padding-top: 64px;
	padding-bottom: 40px;
}
#page-container #main-content  .toggled-by-alliantiecoordinator-toggle .et_pb_blurb_description{
	font-size: 16px;
	line-height: 20px;
}
#page-container #main-content .toggled-by-alliantiecoordinator-toggle .et_pb_text_inner{
	max-width: 910px;
	margin: 40px auto 40px;
}

#page-container #main-content .et_pb_text_inner em,
#page-container #main-content  .et_pb_blurb_description em{
/*	font-style: normal;
	background-color: #f7ffa9;*/
}


/* SDG PAGINA */

.single-sdg #page-container .et_post_meta_wrapper{
	display: none;
}

.single-sdg #page-container .et_pb_post_title {
	min-height: 406px;
}
.single-sdg #page-container .et_pb_post_title h1{
	font-size: 141px;
	color: #FFFFFF;
}

/* SDG GRID */
#page-container #main-content .sdg-grid h2{
	margin: 80px 0px 64px 90px;
}

/* gallery met class .gallery-no-margin ontdoen van marges */
#page-container #main-content .gallery-no-margin .et_pb_gallery_item.et_pb_grid_item{
	width: 25%;
	margin: 0px;
	height: 100%;
	padding: 0px;
}
#page-container #main-content .gallery-no-margin .et_pb_gallery_item.et_pb_grid_item .et_pb_gallery_image {
    position: relative;
    padding-bottom: 100%;
    height: 0;
    overflow: hidden;
}
#page-container #main-content .gallery-no-margin .et_pb_gallery_item.et_pb_grid_item img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover !important;	
}
/* 
#page-container #main-content .sdg-grid.has-row-title {
	padding-top: 208px;
}
#page-container #main-content .sdg-grid.has-row-title .et_pb_column:first-child .et_pb_module:first-child h2 {
	margin: 80px 0px;
}
*/

#page-container .sdg-list{
	display: grid;
	width: calc(100% - 180px);
	margin: 0px 90px;
	grid-template-columns: 25% 25% 25% 25%;
	column-gap: 0px;
	list-style-type: none;
	padding: 0px;	
	z-index: 1;
}
#page-container .sdg-list > .sdg {
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 0;
}

#page-container .sdg-list > .sdg .excerpt-container {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	box-sizing: content-box;
	background-color: inherit;
	z-index: -1;
	overflow: hidden;
}
#page-container .sdg-list > .sdg .excerpt-container > span {
	display: block;
	color: white;
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	box-sizing: border-box;
	padding: 20px;
	padding-bottom: 90px;
	opacity: 0;
	font-family: 'GT Eesti Text Regular',Helvetica,Arial,Lucida,sans-serif;
	font-size: 20px;
	font-weight: normal;
}
/*
#page-container .sdg-list > .sdg .excerpt-container span:after {
	content: 'LEES MEER';
	display: block;
	position: absolute;
	bottom: 20px;
	left: 20px;
	width: 160px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	border: 1px solid white;
	border-radius: 25px;
	font-size: 20px;

}*/
#page-container .sdg-list > .sdg .excerpt-container span a.read-more {
	display: block;
	position: absolute;
	bottom: 20px;
	left: 20px;
	width: 160px;
	height: 50px;
	line-height: 50px;
	text-align: center;
	border: 1px solid white;
	border-radius: 25px;
	font-size: 20px;
	text-decoration: none;
	color: inherit;
	text-transform: uppercase;
}

/*
// Old SDG grow-animation
#page-container .sdg-list > .sdg:nth-child(4n+0) .excerpt-container {
	left: auto;
	right: 0px;
}

#page-container .sdg-list > .sdg:nth-last-child(1) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+1) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+2) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+3) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(3):nth-child(4n+1) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(3):nth-child(4n+2) .excerpt-container,
#page-container .sdg-list > .sdg:nth-last-child(4):nth-child(4n+1) .excerpt-container { // This is a last-row SDG
	top: auto;
	bottom: 0px;
}
#page-container .sdg-list > .sdg:nth-last-child(1) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+1) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+2) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(2):nth-child(4n+3) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(3):nth-child(4n+1) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(3):nth-child(4n+2) .excerpt-container > span,
#page-container .sdg-list > .sdg:nth-last-child(4):nth-child(4n+1) .excerpt-container > span { // This is the show-on-mouseover content of a last-row SDG
	bottom: 50%;
}

#page-container .sdg-list > .sdg:hover {
	z-index: 2;
}
#page-container .sdg-list > .sdg:hover .excerpt-container {
	width: 200%;
	height: 200%;
	animation: grow-and-wait 2s ease;
}
@keyframes grow-and-wait { 
	0% { width: 100%; height: 100%; }
	50% { width: 200%; height: 200%; }
	100% { width: 200%; height: 200%; }
}
*/

#page-container .sdg-list > .sdg > a:before {
	content: ' SDG: ' attr(title);
	display: block;
	color: white;
	position: absolute;
	left: 0px;
	width: 100%;
	box-sizing: border-box;
	padding: 20px;
	opacity: 0;
	font-family: 'GT Eesti Text Regular',Helvetica,Arial,Lucida,sans-serif;
	font-size: 24px;
	font-weight: normal;
}

#page-container .sdg-list > .sdg:hover > a:before,
#page-container .sdg-list > .sdg:hover .excerpt-container > span {
	opacity: 1;
	animation: wait-and-fade-in 0.5s ease;
}
@keyframes wait-and-fade-in {
	0% { opacity: 0; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}

#page-container .sdg-list > .sdg > a > img {
	opacity: 1;
}

#page-container .sdg-list > .sdg:hover > a > img {
	opacity: 0;
	animation: fade-out-and-wait 1s ease;
}
@keyframes fade-out-and-wait {
	0% { opacity: 1; }
	50% { opacity: 0; }
	100% { opacity: 0; }
}


/* sdg kleuren */

#page-container .sdg-list .sdg-1-item,
#page-container .sdg-menu .sdg-1-item:hover,
#page-container .sdg-menu .sdg-1-item.sdg-active,
.sdg-1 #page-container .sdg-background{
	background-color: #FF0000 !important;
	border-color: #FF0000;
}
#page-container .sdg-list .sdg-2-item,
#page-container .sdg-menu .sdg-2-item:hover,
#page-container .sdg-menu .sdg-2-item.sdg-active,
.sdg-2 #page-container .sdg-background{
	background-color: #EDAA10 !important;
	border-color: #EDAA10;
}
#page-container .sdg-list .sdg-3-item,
#page-container .sdg-menu .sdg-3-item:hover,
#page-container .sdg-menu .sdg-3-item.sdg-active,
.sdg-3 #page-container .sdg-background{
	background-color: #00A000 !important;
	border-color: #00A000;
}
#page-container .sdg-list .sdg-4-item,
#page-container .sdg-menu .sdg-4-item:hover,
#page-container .sdg-menu .sdg-4-item.sdg-active,
.sdg-4 #page-container .sdg-background{
	background-color: #DA0822 !important;
	border-color: #DA0822;
}
#page-container .sdg-list .sdg-5-item,
#page-container .sdg-menu .sdg-5-item:hover,
#page-container .sdg-menu .sdg-5-item.sdg-active,
.sdg-5 #page-container .sdg-background{
	background-color: #FF4000 !important;
	border-color: #FF4000;
}
#page-container .sdg-list .sdg-6-item,
#page-container .sdg-menu .sdg-6-item:hover,
#page-container .sdg-menu .sdg-6-item.sdg-active,
.sdg-6 #page-container .sdg-background{
	background-color: #00AED9 !important;
	border-color: #00AED9;
}
#page-container .sdg-list .sdg-7-item,
#page-container .sdg-menu .sdg-7-item:hover,
#page-container .sdg-menu .sdg-7-item.sdg-active,
.sdg-7 #page-container .sdg-background{
	background-color: #FDBE00 !important;
	border-color: #FDBE00;
}
#page-container .sdg-list .sdg-8-item,
#page-container .sdg-menu .sdg-8-item:hover,
#page-container .sdg-menu .sdg-8-item.sdg-active,
.sdg-8 #page-container .sdg-background{
	background-color: #9F0830 !important;
	border-color: #9F0830;
}
#page-container .sdg-list .sdg-9-item,
#page-container .sdg-menu .sdg-9-item:hover,
#page-container .sdg-menu .sdg-9-item.sdg-active,
.sdg-9 #page-container .sdg-background{
	background-color: #FF6919 !important;
	border-color: #FF6919;
}
#page-container .sdg-list .sdg-10-item,
#page-container .sdg-menu .sdg-10-item:hover,
#page-container .sdg-menu .sdg-10-item.sdg-active,
.sdg-10 #page-container .sdg-background{
	background-color: #FF006E !important;
	border-color: #FF006E;
}
#page-container .sdg-list .sdg-11-item,
#page-container .sdg-menu .sdg-11-item:hover,
#page-container .sdg-menu .sdg-11-item.sdg-active,
.sdg-11 #page-container .sdg-background{
	background-color: #F9B000 !important;
	border-color: #F9B000;
}
#page-container .sdg-list .sdg-12-item,
#page-container .sdg-menu .sdg-12-item:hover,
#page-container .sdg-menu .sdg-12-item.sdg-active,
.sdg-12 #page-container .sdg-background{
	background-color: #F08700 !important;
	border-color: #F08700;
}
#page-container .sdg-list .sdg-13-item,
#page-container .sdg-menu .sdg-13-item:hover,
#page-container .sdg-menu .sdg-13-item.sdg-active,
.sdg-13 #page-container .sdg-background{
	background-color: #379223 !important;
	border-color: #379223;
}
#page-container .sdg-list .sdg-14-item,
#page-container .sdg-menu .sdg-14-item:hover,
#page-container .sdg-menu .sdg-14-item.sdg-active,
.sdg-14 #page-container .sdg-background{
	background-color: #0D81DF !important;
	border-color: #0D81DF;
}
#page-container .sdg-list .sdg-15-item,
#page-container .sdg-menu .sdg-15-item:hover,
#page-container .sdg-menu .sdg-15-item.sdg-active,
.sdg-15 #page-container .sdg-background{
	background-color: #56C739 !important;
	border-color: #56C739;
}
#page-container .sdg-list .sdg-16-item,
#page-container .sdg-menu .sdg-16-item:hover,
#page-container .sdg-menu .sdg-16-item.sdg-active,
.sdg-16 #page-container .sdg-background{
	background-color: #0E559C !important;
	border-color: #0E559C;
}
#page-container .sdg-list .sdg-17-item,
#page-container .sdg-menu .sdg-17-item:hover,
#page-container .sdg-menu .sdg-17-item.sdg-active,
.sdg-17 #page-container .sdg-background{
	background-color: #362397 !important;
	border-color: #362397;
}