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


/* ......... L I S T I N G ..............*/

[class*='Footer'] ul {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding-left: 0;
	list-style: none;
	}
	
[class*='Footer'] li {
	display: block;
	position: relative;
	}



/* ......... C O N T A C T ...............*/

	/*... Tile ... */
	
	.FooterContact .ContentWidth { 
		padding-top: 0;
		padding-bottom: 0;
		}
	.FooterContact {
		position: relative;
		padding-top: 10em;
		padding-bottom: 5em;
		background-image: radial-gradient(circle, #d61879 0%, #7e1552 100%); /* pink */
		}
		/* .PopContact */
		@media (max-height:1024px) , (max-width:799px){
			.PopContact .FooterContact {
				padding-top: 1em;
				padding-bottom: 0.5em;
				}
				}		
		
		/*AFY Logo*/
		.FooterContact::after {
			content: "";
			display: block;
			position: absolute;
			top: .4rem;
			left: 0;
			background-image: url(https://assets.afy.ca/_skin/logos/logo_afy_vertical.svg);
			background-repeat: no-repeat;
			background-size: 9.5rem;
			background-position-x: center;
			filter: brightness(0) saturate(0%) invert(1);
			width: 100%; /* same as ::before size */
			height: 8rem;
			}	
			/* .PopContact */
			@media (max-height:1024px) , (max-width:799px){
					.PopContact .FooterContact::after {
						background-size: 8rem;
						width: 7.5em; /* same as ::before size */
						height: 6rem;
						background-position-y: -1em;
						}
						}



	
	/* ... Groups ... */
	.FooterContact ul {
		justify-content: center;
		text-align: center;
		max-width: 50em;
		margin-left: auto;
		margin-right: auto;
		}
		/* .PopContact */
		@media (max-height:1024px) , (max-width:799px){
			.PopContact .FooterContact ul {
				justify-content: flex-start;
				text-align: left;
				max-width: none;
				}	
				}
		
	/* ... Items ... */	
	.FooterContact .AFY li {
		margin-bottom: 1.5em;
		min-width: 6.25em;
		width: 33.3%;
		font-size: 1.05em;
		}
	
		@media (min-width: 640px) {
			.FooterContact .AFY li {
				width: 20%;
				}
				}
			
		@media (min-width: 720px) {
			.FooterContact .AFY li {
				width: 20%;
				}
				}
				
			/* Pop Contact */
			@media (max-height:1024px) , (max-width:799px){
					.PopContact .FooterContact .AFY li {
						width: 100%;
						margin-bottom: 0.25em;
						margin-left: 8em; /* Room for Logo */
						margin-right: 1em ;
						font-size: 1em;
						}
					.PopContact .FooterContact .AFY li.Fax,
					.PopContact .FooterContact .AFY li.Location {
						display: none;
						}
						}
			@media (min-width:1200px) and (max-height:1024px) , (min-width:1200px) and (max-width:799px){
					.PopContact .FooterContact .AFY li.Fax,
					.PopContact .FooterContact .AFY li.Location {
						display: block;
						}
					.PopContact .FooterContact .AFY li.Phone,
					.PopContact .FooterContact .AFY li.Mail {
						width: 15em;
						}
					.PopContact .FooterContact .AFY li.Fax,
					.PopContact .FooterContact .AFY li.Hours {
						margin-left: 0;
						width: 50%;
						}					
					.PopContact .FooterContact .AFY li.Location {
						order: 5;
						width: 100%;
						}
						}	
	
	/*urls */
	
	.FooterContact * {
		color: white;
		}
	.FooterContact a {
		display: block;
		}
	.FooterContact a:hover {
		opacity: 0.5;
		color: white;
		text-decoration: none;
		}

		/* icons */
		.FooterContact .AFY li a,
		.FooterContact .AFY li.Fax,
		.FooterContact .AFY li.Hours {
			padding: 0.25em;
			padding-top: 2.5rem; /* room for icons */
			}
			/* Pop Contact */
		@media (max-height:1024px) , (max-width:799px){
				.PopContact .FooterContact .AFY li a,
				.PopContact .FooterContact .AFY li.Fax,
				.PopContact .FooterContact .AFY li.Hours {
					padding: 0.35em;
					padding-left: 2.1em; /* room for icons */
					}
					}
					
		.FooterContact li::before,
		.FooterContact li a::before { 
			content: "";
			position: absolute;
			display: block;
			top: 0;
			left: 50%;
			filter: brightness(10);
			background-repeat: no-repeat;
			}
			/* Pop Contact */
		@media (max-height:1024px) , (max-width:799px){
				.PopContact .FooterContact li::before,
				.PopContact .FooterContact li a::before { 
					top: 0.5em;
					left: 1.5em;
					filter: brightness(10);
					background-repeat: no-repeat;
					}			
					}
					
		/*Icon Size*/	
		.FooterContact .AFY li::before,
		.FooterContact .AFY li a::before {
			margin-left: -1rem;
			width: 2rem;
			height: 2rem;
			}
			/* Pop Contact */
			@media (max-height:1024px) , (max-width:799px){
					.PopContact .FooterContact .AFY li::before,
					.PopContact .FooterContact .AFY li a::before {
						margin-left: -1.25rem;
						width: 1.25rem;
						height: 1.25rem;
						top: 0.35em;
						}
						}
					
		/* Icon Face */		
		.FooterContact .AFY li.Phone a::before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_phone.svg);
			}
		.FooterContact .AFY li.Fax:before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_fax.svg);
			}
		.FooterContact .AFY li.Mail a::before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_mail.svg);
			}
		.FooterContact .AFY li.Location a::before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_location.svg);
			}
		.FooterContact .AFY li.Hours::before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_time.svg);
			}
		.FooterContact .AFY li.Web::before {
			background-image: url(https://assets.afy.ca/_skin/contacts/contact_web.svg);
			}	
			
				

		/*Sub text*/
		.FooterContact .AFY span {
			display: block;
			width: 100%;
			font-size: .8em;
			line-height: 1.25em;
			}
		.FooterContact .AFY span:first-child {
			margin-top: .5em;
			}
			/* Pop Contact */
			@media (max-height:1024px) , (max-width:799px){
					.PopContact .FooterContact .AFY span {
						display: inline;
						font-size: 1em;
						margin-top: 0;
						white-space: nowrap;
						}
						}
			@media (min-width:1200px) and (max-height:1024px) , (min-width:1200px) and (max-width:799px){
					.PopContact .FooterContact .AFY span:before {
						content: ", ";
						}
					}

/* ... Social ... */

	/* Group */
	.FooterContact .Social {
		margin-top:  1.5rem;
		justify-content: center;
		}
		/* Pop Contact */
		@media (max-height:1024px) , (max-width:799px){
			.PopContact .FooterContact .Social {
				justify-content: center;
				margin-top:  0.5rem;
				padding-top: 0.5rem;
				border-top: 1px solid rgba(255,255,255,.5);
				margin-left: 2em;
				margin-right: 2em;
				}
				}
		@media (min-width:480px) and (max-height:1024px) , (min-width:480px) and (max-width:799px){
			.PopContact .FooterContact .Social {
				justify-content: flex-start;
				padding-left: 5em;
				}
				}
	
	/* Items */	
	.FooterContact .Social li {
		margin: .25em;
		}
	.FooterContact .Social li a {
		width: 1.15rem;
		height: 1.15rem;
		}
	
	/* Icons */
	.FooterContact .Social li a::before {
		margin-left: -.75rem;
		width: 100%;
		height: 100%;
		}
		.FooterContact li.LinkedIn a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_linkedin.svg);
			}	
		.FooterContact li.SoundCloud a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_soundcloud.svg);
			}	
		.FooterContact li.YouTube a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_youtube.svg);
			}	
		.FooterContact li.Facebook a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_facebook.svg);
			}	
		.FooterContact li.Twitter a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_twitter.svg);
			}	
		.FooterContact li.Vimeo a::before {
			background-image: url(https://assets.afy.ca/_skin/social/social_vimeo.svg);
			}	
			









/* .........A L S O  ...............*/


.Band.FooterAlso {
	background-color: #efefef;
	}

.FooterAlso .ContentWidth {
	display: flex;
	flex-wrap: wrap;
	}

 /* Groups */

	.FooterAlso ul {
		display: block;
		padding-top: 3.5em;
		}
		@media (max-width:480px) {
			.FooterAlso ul:nth-of-type(2) {
				margin-top: 3rem;
				}
				}
		
		
		
		
		

	/* Micro sites & Portal */

	.FooterAlso ul.MicroSite,
	.FooterAlso ul.Portal  {
		width: 100%;
	    column-count: 1;	
	    column-gap: .75rem;
		}
	
		@media (min-width:480px) {
			.FooterAlso ul.MicroSite,
			.FooterAlso ul.Portal  {
				width: 50%;
				}
				}
		@media (min-width:800px) {
			.FooterAlso ul.MicroSite,
			.FooterAlso ul.Portal  {
			    column-count: 2;	
				}
				}
		@media (min-width:1200px) {
			.FooterAlso ul.MicroSite,
			.FooterAlso ul.Portal  {
			    column-count: 3;	
				}
				}
		@media (min-width:1800px) {
			.FooterAlso ul.MicroSite,
			.FooterAlso ul.Portal  {
			    column-count: 4;	
				}
				}




	/* Divider */ 
		
		/*Horisontal*/
		@media (max-width:480px) {
			.FooterAlso ul:nth-of-type(n+2) {
				border-top: 1px solid #b1b1ae; /* Neutral 50% */
				padding-top: 5em;
				}
			.FooterAlso ul:nth-of-type(n+2) li:first-child {
				top:  3em;
				}
				}
				
		/*Vertical*/
		@media (min-width:480px) {
			.FooterAlso ul:nth-of-type(2) {
				padding-left: 1.5rem;
				border-left: 1px solid #b1b1ae; /* Neutral 50% */
				}	
			.FooterAlso ul:first-child {
				padding-right: 1.5rem;
				}
				}	
			
			
		
	
	
/*Title*/	
	.FooterAlso li:first-child{
		position:  absolute;
		height: 1em;
		top: 0;
		}
	
	

/* Items */	
	.FooterAlso ul li {
		display: flex;
		min-height: 1em;
		margin-bottom: 0;
		padding-bottom: .9em;
		padding-top: 0.25em;
		padding-left: 1.5em; /* Room for icon */
		font-size: 0.9em;
		}
		@media (min-width:480px) {
			.FooterAlso ul li {
				font-size: 0.85em;
				}
				}
				
	
	
	/* links */		
	.FooterAlso ul li a{
		color: #64635e; /* Neutral */
		line-height: 1.4em;
		text-decoration: none;
		padding-left: 0rem; /* room for icon */
		height: 2.5em;
		break-inside: avoid-column;
		column-break-inside:avoid;
		overflow: hidden; /* fix for Firefox */
		}

		
		.FooterAlso ul li a:visited{
			color: #a2a19e; /* neutral 60% */
			}
		.FooterAlso ul li a:hover{
			color: #d43287; /* hot pink */
			}
				
		/*Icons */
		.FooterAlso ul li a::before {
				content: "";
				display: block;
				position: absolute;
				top: .25rem;
				left: 0;
				width: .75rem;
				height: .75rem;
				background-repeat: no-repeat;
				filter: brightness(1); /* neutreal */
				}
			/* micro sites */	
				.FooterAlso ul.MicroSite	 li a:hover::before{
				background-image: url(https://assets.afy.ca/_skin/link/link_external.svg);
				}
	
			/* Portal */
			.FooterAlso ul.Portal li a:hover::before{
				background-image: url(https://assets.afy.ca/_skin/link/link_portal.svg);
				}
				
		.FooterAlso ul li a:visited::before {
			filter: brightness(0.1); /* hot pink */
			border: 1px solid #333;
			}
				
		.FooterAlso ul li a:hover::before {
			filter: brightness(0.55) saturate(150) hue-rotate(255deg); /* hot pink */
			}		
		
	
/* VIP : FUTUR IMPLEMENTATION */	
	
.FooterAlso ul.VIP {
	margin-top: 2em;
	width: 100%;
	}
	
	/* Icon */
	.FooterAlso ul.VIP li:first-child {
		display: none;
		}
	.FooterAlso ul.VIP::before {
		content: "";
		display: block;
		position: absolute;
		top: 3em;
		left: 1em;
		height: 1.5em;
		width: 1.5em;
		background-image: url(https://assets.afy.ca/_skin/vip/vip.svg);
		background-size: 100%;
		}
		@media (min-width:480px) {
			.FooterAlso ul.VIP::before {
				top: 0.5em;
				}
				}	

	/* Login Icon*/
	.FooterAlso ul.VIP li {
		padding-top: 0.1rem;
		}
	.FooterAlso ul.VIP li a::before{
		background-image: url(https://assets.afy.ca/_skin/vip/vip_login.svg);
		}
			









	
	

/* ......... S P O N S O R ...............*/

	/*Band*/
	.Band.FooterSponsor {
		background-color: white;
		}
	
	.Band.FooterSponsor .ContentWidth {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		}
		
	
	/* Top Note*/		
	.FooterSponsor p {
		display: block;
		width: 100%;
		text-align: center;
		margin-bottom: 4rem;
		}
		


	/*Group of sponsors */
	.FooterSponsor ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		padding-top: 2.5rem;
		margin-bottom: 3rem;
		width: 100%;
		}

		@media (min-width:1024px) {
			.FooterSponsor ul {
				width: 50%;
				margin-bottom: 5em;
				}
				}
		@media (min-width:1600px) {
			.FooterSponsor ul {
				width: 33%;
				}
				}		
		@media (min-width:2000px) {
			.FooterSponsor ul {
				width: 25%;
				}
				}			
		
	/* Group Dividers*/

		/*horisontal*/

		@media (max-width:1023px) {
		.FooterSponsor ul:nth-child(n+3) {
			border-top: 1px solid #e0e0df; /* Neutral 20% */
			}
			}

		/* Vertical*/
		
			/*divider for every groups*/
			@media (min-width:1024px) {
				.FooterSponsor ul:nth-child(n+3) {
					border-left: 1px solid #e0e0df; /* Neutral 20% */
					}
					}
					
			/*remove left divider*/
			/* 2 cols */
			@media (min-width:1024px) and (max-width:1599px) {
				.FooterSponsor ul:nth-child(2n+2) {
					border-left: none; 
					}
					}
			/* 3 cols */		
			@media (min-width:1600px) and (max-width:1999px) {
				.FooterSponsor ul:nth-child(3n+2) {
					border-left: none; 
					}
					}
			/* 4 cols */		
			@media (min-width:2000px) {
				.FooterSponsor ul:nth-child(4n+2) {
					border-left: none; 
					}
					}


	/*Group Title*/
	.FooterSponsor ul li:first-child {
		position: absolute;	
		top: 1rem;
		left: 0;
		width: 100%;
		}
	.FooterSponsor h3 {
		font-family: book;
		letter-spacing: normal;
		font-size: .75em;
		line-height: 1.25em;
		text-align: center;
		color: #64635e; /* Neutral */
		}	
		

	/*Logos*/
	.FooterSponsor ul li span 	{ 
		display: block;
		height: 8em;
		width: 8em;
		filter: brightness(0); /* black */
		}
		.FooterSponsor ul li a:hover > span {
			filter: brightness(.55) saturate(150) hue-rotate(255deg); /* hot pink */
			}

	/*Gutter*/
	.FooterSponsor ul li:nth-child(n+2) {
		margin-left:  .5em;
		margin-right:  .5em;
		}










/* ......... C R E D I T ...............*/

.Band.FooterCredit {
	background-color: white;
	}
	
.FooterCredit .ContentWidth {
	padding-top: 0;
	}
		
.FooterCredit ul {
	justify-content: center;
	font-size: .8em;
	}	

.FooterCredit ul li:last-child {
	margin-left:  1.5em;
	border-left: 1px solid #64635e; /* Neutral */
	padding-left: 1.5em;
	}

	

	
	
	







