/* CSS STYLES MANAGING THE PROMOTIONAL BANNER ON THE EUROPEAN PARLEMENT's PORTAL */
/* Composant "PROMOTIONAL ZONE" | template "EUROPE DAY" */
/* Copyright : European Parliament */
	
/* ============================================================================================================================================================================== */
/* == BANNER "EUROPE DAY" ======================================================================================================================================================= */
/* ============================================================================================================================================================================== */

	/* ========================================================================================================================================================================== */
	/* == GENERIC STYLES FOR ALL VERSIONS ======================================================================================================================================= */
		
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Main containers */

			/* GENERAL : Reset all tags */
			#website #electionsdate2024.eppz_promotional a,
			#website #electionsdate2024.eppz_promotional h2,
			#website #electionsdate2024.eppz_promotional div,
			#website #electionsdate2024.eppz_promotional ul,
			#website #electionsdate2024.eppz_promotional li,
			#website #electionsdate2024.eppz_promotional span,
			#website #electionsdate2024.eppz_promotional time,
			#website #electionsdate2024.eppz_promotional strong,
			#website #electionsdate2024.eppz_promotional em{
				position: 							static;
				display: 							inline-block;
				margin: 							0;
				padding: 							0;
				border:								none;
				outline: 							none;
				font-size: 							1em;
				font-weight: 						normal;
				text-decoration: 					none;
				letter-spacing: 					normal;
				line-height: 						normal;
				white-space: 						normal;
				cursor: 							default;
				color: 								inherit;
			}
			#website #electionsdate2024.eppz_promotional a,
			#website #electionsdate2024.eppz_promotional a *{
				cursor: 							pointer 	!important;
			}
			/* GENERAL : Hidden elements */
			#website #electionsdate2024.eppz_promotional .eppz_hidden{
				position: 							absolute	!important;
				display: 							block		!important;
				overflow: 							hidden		!important;
				width: 								0 			!important;
				height: 							0 			!important;
				opacity: 							0 			!important;
			}
			/* GENERAL : Main containers */
			#website #electionsdate2024.eppz_promotional{
				position: 							relative;
				display: 							block;
				overflow: 							hidden;
				margin: 							0;
				padding: 							0;
				background-color: 					#034da2;
				border:								none;
				outline: 							none;
				font-family: 						Helvetica, Arial, sans-serif;
				font-size: 							1em;
				font-weight: 						normal;
				text-decoration: 					none;
				text-align: 						center;
				white-space: 						nowrap;
				color: 								#fff;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner{
				position: 							relative;
				display: 							block;
				overflow: 							hidden;
				margin: 							0;
				padding: 							0;
				background-color: 					inherit;
				text-align: 						center;
				cursor: 							inherit;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content{
				position: 							static;
				display: 							block;
				display: 							flex;
				display: 							-webkit-flex;
				max-width: 							1300px;
				margin: 							0 auto;
				padding: 							0;
				background-color: 					inherit;
				flex-direction: 					row;
				-webkit-flex-direction: 			row;
				align-items: 						stretch;
				-webkit-align-items: 				stretch;
				justify-content: 					flex-start;
				-webkit-justify-content: 			flex-start;
				letter-spacing: 					-0.32em;
				white-space: 						nowrap;
				cursor: 							inherit;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content:after,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				position: 							relative;
				display: 							inline-block;
				width: 								100%;
				margin: 							0;
				padding: 							0;
				box-sizing: 						border-box;
				text-align:							left;
				vertical-align:						middle;
				white-space:						normal;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content:after{	
				width: 								0;
				height: 							30em;
				content: 							"";
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text 	+ .eppz_image,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image 	+ .eppz_text{
				margin-left: 						-100%;
			}
			#website #electionsdate2024.eppz_promotional + .eppz_promotional:after{
				position: 							absolute;
				display: 							block;
				z-index: 							5;
				top: 								-40px;
				left: 								0;
				right: 								0;
				height: 							40px;
				margin:								0;
				padding: 							0;
				background-color: 					#fff;
				box-shadow: 						0 0 10px rgba(0,0,0,0.4);
				content: 							'';
			}
			#website #electionsdate2024.eppz_promotional + .eppz_promotional{
				overflow: 							visible;
				margin-top: 						40px;
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Image */

			/* IMAGE :: image original and modified */
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image{
				right: 								-27em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image:after{
				position: 							absolute;
				display: 							block;
				overflow: 							hidden;
				top: 								-10%;
				bottom: 							-170%;
				left: 								0;
				right: 								0;
				background-image:					url(electionsdate2024.svg);
				background-position:				right top;
				background-size:					auto 100%;
				background-repeat:					no-repeat;
				content: 							"";
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Texts */

			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				display: 							inline-flex;
				display: 							-webkit-inline-flex;
				max-width: 							1300px;
				margin: 							0 auto;
				padding: 							50px; 
				flex-direction: 					column;
				-webkit-flex-direction: 			column;
				align-items: 						flex-start;
				-webkit-align-items: 				flex-start;
				justify-content: 					flex-start;
				-webkit-justify-content: 			flex-start;
				text-align: 						left;
				vertical-align: 					top;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span{
				position: 							static;
				display:							inline-block;
				margin: 							0;
				font-size: 							1em;
				color: 								inherit;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_title{
				word-spacing: 						1.2em;
				text-transform: 					uppercase;
			}
			#website #electionsdate2024.eppz_promotional[lang="el"] .eppz_content .eppz_text .eppz_title,
			#website #electionsdate2024.eppz_promotional[lang="ga"] .eppz_content .eppz_text .eppz_title{
				text-transform: 					none;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_title span{
				position: 							static;
				display: 							block;
				margin: 							0;
				font-size: 							5em;
				word-spacing: 						normal;
				color: 								inherit;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date{
				color: 								#FCBE00;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date span{
				font-size: 							2.5em;
				color: 								inherit;
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Focus effect */

			/* FOCUS :: Text */
			#website #electionsdate2024.eppz_promotional .eppz_banner{
				transition:							background-color 0.3s ease-out 0s;
				-webkit-transition:					background-color 0.3s ease-out 0s;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner .eppz_text .eppz_title 	span,
			#website #electionsdate2024.eppz_promotional .eppz_banner .eppz_text .eppz_date 	span{
				transition:							color 0.3s ease-out 0s;
				-webkit-transition:					color 0.3s ease-out 0s;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner,
			#website #electionsdate2024.eppz_promotional .eppz_banner:link,
			#website #electionsdate2024.eppz_promotional .eppz_banner:visited{
				background-color: 					inherit;
				color: 								#fff;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner:hover,
			#website #electionsdate2024.eppz_promotional .eppz_banner:focus,
			#website #electionsdate2024.eppz_promotional .eppz_banner:active{
				background-color: 					#fff;
				color: 								#034da2;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner 			.eppz_text .eppz_date span,
			#website #electionsdate2024.eppz_promotional .eppz_banner:link 		.eppz_text .eppz_date span,
			#website #electionsdate2024.eppz_promotional .eppz_banner:visited 	.eppz_text .eppz_date span{
				color: 								inherit;
			}
			#website #electionsdate2024.eppz_promotional .eppz_banner:hover 	.eppz_text .eppz_date span,
			#website #electionsdate2024.eppz_promotional .eppz_banner:focus 	.eppz_text .eppz_date span,
			#website #electionsdate2024.eppz_promotional .eppz_banner:active 	.eppz_text .eppz_date span{
				color: 								#000;
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Animation */
			
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > .eppz_date,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > .eppz_title > span,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_logo{
				opacity: 							0;
				animation-duration: 				2s;
				-webkit-animation-duration: 		2s;
				animation-fill-mode: 				forwards;
				-webkit-animation-fill-mode: 		forwards;
				animation-timing-function: 			ease;
				-webkit-animation-timing-function: 	ease;
				animation-delay:  					0.7s;
				-webkit-animation-delay:  			0.7s;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > .eppz_date{
				opacity: 							0;
				animation-name:						electionsdate2024_image;
				-webkit-animation-name: 			electionsdate2024_image;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > .eppz_title > span{
				transform: 							translate(1em, 0);
				-webkit-transform:					translate(1em, 0);
				animation-name:						electionsdate2024_text;
				-webkit-animation-name: 			electionsdate2024_text;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(1){	animation-delay:	1s;		-webkit-animation-delay:  1s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(2){	animation-delay:	1.1s;	-webkit-animation-delay:  1.1s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(3){	animation-delay:	1.2s;	-webkit-animation-delay:  1.2s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(4){	animation-delay:	1.3s;	-webkit-animation-delay:  1.3s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(5){	animation-delay:	1.4s;	-webkit-animation-delay:  1.4s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(6){	animation-delay:	1.5s;	-webkit-animation-delay:  1.5s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(7){	animation-delay:	1.6s;	-webkit-animation-delay:  1.6s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(8){	animation-delay:	1.7s;	-webkit-animation-delay:  1.7s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_title > span:nth-child(9){	animation-delay:	1.8s;	-webkit-animation-delay:  1.8s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text > span.eppz_date{							animation-delay:	1.8s;	-webkit-animation-delay:  1.8s;		}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_logo{
				animation-name:						electionsdate2024_image;
				-webkit-animation-name: 			electionsdate2024_image;
				animation-duration: 				1.1s;
				-webkit-animation-duration: 		1.1s;
				animation-delay:  					0.5s;
				-webkit-animation-delay:  			0.5s;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_logo{
				animation-delay:  					2.2s;
				-webkit-animation-delay:  			2.2s;
			}
			@keyframes electionsdate2024_text{
				0%{
					opacity: 						0;
					transform: 						translate(1em, 0);
					-webkit-transform:				translate(1em, 0);
				}
				50%{	
					transform: 						translate(0, 0);
					-webkit-transform:				translate(0, 0);
				}
				100%{	
					opacity: 						1;
					transform: 						translate(0, 0);
					-webkit-transform:				translate(0, 0);
				}
			}
			@keyframes electionsdate2024_image{
				from{
					opacity: 						0;
				}
				to{
					opacity: 						1;
				}
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : JS actions */

			/* JS actions :: Stop the CSS animation */
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > .eppz_date,
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > .eppz_title > span,
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_content .eppz_logo{
				animation-name:						none;
				-webkit-animation-name: 			none;
				animation-play-state: 				paused;
				-webkit-animation-play-state:		paused;
			}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_image{										animation-delay:	0s;		-webkit-animation-delay:  0s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(1){	animation-delay:	0.5s;	-webkit-animation-delay:  0.5s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(2){	animation-delay:	0.6s;	-webkit-animation-delay:  0.6s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(3){	animation-delay:	0.7s;	-webkit-animation-delay:  0.7s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(4){	animation-delay:	0.8s;	-webkit-animation-delay:  0.8s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(5){	animation-delay:	0.9s;	-webkit-animation-delay:  0.9s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(6){	animation-delay:	1s;		-webkit-animation-delay:  1s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(7){	animation-delay:	1.1s;	-webkit-animation-delay:  1.1s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(8){	animation-delay:	1.2s;	-webkit-animation-delay:  1.2s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_title > span:nth-child(9){	animation-delay:	1.3s;	-webkit-animation-delay:  1.3s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_text > span.eppz_date{						animation-delay:	1.4s;	-webkit-animation-delay:  1.4s;		}
			#website #electionsdate2024.eppz_promotional[data-anim] .eppz_content .eppz_logo{										animation-delay:	1.6s;	-webkit-animation-delay:  1.6s;		}
			/* JS actions :: Launch the CSS animation */
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_text > .eppz_title > span{
				animation-name:						electionsdate2024_text;
				-webkit-animation-name: 			electionsdate2024_text;
			}
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_text > .eppz_date,
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_logo{
				animation-name:						electionsdate2024_image;
				-webkit-animation-name: 			electionsdate2024_image;
			}
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_text > .eppz_date,
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_text > .eppz_title > span,
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_image,
			#website #electionsdate2024.eppz_promotional[data-anim]:not([data-init]) .eppz_content .eppz_logo{
				animation-play-state: 				running;
				-webkit-animation-play-state:		running;
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
		/* GENERAL : Linguistic corrections */

			#website #electionsdate2024.eppz_promotional[lang="et"] .eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="lt"] .eppz_content .eppz_text .eppz_title span{
				text-shadow: 						1px 1px 0 rgba(3,77,162,0.3), -1px -1px 0 rgba(3,77,162,0.3), 1px -1px 0 rgba(3,77,162,0.3), -1px 1px 0 rgba(3,77,162,0.3);
				transition:							text-shadow 0.2s ease-out 0s;
			}
			#website #electionsdate2024.eppz_promotional[lang="et"] .eppz_banner:hover 	.eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="et"] .eppz_banner:focus 	.eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="et"] .eppz_banner:active .eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="lt"] .eppz_banner:hover 	.eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="lt"] .eppz_banner:focus 	.eppz_content .eppz_text .eppz_title span,
			#website #electionsdate2024.eppz_promotional[lang="lt"] .eppz_banner:active .eppz_content .eppz_text .eppz_title span{
				text-shadow: 						1px 1px 0 rgba(3,77,162,0), -1px -1px 0 rgba(3,77,162,0), 1px -1px 0 rgba(3,77,162,0), -1px 1px 0 rgba(3,77,162,0);
			}
		
	/* ========================================================================================================================================================================== */
	/* == STYLES BY BREAKPOINTS ================================================================================================================================================= */
		
		@media screen and (max-width: 1219px){
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image{
				right: 								-20em;
			}
		}
		@media screen and (max-width: 1019px){
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image{
				right: 								0;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image:after{
				right: 								-28em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				padding: 							50px 30px;
			}
		}
		@media screen and (max-width: 749px){
			#website #electionsdate2024.eppz_promotional .eppz_content:after{	
				height: 							24em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image:after{
				right: 								-24em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				padding: 							20px 20px 40px 20px;
				justify-content: 					center;
				-webkit-justify-content: 			center;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_title span{
				font-size: 							4em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date span{
				font-size: 							2em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date{
				padding-top: 						10px;
			}
		}
		@media screen and (max-width: 639px){
			#website #electionsdate2024.eppz_promotional .eppz_content:after{	
				height: 							20em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image:after{
				right: 								-20em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				padding: 							20px 30px;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_title span{
				font-size: 							3.2em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date span{
				font-size: 							1.8em;
			}
		}
		@media screen and (max-width: 479px){
			#website #electionsdate2024.eppz_promotional .eppz_content:after{	
				height: 							25em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_image:after{
				top: 								0;
				bottom: 							-20em;
				right: 								-14em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text{
				padding: 							10px 20px 40px 20px;
				justify-content: 					center;
				-webkit-justify-content: 			center;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_title span{
				font-size: 							2.8em;
			}
			#website #electionsdate2024.eppz_promotional .eppz_content .eppz_text .eppz_date span{
				font-size: 							1.4em;
			}
		}

