/* CSS Document */
/* Mobile First */









/* ---------------- E V E N T  P A G E  L A Y O U T ----------------  */


	/* ....  H T M L  S T R UC T U R E ...
	
	A - .CollectionPane
	
		1 - .CollectionPane



	B - .MainPane 
			
		1 - .Logistic
		
		2 - .Flexible
		
		3 - .ContactBar
		
		4 - .ShareBar
	
	*/


/*--- STACKED GRID -----*/

	.EventLayout {
		display: grid;
		padding-top: 0;
		}
		/* No Collection on small devices */
		@media (max-width:1023px) {
			.EventPage .CollectionPane,
			.MonthlyPage .CollectionPane {
				display: none;
				}
				}		
		/* show the collection last*/
		.CollectionPane {
			order: 2;
			}
		/* show the collection last*/
		.MainPane {
			order: 1; /*yea, I know, redundant */
			}


/* 2 COLS GRID */

@media (min-width:1024px) {
	.EventLayout {
		position: relative;
	    grid-template-columns: auto minmax(18em, 25%) ;
		padding-top: 0;
		}
		/* Collection */ 
			.CollectionPane {
				position: relative;
				grid-column: 2;
				grid-row: 1 / span 2 ;
				background-color: transparent;
				}
				/* Hide collections if empty */ 
				.CollectionPane:empty {
					display: none;
					}
		/*Main Pane */		
			.MainPane {
				display: grid;
				position: relative;
				grid-column: 1;
				grid-row: 1 / span 2 ;
				background-color: transparent;
				padding-right: 2em;
				background-color: white;
				z-index: 10;
				}
				/* Full width if no collection present */
				.CollectionPane:empty + .MainPane{
					grid-column: 1/3;
					}
					}

/* ADDITIONAL EMBEDED LEFT COLUMN */

@media (min-width: 1600px) {
	.MainPane {
		padding-top: 0;
	    grid-template-columns: 30% 68%;
	    grid-template-rows: auto minmax(max-content, max-content) ;
		column-gap: 2%;
		justify-content: start;
		align-content: start;
		}
		.MainPane nav { /* Logostic */
			grid-column-start: span 2;
			}
		.Flexible {
			grid-column: 2;
	        grid-row: 2  / span 2;
			align-self: start;
			}
		.ContactBar {
			grid-column: 1 ;
	        grid-row: 3 ;
			align-self: start;
			}
		.ShareBar {
			grid-column: 1 ;
	        grid-row: 2 ;
			}		
			}









/* ---------------- L O G I S T I C -------------- */ 

/* See object.logistic.css */



/* ---------------- F l e x i b l e -------------- */ 


	/* Tiltle % intro */
		
	.MainPane h2,
	.MainPane p.Intro {
		text-align: left;
		padding-left: 0;
		}
		
	

/* ---------------- C O N T A C T   B A R ------------- */ 

/* See template.css */



/* ---------------- S H A R E   B A R ------------- */ 

/* See object.sharebar.css




/* ....... C O L L E C T I O N   ....... */	

	/* Col Title */
	.EventPage .CollectionPane:not(:empty)::before {
		display: block;
		position: relative;
		width: 100%;
		text-align: center;
		padding-top: 2em;
		padding-bottom: 2em;
		color: black;
		text-transform: uppercase;
		content: "Dans le cadre de";
		}
		.EventPage.EN .CollectionPane:not(:empty)::before {
			content: "Part of";
			}
	
	
	/* Drop Shadow*/	
	.EventPage .CollectionPane::after {
		content: "";
		position: absolute;
		display: block;
		left: -.5em;
		top: 0%;
		margin-top: 1em;
		width: 1em;
		height: calc(100% - 2em);
		filter: blur(10px);
		background-color: black;
		opacity: .1;
		}
		





/* ----------------------------------------------------- */
/* ------------------  S P O N S O R S ---------------- */
/* ----------------------------------------------------- */


.CollectionPage .Band:nth-of-type(3).FooterSponsor,
.EventPage .Band:nth-of-type(3).FooterSponsor {
	background-color: #efefef;
	}










/* ----------------------------------------------------- */
/* ---------------- O T H E R   P A G E S -------------- */
/* ----------------------------------------------------- */



/* -------------  Collection Page -----------*/ 



/*.CollectionPage .EventLayout */

.CollectionPage .Band:nth-of-type(2) {
	background-color: #efefef; /* Theme 10% */
	background: radial-gradient(#efefef, #c1c1bf); /* Theme 10% - 40% */
	}
		
	.CollectionPage .CollectionPane,
	.CollectionPage .MainPane {
		background-color: transparent;
		}
	
	.CollectionPage .CollectionPane h2 {
		text-align: center;
		font-size: 2.15em;
		}

	/* Page Lable */	
		.CollectionPage .TemplateHead::after {
			content: "Collection";
			display: block;
			position: absolute;
			width: 100%;
			bottom: 0;
			height: 2em;
			font-size: .8em;
			margin-top: -3em;
			line-height: 1em;
			padding-top: 1em;
			left: 0;
			background-color: blue;
			text-align: center;
			color: white;
			background-color: #64635e;
			opacity: .51;
			letter-spacing: 1.5em;
			text-transform: uppercase;
			}
		



/* -------------  News/Press releases -----------*/ 


body[class*='Release'] .EventLayout {
	padding-top: 3em;
	}


/* -------------  Press release Exception -----------*/ 


.PressRelease .MainPane > div.Flexible p:last-of-type::after {
	content: "- 30 -";
	display: block;
	padding-top: 3em;
	padding-bottom: 3em;
	text-align: center;
	}





/* ----------------  Monthly / Calendar Pages  -------------- */ 

.CalendarPage .Band:nth-of-type(3),
.MonthlyPage .Band:nth-of-type(3) {
	background-color: white;
	}
	
	/* Main pane is not a Grid on this page */
	.MonthlyPage .MainPane {
		display: block;
		}
	
	
.MonthlyPage .TemplateHead {
	margin-bottom: 3em;
	}

	/* Previous Month */
	
	.MonthlyPage	 .MainPane > a {
		position: relative;
		margin-left: 1.5em;
		}
		
	.MonthlyPage	 .MainPane > a:first-child::before {
		content: "";
		position: absolute;
		display: block;
		left: 0;
		top: -.15em;
		border: .4em solid transparent;
		border-bottom: .7em solid #b1b1ae; /* Theme 50% */
		}
		.MonthlyPage	 .MainPane > a:hover:first-child::before {
			border-bottom: .7em solid #d43287; /* Hot Pink */
			}
		
	.MonthlyPage	 .MainPane > a:first-child::after {
		padding-left: 1.25em;
		content: "Voir le mois précédent";
		}
		.EN.MonthlyPage	 .MainPane > a:first-child::after {
			content: "View previous month";
			}