/*####################################################################*/
/*####################################################################*/
/*######						          					 #########*/
/*######   ONTARIO PHYSIOTHERAPY ASSOCIATION - SITE STYLES	 #########*/
/*######						          					 #########*/
/*####################################################################*/
/*####################################################################*/
:root {
  &.remove_scroll_smooth{
	  scroll-behavior:unset;
  }
}

/*#####################*/
/*### A. GENERAL ###*/
/*#####################*/
@font-face {
	font-family: Zain;
	src: url('../FONTS/Zain-Regular-BF66ac52d73eb10.ttf');
}

@font-face {
	font-family: ZainBold;
	src: url('../FONTS/Zain-Bold-BF66ac52d79a893.ttf');
}


/*# FONTS #*/
$Font-Lato: "Lato", serif;
$Font-Zain: Zain, sans-serif;
$Font-ZainBold: ZainBold, sans-serif;
$Font-MaterialSymbols: "Material Symbols Outlined";
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}

/*# FONT SIZES #*/
$FontSize-Body: 18px;
$FontSize-BodyMobile: 16px;

$FontSize-BodySmall: 16px;
$FontSize-BodySmallMobile: 14px;

/*# LINE HEIGHTS #*/
$LineHeight-Body:32px;
$LineHeight-BodyMobile:30px;

$LineHeight-BodySmall:24px;
$LineHeight-BodySmallMobile:22px;


/*# COLOURS #*/
$Color-White:#FFFFFF;
$Color-DarkGrey:#8898A9;
$Color-Grey:#C0CAD2;
$Color-LightGrey:#EFEFEF;
$Color-LightGreySecondary:#DBE0E4;
$Color-LighterGrey:#F8F8F8;
$Color-Black:#000;
$Color-BodyText:#082947; //#2E4A5E ???

$Color-SilverBlue:#5A6273;
$Color-LightGreyBlue:#F2F8FD;
$Color-LighterGreyBlue:#EFFCFC;
$Color-LightBlue:#59C6D1;
$Color-Blue:#1E68A5;
$Color-BlueSecondary:#194973;
$Color-DarkBlue:#082947;
$Color-FaintDarkBlue:#044A75;

$Color-Teal:#48BD9E;
$Color-Yellow:#FCC31C;
$Color-LightYellow:#FFFBEB;


/*# UNDERLINES / HIGHLIGHTS #*/
@mixin yellow_underline{
	transition:box-shadow 0.25s ease-in-out;
	box-shadow: inset -400px -1em $Color-LighterGrey,inset 0px -0.6em $Color-Yellow;
}

@mixin yellow_underline_hover{
	box-shadow: inset 0px -0.28em $Color-LighterGrey,inset 0px -0.6em $Color-Yellow;
}


/*# PADDING #*/
$bootstrap_padding:calc(var(--bs-gutter-x) * .5);
$bootstrap_fixed_padding:13.5px;
$site_fixed_padding:16px;

/*# BREAKPOINTS #*/
$Breakpoint-WideBodyWidth:1595px;
$Breakpoint-StandardBodyWidth:1440px;
$Breakpoint-MobileNavigation:1070px;
$Breakpoint-StandardArticle:calc(1013px + $bootstrap_fixed_padding + $bootstrap_fixed_padding);
$Breakpoint-1024:1024px;
$Breakpoint-950:950px;
$Breakpoint-900:900px;
$Breakpoint-Mobile:825px;
$Breakpoint-800:800px;
$Breakpoint-600:600px;

/*BACKGROUND COLOURS*/
.bg_darkblue{
	background-color:$Color-DarkBlue;
}
.bg_yellow{
	background-color:$Color-Yellow;
}

/*# SHADOWS #*/
$boxshadow-megamenu:0px 25px 50px -30px rgba(8,41,71,.12);
.no_side_padding{
	padding-left:0;
	padding-right:0;
}

/*# MARGINS #*/
$bootstrap_margins:calc(-.5 * var(--bs-gutter-x));

/*# Ad. CONTAINER MAX WIDTHS #*/
.wide_body_width{
	max-width:$Breakpoint-WideBodyWidth;
}

.standard_body_width{
	max-width:$Breakpoint-StandardBodyWidth;
}

.standard_article_width{
	max-width:$Breakpoint-StandardArticle;
}

.max_width_1024px{
	max-width:$Breakpoint-1024;
}

.max_width_800px{
	max-width:$Breakpoint-800;
}

/*# Ae. HEADINGS #*/
h1{
	font-size:72px;
	font-family:$Font-ZainBold;
	line-height:72px;
	color:$Color-DarkBlue;
	font-weight: normal;
	margin-bottom: 40px;
	@media(max-width:$Breakpoint-StandardBodyWidth){
		font-size:68px;
		line-height:68px;
	}

	@media(max-width:$Breakpoint-MobileNavigation){
		font-size:58px;
		line-height:58px;
		margin-bottom:16px;
	}

	@media(max-width:$Breakpoint-Mobile){
		font-size:48px;
		line-height:48px;
	}
}

h2{
	font-size:48px;
	font-family:$Font-ZainBold;
	line-height:48px;
	color:$Color-DarkBlue;
	font-weight: normal;
	margin-bottom: 24px;
	@media(max-width:$Breakpoint-StandardBodyWidth){
		font-size:46px;
		line-height:46px;
	}

	@media(max-width:$Breakpoint-MobileNavigation){
		font-size:42px;
		line-height:42px;
		margin-bottom:16px;
	}

	@media(max-width:$Breakpoint-Mobile){
		font-size:40px;
		line-height:40px;
	}
}

h3{
	font-size:32px;
	font-family:$Font-ZainBold;
	line-height:32px;
	color:$Color-DarkBlue;
	font-weight: normal;
	margin-bottom: 24px;
	@media(max-width:$Breakpoint-StandardBodyWidth){
		font-size:30px;
		line-height:30px;
	}

	@media(max-width:$Breakpoint-MobileNavigation){
		font-size:28px;
		line-height:28px;
		margin-bottom:16px;
	}
}

h4{
	font-size:28px;
	font-family:$Font-ZainBold;
	line-height:28px;
	color:$Color-DarkBlue;
	font-weight: normal;
	margin-bottom: 24px;
	@media(max-width:$Breakpoint-MobileNavigation){
		margin-bottom:16px;
	}
}

h5{
	font-size:20px;
	font-family:$Font-ZainBold;
	line-height:28px;
	color:$Color-DarkBlue;
	font-weight: normal;
	margin-bottom: 10px;
}



/*# Af. BODY TEXT #*/
body, html{
	font-size:$FontSize-Body;
	line-height:$LineHeight-Body;
	font-weight:normal;
	color:$Color-BodyText;
	font-family:$Font-Lato;

	&.no_scrollbar_mobile{
		@media(max-width:$Breakpoint-MobileNavigation){
			overflow:hidden;
		}
	}

	@media(max-width:$Breakpoint-MobileNavigation)
	{
		font-size:$FontSize-BodyMobile;
		line-height:$LineHeight-BodyMobile;
	}
}

body{
	padding-top:130px;
	@media(max-width:$Breakpoint-MobileNavigation){
		padding-top:58px;
	}
}

ul{
	padding-left:24px;
	margin-bottom: 24px;
	li{
		list-style: disc;
		margin-bottom: 10px;
		&:last-child{
			margin:0;
		}
	}
}

/*# Ag. TEXT LINKS #*/
a{
	font-size:$FontSize-Body;
	line-height:$LineHeight-Body;
	font-weight:normal;
	font-family:$Font-Lato;
	color:$Color-BodyText;
	text-decoration: underline;
	&:hover{
		text-decoration: none;
		color:$Color-BodyText;
	}
}

.solid_round_button{
	font-size:$FontSize-Body;
	font-size:16px;
	line-height:22px;
	padding:10px 16px;
	border:0;
	background:none;
	background-color: $Color-Yellow;
	color:$Color-BodyText;
	border-radius: 999px;
	border:2px solid $Color-Yellow;
	text-decoration: none;
	text-align: center;
	display: inline-block;
	font-weight: 700;
    transition: all .25s ease-in-out;

	&:hover{
		background-color:$Color-White;
		border-color:$Color-DarkBlue;
		color:$Color-DarkBlue;
	}

	&.with_icon{
		position:relative;
		padding-right:45px;
		.material-symbols-outlined{
			position:absolute;
			top:10px;
			right:16px;
			font-size:22px;
		}
	}


	&.darkblue-white_bg_white-blue_txt_white-white_border{
		background-color: $Color-DarkBlue;
		border-color: $Color-White;
		color:$Color-White;
		&:hover{
			background-color:$Color-White;
			color:$Color-BodyText;
		}
	}

	&.white-darkblue_bg_darkblue-white_txt_white-white_border{
		background-color:$Color-White;
		color:$Color-DarkBlue;
		border-color: $Color-White;
		&:hover{
			background-color: $Color-DarkBlue;
			color:$Color-White;
		}
	}

	&.white-darkblue_bg_darkblue-white_txt_darkblue-darkblue_border{
		background-color:$Color-White;
		color:$Color-DarkBlue;
		border-color: $Color-DarkBlue;
		&:hover{
			background-color: $Color-DarkBlue;
			color:$Color-White;
		}
	}

	&.white-transparent_bg_darkblue-darkblue_txt_white-darkblue_border{
		background-color:$Color-White;
		color:$Color-DarkBlue;
		border-color: $Color-White;
		&:hover{
			background-color: transparent;
			border-color: $Color-DarkBlue;
		}
	}
}


/*#####################*/
/*### B. HEADER ###*/
/*#####################*/
.header_container{
	position:fixed;
	top:0;
	left:0;
	padding:0;
	z-index:500;
	transition: all .25s ease-in-out;

	.top_header_container{
		padding-top:5px;
		padding-bottom:5px;
		transition: all .25s ease-in-out;
		padding-left:$site_fixed_padding;
		padding-right:$site_fixed_padding;
		background-color:$Color-DarkBlue;
		@media (max-width:$Breakpoint-MobileNavigation){
			display:none;
		}

		.row{
			height:100%;
		}

		a:not(.solid_round_button){
			color:$Color-White;
			font-size:16px;
			line-height:26px;
			text-decoration: none;

			@media (max-width:1135px){
				font-size:15px;
				line-height:22px;
			}

			&:hover{
				text-decoration: underline;
			}
		}

		.solid_round_button{
			&:hover{
				background-color:transparent;
				border-color:$Color-Yellow;
				color:$Color-Yellow;
			}
		}

		.header_site_search_col{
			position:relative;
			flex: 0 0 50%;
			max-width: 50%;

			.header_site_search_link{
				float:right;
			}

			.header_site_search_input{
				width:0;
				display:inline-block;
				transition:all .25s ease-in-out;
				position:relative;
				overflow: hidden;
				position:absolute;
				right:0;
				top:-5px;
				height:32px;
				border-radius:999px;
				a.header_search_close{
					position:absolute;
					right:8px;
					top:5px;
					color:$Color-DarkBlue;
					> span{
						font-size:16px;
						font-weight:bold;
					}
				}

				a.header_search_submit_btn{
					position: absolute;
					left: 10px;
					top: 5px;
					max-width: 20px;
				}

				.form-control{
					height:100%;
					border-radius:0;
					padding:5px 12px;
					padding-left:40px;
					padding-right:40px;
					font-family:$Font-Lato;
					font-weight:500;
					color:$Color-DarkBlue;
					font-size:16px;
					line-height:24px;
					&::placeholder{
						color:$Color-SilverBlue;
						font-family:$Font-Lato;
						font-weight:500;
						font-size:16px;
						line-height:24px;
					}
				}

				&.show{
					width:100%;
				}
			}
		}
	}

	&.moveup, &.moveupcomplete{
		.top_header_container{
			margin-top:-60px;
		}
	}

	&.moveupcomplete{
		margin-top:-80px;
	}

	.main_navigation_container{
		padding-top:0;
		padding-bottom:0;
		background-color:$Color-White;
		border-bottom:1px solid $Color-LightGrey;
		padding-left:$site_fixed_padding;
		padding-right:$site_fixed_padding;
		height:75.5px;
		position:relative;

		@media (max-width:$Breakpoint-MobileNavigation)
		{
			padding:0;
			height:58px;
		}

		.main_navigation_inner_container{
			height:100%;
			> .row{
				height:100%;
			}

			@media (max-width:$Breakpoint-MobileNavigation)
			{
				.row{
					margin:0;
				}
			}
		}

		.logo{
			max-width:184px;
			padding-top: 16px;
			padding-bottom: 16px;
			position:relative;
			z-index:1;
			transition:all .25s ease-in;

			@media (max-width:1235px){
				padding-top: 8px;
    			padding-bottom: 8px;
			}

			@media (max-width:$Breakpoint-MobileNavigation)
			{
				padding-left:$site_fixed_padding;
				height:58px;
			}

			img{
				transition:all .25s ease-in;
				&:hover{
					transform:scale(1.05);
				}
			}

		}

		.mobile_nav_menu_btn{
			display:none;
			text-align: right;
        	position: relative;
			z-index:1;

			@media (max-width:$Breakpoint-MobileNavigation)
			{
				display:block;
				padding-right:$site_fixed_padding;
				height:58px;
			}

			.mobile_nav_menu_toggle{
				text-decoration: none;
				position:absolute;
				top:50%;
				transform: translateY(-50%);
				right:$bootstrap_padding;

				.material-symbols-outlined{
					display:inline-block;
					color:$Color-DarkBlue;
					font-size:30px;
				}

				&:hover{
					text-decoration: none;
					.material-symbols-outlined{
						color:$Color-DarkBlue;
					}
				}

				.hamburger{
					color:$Color-DarkBlue;
				}

				.close{
					display:none;
				}

				&.open{
					.hamburger{
						display:none;
					}
					.close{
						display:inline-block;
					}
				}

			}

		}

		.main_navigation{
			z-index:2;

			> .row{
				height:100%;
				margin-left:-12px;
				margin-right:-12px;

				@media (max-width:1235px){
					margin-left:-8px;
					margin-right:-8px;
				}

				> .col{
					padding-left:12px;
					padding-right:12px;

					@media (max-width:1235px){
						padding-left:8px;
						padding-right:8px;
					}

					&.mobile_site_search{
						display:none;
					}

					&.mobile_add_link{
						display:none;
					}

					> a:not(.solid_round_button){
						cursor: default;
						color:$Color-DarkBlue;
						text-decoration: none;
						font-size:16px;
						font-family: $Font-Lato;
						line-height:24px;
						padding-top: 20px;
						padding-bottom: 16px;
						padding-right:25px;
						height:100%;
						display:inline-block;
						vertical-align: middle;
						position:relative;
						transition: all .25s ease-in-out;

						@media (max-width:1235px){
							font-size:15px;
							line-height:22px;
							padding-right:16px;
						}

						&::before {
							display: block;
							content: attr(aria-label);
							font-weight: bold;
							height: 0;
							overflow: hidden;
							visibility: hidden;
						}

						.text{
							vertical-align: middle;
						}

						.material-symbols-outlined{
							color:$Color-DarkBlue;
							position:absolute;
							right:0;
							top:35px;
							transform: translateY(-50%) rotate(90deg);
    						font-size: 18px;
							transition: all .15s ease-in-out;

							@media (max-width:1235px){
								font-size: 16px;
								top:34px;
							}
						}


					}

					.megamenu_container{
						position:absolute;
						width:100%;
						background-color: $Color-White;
						box-shadow: $boxshadow-megamenu;
						border-bottom:1px solid $Color-LightGrey;
						top:-9999px;
						left:0;
						z-index:1000;
						opacity:0;
						transition: opacity .25s ease-in-out;
						padding:32px 50px;

						.mobile_megamenu_heading_container{
							display:none;
						}

						@media(max-width:1090px){
							padding:25px;
						}

						.megamenu_inner_container{

							> .row{
								margin-left:-12px;
								margin-right:-12px;
								> .col{
									padding-left:12px;
									padding-right:12px;
									max-width:334px;
								}
							}

							.menu_links_col{

								strong{
									text-transform: uppercase;
									color:$Color-DarkBlue;
									font-size:14px;
									line-height:20px;
									margin-bottom:10px;
									font-weight: 700;
									display:block;
								}

								ul{
									padding:0;
									margin:0;
									list-style: none;
									li{
										list-style: none;
										padding:0;
										margin:0;
										margin-bottom:10px;
										&:before{display:none;}
										&:last-child{
											margin:0;
										}
										a{
											color:$Color-SilverBlue;
											font-size:14px;
											line-height:20px;
											text-decoration: none;
											font-weight: 400;
											&:hover{
												text-decoration: underline;
											}
										}
									}
								}
							}

							.menu_featured_link_col{
								text-align: right;
								max-width:334px;
								.menu_featured_link{
									position:relative;
									width:100%;
									height:100%;
									display:inline-block;
									border-radius:16px;
									text-decoration: none;
									max-width:310px;
									text-align: left;
									.bgimage{
										position:absolute;
										top:0;
										left:0;
										width:100%;
										height:100%;
										z-index:1;
										border-radius:16px;
									}

									&:before{
										content:'';
										position:absolute;
										top:0;
										left:0;
										width:100%;
										height:100%;
										background: linear-gradient(0deg, rgba(0, 0, 0, 0.60) 0%, rgba(0, 0, 0, 0.60) 100%);
										z-index:2;
										transition: all .25s ease-in-out;
										border-radius:16px;
									}

									.text{
										width: 100%;
										z-index: 3;
										padding: 25px 20px;
										font-size:16px;
										line-height:28px;
										color: #fff;
										position: relative;
										height: 100%;
										display: flex;
										.inner_text{
											align-self: flex-end;

											p{
												font-size:16px;
												line-height:28px;
												color:$Color-White;
												margin:0;
												text-decoration: none;
											}

											h5{
												color:$Color-White;
												text-decoration: none;
											}
										}
									}
								}
							}

							&.three_col_links_megamenu{
								> .row{
									.col{
										flex: 0 0 22%;
										max-width:22%;

										&.menu_featured_link_col
										{
											flex: 0 0 34%;
											max-width:34%;
										}

										@media(max-width:1090px){
											&.menu_links_col
											{
												flex: 0 0 20%;
												max-width:20%;
											}

											&.menu_featured_link_col
											{
												flex: 0 0 40%;
												max-width:40%;
											}
										}
									}
								}
							}

							&.two_col_links_megamenu{
								> .row{
									.col{
										flex: 0 0 25%;
										max-width:25%;

										@media(max-width:1090px){
											&.menu_links_col
											{
												flex: 0 0 20%;
												max-width:20%;
											}

											&.menu_featured_link_col
											{
												flex: 0 0 30%;
												max-width:30%;
											}
										}
									}


								}
							}

							&.one_col_links_megamenu{
								> .row{
									.col{
										flex: 0 0 25%;
										max-width:25%;
										@media(max-width:1090px){
											&.menu_links_col
											{
												flex: 0 0 20%;
												max-width:20%;
											}

											&.menu_featured_link_col
											{
												flex: 0 0 30%;
												max-width:30%;
											}
										}
									}
								}
							}

						}

						&.three_col_links_megamenu{
							.megamenu_inner_container{
								> .row{
									.col:not(.menu_featured_link_col){
										max-width: calc((100% - 334px) / 3);
									}
								}
							}
						}
					}

					&:hover{

						> a{
							text-decoration: none;
							font-weight: 700;

							.material-symbols-outlined{
								transform: translateY(-50%) rotate(0deg);
							}
						}

						.megamenu_container{
							opacity:1;
							top:72px;
						}
					}
				}
			}

			/*Display mobile main navigation menu*/
			@media (max-width:$Breakpoint-MobileNavigation)
			{
				z-index:-1;
				flex:0 0 100%;
				height:0;
				overflow:hidden;
				transition: left .25s ease-in;
				left: -100vw;
				position: relative;

				&.open{
					background-color: $Color-LighterGrey;
					border-top:1px solid $Color-LightGrey;
					padding:16px;
					height:calc(100vh - 58.6px);
					max-width:100%;
					overflow:scroll;
					z-index:1;
					left:0vw;
					transition: left .25s ease-out;
				}

				> .row{
					margin:0;
					height:initial;

					> .col{
						padding:0;
						flex:0 0 100%;
						max-width:100%;

						&.mobile_site_search{
							display:block;

							.mobile_site_search_bar{
								display:inline-block;
								width:100%;
								position:relative;
								padding:0;
								margin-bottom: 10px;
								input{
									padding:10px 16px;
									padding-left:40px;
									display:inline-block;
									width:100%;
									background:none;
									background-color:$Color-White;
									border:0;
									border-radius:4px;
									height:40px;
									box-shadow: unset !important;
									outline: unset !important;
									font-size:14px;
									line-height:25px;
									color:$Color-DarkBlue;
									&::placeholder{
										font-size:14px;
										line-height:25px;
									}
								}

								.mobile_site_search_btn{
									position:absolute;
									left:16px;
									top:50%;
									transform: translateY(-50%);
									max-width:18px;
								}
							}
						}

						> a:not(.solid_round_button){
							padding:15px 0;
							padding-right:30px;
							height:initial;
							width:100%;
							display:inline-block;
							border-top: 1px solid $Color-LightGrey;
							font-size:16px;
							line-height:24px;

							.material-symbols-outlined
							{
								transform:unset;
								top:50%;
								transform:translateY(-50%);
								right:0;
							}

							&:before{
								display:none;
							}
						}

						&.mobile_add_link{
							display:block;

							> a:not(.solid_round_button){
								border:0;
								color:$Color-SilverBlue;
								padding:15px 0;
								> span{
									color:$Color-SilverBlue;
								}
							}

							&.first{
								> a:not(.solid_round_button){
									border-top: 1px solid $Color-LightGrey;
									padding-top:20px;
								}
							}

							> .solid_round_button{
								padding:12px;
								font-size:14px;
								line-height:22px;
								margin:15px 0;
							}
						}

						.megamenu_container{
							top:0 !important;
							opacity: 1 !important;
							margin-left: -1500px;
							transition: all .45s ease-in-out;
							position:fixed;
							top:0;
							width:100%;
							height:100%;
							overflow-y:scroll;
							padding:0;

							&.open{
								margin-left:0;
							}

							.megamenu_inner_container{
								padding:0;
								.mobile_megamenu_heading_container{
									display:inline-block;
									width:100%;
									background-color:$Color-White;
									padding:10px 16px;
									height:58px;
									.row{
										margin-left:-$site_fixed_padding;
										margin-right:-$site_fixed_padding;
										.col{
											text-align: center;

											a{
												display:inline-block;
											}

											strong{
												font-size:18px;
												line-height:32px;
												display:inline-block;
											}

											&:first-child{
												max-width:100px;
												text-align: left;
												padding-left:$site_fixed_padding;
											}

											&:last-child{
												max-width:100px;
												text-align: right;
												padding-right:$site_fixed_padding;
											}

											.material-symbols-outlined{
												font-size: 30px;
											}

										}
									}
								}

								.menu_featured_link_col{
									text-align: left;
									.menu_featured_link{
										max-width:100%;
									}
								}

								> .row, &.one_col_links_megamenu > .row, &.two_col_links_megamenu > .row, &.three_col_links_megamenu > .row{
									padding:32px $site_fixed_padding;
									margin:0;
									background-color: $Color-LighterGrey;
									border-top:1px solid $Color-LightGrey;
									.col{
										flex:0 0 100% !important;
										max-width:100% !important;
										margin-bottom: 32px;
										padding:0;
									}
								}
							}
						}

						&:hover{
							> a{
								font-weight: normal;
							}
						}
					}
				}
			}

		}
	}
}



/*#####################*/
/*### C. BODY ###*/
/*#####################*/
.skiptocontent {
    position: absolute;
    left: -9999px;
    text-decoration: underline !important;
}

.spacer{
	display:inline-block;
	width:100%;
	height:80px;

	@media(max-width:$Breakpoint-Mobile){
		height:48px;
	}

	&.half{
		height:32px;
		@media(max-width:$Breakpoint-Mobile){
			height:24px;
		}
	}

}

.anchor{
	display: block;
    position: relative;
    top: -150px;
    visibility: hidden;
}

.back_to_top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    opacity: 0;
    z-index: 100;
    transition: all .25s ease-in-out;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    text-align: center;
    background-color: $Color-DarkBlue;
    text-decoration: none;
	overflow:hidden;
	border:1px solid $Color-White;

	> span{
		color:$Color-White;
		position:relative;
		z-index:2;
		font-size:30px;
		margin-top:5px;
	}

	&:before{
		content:'';
		width:0;
		height:100%;
		position:absolute;
		top:-20px;
		left:-20px;
		background-color: $Color-Yellow;
		transform: rotate(-45deg);
		transition: all .25s ease-in-out;
		z-index:1;
	}

	&:hover{
		> span{
			color:$Color-DarkBlue;
		}

		&:before{
			width:300%;
		}
	}

	&.show{
		opacity:1;
	}

}

.page_content_container{
	min-height: 800px;
}

.rounded_image{
	display:block;
	border-radius:16px;
	max-width:100%;
	margin-bottom: 24px;
}

.buttons{
	margin-top:24px;
	margin-bottom: 24px;

	> .col-auto{
		margin-bottom: 12px;
	}
}

.table-responsive{
	.table{
		border-collapse: separate;
		border-spacing: 0;


		thead{

			th{
				border-spacing: 0px;
				border: 1px solid $Color-DarkBlue;
				color:$Color-White;
				text-transform: uppercase;
				font-size:16px;
				line-height:22px;
				font-weight: 700;
				padding:8px 16px;
				background-color:$Color-DarkBlue;
				&:first-child{
					-webkit-border-top-left-radius: 16px;
					-moz-border-radius-topleft: 16px;
					border-top-left-radius: 16px;
				}
				&:last-child{
					-webkit-border-top-right-radius: 16px;
					-moz-border-radius-topright: 16px;
					border-top-right-radius: 16px;
				}
			}
		}

		tbody{

			>tr:nth-of-type(odd)>*
			{
				--bs-table-accent-bg:$Color-White;
				background-color:$Color-White;
			}
			>tr:nth-of-type(even)>*
			{
				background-color:$Color-LighterGrey;
			}

			> tr{


				> td{
					border-top:0;
					border-bottom:1px solid $Color-LightGrey;
					padding:24px 16px;
					color:$Color-SilverBlue;
					font-size:18px;
					line-height: 32px;
					&:first-child{
						border-left:1px solid $Color-LightGrey;
					}
					&:last-child{
						border-right:1px solid $Color-LightGrey;
					}
				}


				&:last-child{
					td:first-child{
						-webkit-border-bottom-left-radius: 16px;
							-moz-border-radius-bottomleft: 16px;
							border-bottom-left-radius: 16px;
					}
					td:last-child{
						-webkit-border-bottom-right-radius: 16px;
							-moz-border-radius-bottomright: 16px;
							border-bottom-right-radius: 16px;
					}
				}
			}
		}
	}
}

/*OVERRIDE AOS FADE ANIMATION ON CONTAINER FLUIDS*/
.disable_aos_fade_anim[data-aos^=fade]
{
	opacity:1;
}

/*GENERIC MODAL WINDOWS*/
.modal-backdrop{
	background: rgba(26, 27, 24, 0.40);
	backdrop-filter: blur(12px);
	&.show{
		opacity:1;
	}
}

.modal_window_container{

	@media(max-width:$Breakpoint-900){
		padding:16px !important;

	}

	@media(max-width:$Breakpoint-Mobile){
		padding:0 !important;
		background-color:$Color-White;
	}

	.modal_close_button{
		position:absolute;
		top:20px;
		right:20px;
		box-shadow: unset;
		background:none;
		width:initial;
		height:initial;
		color:$Color-DarkBlue;
		opacity:1;
		z-index:10;

		@media(max-width:$Breakpoint-900){
			top:16px;
			right:16px;
		}

		.material-symbols-outlined {
			color:$Color-DarkBlue;
			font-size:30px;
			font-variation-settings:
			'FILL' 1,
			'wght' 400,
			'GRAD' 0,
			'opsz' 24
		}
	}

	.modal-dialog{
		max-width:950px;

		@media(max-width:$Breakpoint-900){
			max-width:100%;
			margin:0;
		}

		.modal-content{
			position:relative;
			background-color:$Color-White;
			padding:48px 64px;
			border-radius:16px;
			border:0;

			@media(max-width:$Breakpoint-900){
				padding:32px 16px;
			}

			@media(max-width:$Breakpoint-Mobile){
				border-radius:0;
				height:100%;
			}

			.modal-body{
				padding:0;

				h2{
					margin-bottom: 12px;
					@media(max-width:$Breakpoint-Mobile){
						margin-bottom: 8px;
					}
				}

				/*Staff modal*/
				.staff_modal_title{
					display:inline-block;
					width:100%;
					font-size:20px;
					line-height:36px;
					color:$Color-DarkBlue;

					@media(max-width:$Breakpoint-900){
						font-size:$FontSize-Body;
						line-height:$LineHeight-Body;
					}

				}

				.staff_modal_details{
					display:inline-block;
					width:100%;
					padding-top:32px;
					color:$Color-DarkBlue;

					@media(max-width:$Breakpoint-900){
						padding-top:24px;
					}
				}
			}
		}
	}

}

/*# COMMON SECTION ELEMENTS #*/
.section_margin_bottom{
	margin-bottom: 80px;
	@media(max-width:$Breakpoint-Mobile){
		margin-bottom: 48px;
	}
}

.section_title_container{
	display:inline-block;
	width:100%;
	margin-bottom: 48px;

	@media(max-width:$Breakpoint-Mobile){
		margin-bottom:32px;
	}

	.section_title_inner_container{
		max-width:800px;

		.section_subtitle{
			display:inline-block;
			font-size:16px;
			color:$Color-DarkBlue;
			text-transform: uppercase;
			position:relative;
			padding-right:50px;
			margin-bottom: 12px;
			font-weight: 700;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
			}

			&:before{
				content:'';
				width:40px;
				height:4px;
				background-color:$Color-Teal;
				position:absolute;
				right:0;
				top:50%;
				transform: translateY(-50%);
			}

			&.yellow_line{
				&:before{
					background-color:$Color-Yellow;
				}
			}

			&.lightblue_line{
				&:before{
					background-color:$Color-LightBlue;
				}
			}
		}


		.section_text{
			display:inline-block;
			font-size:20px;
			line-height:28px;
			color:$Color-DarkBlue;
			position:relative;
			margin-top: 12px;
			font-weight: 400;

			@media(max-width:$Breakpoint-Mobile){
				font-size:18px;
				line-height:26px;
			}
		}

		h2{
			margin:0;
		}

	}


	&.with_carousel_buttons{

		.section_title_inner_container{
			max-width:100%;
			position:relative;
			padding-right:130px;

			@media (max-width:$Breakpoint-600)
			{
				padding-right:100px;
			}
		}

		.carousel_arrows{
			position:absolute;
			top:0;
			right:0;

			button{
				width:48px;
				height:48px;
				display:inline-block;
				border-radius:999px;
				border:1px solid $Color-DarkBlue;
				padding:0 8px;
				background:none;
				background-color:$Color-White;
				transition:all 0.25s ease-in-out;
				position:relative;

				@media (max-width:$Breakpoint-600)
				{
					width:36px;
					height:36px;
				}


				&:first-child{
					margin-right:16px;

					@media (max-width:$Breakpoint-600)
					{
						margin-right:12px;
					}
				}

				.text{
					text-indent: -9999px;
					font-size:0;
				}

				.material-symbols-outlined{
					font-size:40px;
					color:$Color-DarkBlue;
					font-weight: normal;
					line-height: 45px;
					letter-spacing: 2px;
					position:absolute;
					left:3px;
					top:2px;

					@media (max-width:$Breakpoint-600)
					{
						font-size: 30px;
						line-height: 35px;
						top: 1px;
						left: 2px;
					}


				}

				&:hover{
					background-color:$Color-DarkBlue;
					.material-symbols-outlined{
						color:$Color-White;
					}
				}
			}
		}
	}

}

.section_title_centered_container{
	text-align: center;
	margin-bottom:48px;
	font-size:20px;
	line-height:36px;
	padding:0;
	@media(max-width:$Breakpoint-Mobile)
	{
		margin-bottom:32px;
		font-size:18px;
		line-height:32px;
	}

	.subtitle{
		display:inline-block;
		width:100%;
		text-transform: uppercase;
		font-size:16px;
		line-height:20px;
		margin-bottom: 12px;
		font-weight: 700;
		text-align: center;
		@media(max-width:$Breakpoint-Mobile)
		{
			font-size:14px;
			line-height:17px;
		}
	}

	h2{
		margin-bottom: 12px;
	}

	.yellow_underline{
		display:inline-block;
		width:40px;
		height:4px;
		background-color:$Color-Yellow;
		border-radius:4px;
	}
}

.view_all_items{
	display:inline-block;
	width:100%;
	text-align: center;
}

.breadcrumbs_container{
	padding-top:15px;
	padding-bottom:15px;

	@media(max-width:$Breakpoint-Mobile){
		display:none;
	}


	.breadcrumbs_inner_container{
		ul{
			padding:0;
			margin:0;
			li{
				display:inline-block;
				list-style: none;
				position:relative;
				padding-right:25px;

				img{
					display:inline-block;
					max-width: 17px;
					margin-bottom: 3px;
				}

				&:after{
					content:'\e5cc';
					font-family: $Font-MaterialSymbols;
					color:$Color-SilverBlue;
					right:0;
					top:0;
					position:absolute;
					font-size: 24px;
					letter-spacing: -3px;
					line-height: 35px;
				}

				&:last-child{
					&:after{
						display:none;
					}
				}
				a, span{
					font-size:16px;
					line-height:24px;
					color:$Color-SilverBlue;
					text-decoration: none;
				}

				a:hover{
					text-decoration: underline;
				}
			}
		}
	}
}

.page_content_container {

	> .container-fluid{
		padding-left:$site_fixed_padding;
		padding-right:$site_fixed_padding;
		> .container{
			padding-left:0;
			padding-right:0;
		}
	}
}


/*# TEAL ROUNDED BORDER HOVER #*/
.hover_border_fg{
	height: 100%;
    width: 100%;
    position: absolute;
    top: -16px;
    right: -16px;
	z-index:1;
	> span:after{
		content:'';
		position: absolute;
		top:0;
		left: 50%;
		width: 0;
		height: 0;
		border: 0px solid $Color-Teal;
		border-left: none;
		border-bottom: none;
		-webkit-border-top-right-radius: 16px;
		-webkit-border-bottom-right-radius: 0;
		-moz-border-radius-topright: 16px;
		-moz-border-radius-bottomright: 0;
		border-top-right-radius: 16px;
		border-bottom-right-radius: 0;
		z-index: 100;
		transition: height 0.15s ease-out, width 0.15s ease-out 0.15s;
	}

	> span:before{
		content:'';
		position: absolute;
		top:0;
		right: 50%;
		width: 0;
		height: 0;
		z-index: 100;
		border:0px solid $Color-Teal;
		border-right: none;
		border-bottom: none;

		-webkit-border-top-left-radius: 64px;
		-webkit-border-bottom-left-radius: 0;
		-moz-border-radius-topleft: 64px;
		-moz-border-radius-bottomleft: 0;
		border-top-left-radius: 64px;
		border-bottom-left-radius: 0;

		transition: height 0.15s ease-out, width 0.15s ease-out 0.15s;
	}

	 > span > span:before{
		content:'';
		position: absolute;
		bottom:0;
		right: 50%;
		width: 0;
		height: 0;
		z-index: 100;
		border:4px solid $Color-Teal;
		border-right: none;
		border-top: none;


		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-bottom-left-radius: 16px;

		transition: height 0.15s ease-out, width 0.15s ease-out 0.15s;
	}

	> span > span:after{
		content:'';
		position: absolute;
		bottom:0;
		left: 50%;
		width: 0;
		height: 0;
		border: 4px solid $Color-Teal;
		border-left: none;
		border-top: none;
		-webkit-border-bottom-right-radius: 64px;
		-moz-border-radius-bottomright: 64px;
		border-bottom-right-radius: 64px;
		z-index: 100;
		transition: height 0.15s ease-out, width 0.15s ease-out 0.15s;
	}
}

.homepage_banner_image_container{
	.hover_border_fg
	{
		height: calc(100% - 32px);
		width: calc(100% - 16px);
		position: absolute;
		top: 0;
		right: 0;
	}
}

.image_leftright_cta_container {
	.hover_border_fg{
		width: calc(100% - 27px);
		top: -16px;
    	right: 0;
	}
}

.container-fluid.aos-animate, .homepage_banner_image_container.aos-animate{
	.hover_border_fg
	{
		> span:after{
			border-width: 4px;
			width:50%;
			height:25%;
			transition: width 0.15s ease-out, height 0.15s ease-out 0.15s;
		}

		 > span:before{
			border-width: 4px;
			width:50%;
			height:75%;
			transition: width 0.15s ease-out, height 0.15s ease-out 0.15s;
		}

		> span > span:after{
			width:50%;
			height:75%;
			transition: width 0.15s ease-out, height 0.15s ease-out 0.15s;
		}

		> span > span:before{
			width:50%;
			height:25%;
			transition: width 0.15s ease-out, height 0.15s ease-out 0.15s;
		}
	}
}


/*# PAGE BANNERS #*/
.page_banner_container{
	height:300px;
	-webkit-border-top-right-radius: 100px;
	-webkit-border-bottom-left-radius: 100px;
	-moz-border-radius-topright: 100px;
	-moz-border-radius-bottomleft: 100px;
	border-top-right-radius: 100px;
	border-bottom-left-radius: 100px;

	&.container-fluid{
		padding-left: 0;
		padding-right:0;
	}


	@media(max-width:$Breakpoint-Mobile){
		height:230px;
		min-height:230px;

		-webkit-border-top-right-radius: 40px;
		-webkit-border-bottom-left-radius: 40px;
		-moz-border-radius-topright: 40px;
		-moz-border-radius-bottomleft: 40px;
		border-top-right-radius: 40px;
		border-bottom-left-radius: 40px;
	}

	.page_banner_inner_container{
		height:100%;
		position:relative;
		display: flex;
		align-items: center;
		> h1{
			color:$Color-White;
		}
	}
}

.page_banner_w_image_container{
	-webkit-border-top-right-radius: 100px;
	-webkit-border-bottom-left-radius: 100px;
	-moz-border-radius-topright: 100px;
	-moz-border-radius-bottomleft: 100px;
	border-top-right-radius: 100px;
	border-bottom-left-radius: 100px;
	overflow:hidden;
	height:450px;

	&.container-fluid{
		padding-left: 0;
		padding-right:0;
	}

	@media(max-width:$Breakpoint-MobileNavigation)
	{
		height:initial;
		-webkit-border-top-right-radius: 40px;
		-webkit-border-bottom-left-radius: 40px;
		-moz-border-radius-topright: 40px;
		-moz-border-radius-bottomleft: 40px;
		border-top-right-radius: 40px;
		border-bottom-left-radius: 40px;
	}
	.row{
		height:100%;

		.col.banner_image_container{
			position:relative;
			height:100%;
			.banner_image{
				position:absolute;
				top:0;
				left:0;
				width:100%;
				height:100%;
			}

			@media(max-width:$Breakpoint-MobileNavigation)
			{
				flex:0 0 100%;
				max-width: 100%;
				height:210px;
			}
		}

		.col.banner_caption_container{
			height:100%;
			position:relative;
			display: flex;
			align-items: center;

			@media(max-width:$Breakpoint-MobileNavigation)
			{
				flex:0 0 100%;
				max-width: 100%;
				height:initial;
			}

			.banner_caption{
				max-width:720px;
				padding-left:64px;
				padding-right:64px;

				h1{
					color:$Color-White;
					margin-bottom:0;
				}

				p{
					color:$Color-White;
					font-size:20px;
					line-height:36px;
					margin-top:12px;
				}

				@media(max-width:$Breakpoint-MobileNavigation)
				{
					max-width:100%;
					padding:32px $site_fixed_padding;
				}
			}

		}
	}

}

/*# ANCHOR LINKS NAV #*/
.anchor_links_container_sticky{
	position:sticky;
	top: -1px;
	z-index:100;

	&.pinned{
		.anchor_links_container{
			background-color:$Color-LighterGrey;
			border-bottom:1px solid $Color-LightGrey;

			@media(max-width:$Breakpoint-MobileNavigation)
			{
				background:none;
				border:0;
			}

		}
	}
}

.anchor_links_container{
	position:relative;

	.anchor_links_inner_container
	{
		border-radius:8px;
		background-color: $Color-LighterGrey;
		padding:12px 24px;

		@media(max-width:$Breakpoint-MobileNavigation)
		{
			background:none;
			padding:0 $bootstrap_padding;
			border-radius: 0;
		}

		> .dropdown{
			display:inline-block;
			width:100%;
			position:relative;
			.dropdown-toggle{
				text-transform: uppercase;
				display:inline-block;
				background:none;
				border:0;
				padding:0;
				color:$Color-DarkBlue;
				font-size:$FontSize-BodySmall;
				line-height:$LineHeight-BodySmall;
				font-weight: 700;
				width:initial;
				margin-right:24px;
				height:initial;
				cursor:default;
				&:after{
					display:none;
				}

				@media(max-width:$Breakpoint-MobileNavigation)
				{
					cursor:pointer;
					margin:0;
					display:inline-block;
					width:100%;
					position:relative;
					font-size:$FontSize-BodySmallMobile;
					line-height:$LineHeight-BodySmallMobile;
					padding:8px 12px;
					padding-right:40px;
					height:48px;
					border-radius:4px;
					text-align: left;
					border-radius:8px;
					background-color: $Color-LighterGrey;
					padding:12px 24px;
					border: 1px solid $Color-LightGrey;
					&:focus, &:active, &:hover{
						box-shadow: none;
						color:$Color-DarkBlue;
					}

					&:after{
						content:'\e5cc';
						font-family: $Font-MaterialSymbols;
						color:$Color-DarkBlue;
						position:absolute;
						right:10px;
						top:3px;
						text-decoration: none;
						border:0;
						transform: rotate(90deg);
						font-size: 30px;
						line-height: 40px;
						transition: all 0.10s ease-in;
						display:block;
						font-weight: normal;
					}

					&.show{
						&:after{
							content:'\e5cc';
							transform: none;
						}
					}
				}
			}

			.dropdown-menu{
				z-index: 1000;
				display: inline-block;
				padding:0;
				margin:0;
				border:0;
				position:relative;
				top:initial !important;
				left:initial !important;
				width:initial !important;
				min-width: initial !important;
				z-index:1;
				background-color: $Color-LighterGrey;

				li{
					list-style: none;
					display:inline-block;
					margin-right:24px;
					padding:0;
					margin:0;
					width:initial;
					.dropdown-item{
						width:initial;
						display:inline-block;
						padding:0;
						margin:0;
						margin-right:24px;
						font-size:$FontSize-BodySmall;
						line-height:$LineHeight-BodySmall;

						@include yellow_underline;

						&.in_view{
							@include yellow_underline_hover;
						}

						&:hover{
							background:none;
							@include yellow_underline_hover;
						}
					}
				}

				@media(max-width:$Breakpoint-MobileNavigation){
					display: none;
					z-index: 1000;
					top:42px !important;
					left:0 !important;
					transform:none !important;
					width:100% !important;
					border-radius: 0;
					padding:0;
					margin:0;
					border-bottom: 1px solid $Color-LightGrey;
					&.show{
						display:block;
					}

					li{
						padding:0;
						margin:0;
						list-style: none;
						width:100%;
						.dropdown-item {
							display: block;
							width: 100%;
							clear: both;
							font-weight: 400;
							color:$Color-DarkBlue;
							text-align: inherit;
							text-decoration: none;
							white-space: nowrap;
							background-color: transparent;
							border: 0;
							padding: 12px 24px;

							text-decoration: none;
							box-shadow: none !important;

							&.in_view{
								text-decoration: underline;
								box-shadow: none !important;
							}

							&:hover{
								background-color:$Color-LightGrey;
								color:$Color-DarkBlue;
								text-decoration: underline;
								box-shadow: none !important;
							}
						}
					}
				}
			}
		}
	}
}

/*# CARDS AND TAGS #*/
.news_item_container{
	display:inline-block;
	width:100%;
	height:100%;

	.news_thumbnail{
		-webkit-border-top-left-radius: 16px;
		-webkit-border-top-right-radius: 16px;
		-moz-border-radius-topleft: 16px;
		-moz-border-radius-topright: 16px;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		display:block;
		width:100%;
		height:175px;
		@media(max-width:$Breakpoint-Mobile){
			height:194px;
		}
	}

	.news_details{
		display:inline-block;
		width:100%;
		-webkit-border-bottom-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-bottomright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-bottom-right-radius: 16px;
		border-bottom-left-radius: 16px;
		background-color:$Color-LighterGrey;
		padding:24px;
		padding-bottom:92px;
		position:relative;
		height:calc(100% - 175px);

		@media(max-width:$Breakpoint-Mobile){
			padding:16px;
			padding-bottom:92px;
			height:calc(100% - 194px);
		}

		&:after{
			content:'\e5c8';
			font-family: $Font-MaterialSymbols;
			width:48px;
			height:48px;
			border-radius:999px;
			background-color:$Color-LightGrey;
			color:$Color-DarkBlue;
			position:absolute;
			bottom:20px;
			right:24px;
			font-size: 32px;
			padding: 8px;
			line-height: 30px;
			transition:all .25s ease-in;
		}

		.news_title{
			display:inline-block;
			width:100%;
			margin-bottom: 16px;
			strong{
				font-size:28px;
				line-height:28px;
				font-family:$Font-ZainBold;
				font-weight: normal;
				display:block;
				background-size: 1px 1em;
				@include yellow_underline;
				display: inline;

				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}

	}

	&:hover{

		.news_details{
			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			.news_title{

				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover;
				}
			}

			.item_category{
				color:$Color-DarkBlue;
			}
		}
	}
}

.item_category{
	display:inline-block;
	border-radius:4px;
	background-color:$Color-LightGrey;
	padding: 5px 8px;
    padding-left: 38px;
    font-size: 16px;
    line-height: 22px;
	position:relative;

	@media(max-width:$Breakpoint-Mobile){
		font-size:14px;
		line-height:25px;
	}

	img{
		position:absolute;
		left:8px;
		top:5px;
		max-width: 24px;
		max-height: 24px;
	}
}

.event_item_container{
	display:inline-block;
	width:100%;
	height:100%;

	.thumbnail{
		-webkit-border-top-left-radius: 16px;
		-webkit-border-top-right-radius: 16px;
		-moz-border-radius-topleft: 16px;
		-moz-border-radius-topright: 16px;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		display:block;
		width:100%;
		height:175px;
		@media(max-width:$Breakpoint-Mobile){
			height:194px;
		}
	}

	.details{
		display:inline-block;
		width:100%;
		-webkit-border-bottom-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-bottomright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-bottom-right-radius: 16px;
		border-bottom-left-radius: 16px;
		background-color:$Color-LighterGrey;
		padding:24px;
		padding-bottom:92px;
		position:relative;
		height:calc(100% - 175px);

		@media(max-width:$Breakpoint-Mobile){
			padding:16px;
			padding-bottom:92px;
		}

		&:after{
			content:'\e5c8';
			font-family: $Font-MaterialSymbols;
			width:48px;
			height:48px;
			border-radius:999px;
			background-color:$Color-LightGrey;
			color:$Color-DarkBlue;
			position:absolute;
			bottom:20px;
			right:24px;
			font-size: 32px;
			padding: 8px;
			line-height: 30px;
			transition:all .25s ease-in;
		}

		.event_type{
			display:inline-block;
			border-radius:4px;
			background-color:$Color-LightGrey;
			padding:8px;
			font-size:16px;
			line-height:24px;
			position:relative;
			margin-bottom:16px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.event_date{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;
			margin-bottom: 16px;
			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.event_title{
			display:inline-block;
			width:100%;
			margin-bottom: 5px;
			strong{
				font-size:28px;
				line-height:28px;
				font-family:$Font-ZainBold;
				font-weight: normal;
				display:block;
				background-size: 1px 1em;

				@include yellow_underline;
				display: inline;

				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}

		.event_location{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;
			margin-bottom: 5px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.event_price{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}
	}

	&:hover{

		.details{

			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			> span{
				color:$Color-DarkBlue;
			}

			.event_title{
				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover;
				}
			}

		}
	}
}

.course_item_container{
	display:inline-block;
	width:100%;
	height:100%;

	.thumbnail{
		-webkit-border-top-left-radius: 16px;
		-webkit-border-top-right-radius: 16px;
		-moz-border-radius-topleft: 16px;
		-moz-border-radius-topright: 16px;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		display:block;
		width:100%;
		height:175px;

		@media(max-width:$Breakpoint-Mobile){
			height:194px;
		}
	}

	.details{
		display:inline-block;
		width:100%;
		-webkit-border-bottom-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-bottomright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-bottom-right-radius: 16px;
		border-bottom-left-radius: 16px;
		background-color:$Color-LighterGrey;
		padding:24px;
		padding-bottom:92px;
		position:relative;
		height:calc(100% - 175px);

		@media(max-width:$Breakpoint-Mobile){
			padding:16px;
			padding-bottom:92px;
			height:calc(100% - 195px);
		}

		&:after{
			content:'\e5c8';
			font-family: $Font-MaterialSymbols;
			width:48px;
			height:48px;
			border-radius:999px;
			background-color:$Color-LightGrey;
			color:$Color-DarkBlue;
			position:absolute;
			bottom:20px;
			right:24px;
			font-size: 32px;
			padding: 8px;
			line-height: 30px;
			transition:all .25s ease-in;
		}

		.course_type{
			display:inline-block;
			border-radius:4px;
			background-color:$Color-LightGrey;
			padding:8px;
			font-size:16px;
			line-height:24px;
			position:relative;
			margin-bottom:16px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.course_date{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;
			margin-bottom: 16px;
			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.course_title{
			display:inline-block;
			width:100%;
			margin-bottom: 5px;
			strong{
				font-size:28px;
				line-height:28px;
				font-family:$Font-ZainBold;
				font-weight: normal;
				display:block;
				background-size: 1px 1em;
				display: inline;
				@include yellow_underline;

				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}

		.course_location{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;
			margin-bottom: 5px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		.course_price{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:24px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}
	}

	&:hover{

		.details{

			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			> span{
				color:$Color-DarkBlue;
			}

			.course_title{
				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover;
				}
			}

		}
	}
}

.stat_item_container{
	display:inline-block;
	border-radius:16px;
	background-color:$Color-LighterGrey;
	padding:24px;
	font-size:18px;
	line-height:32px;
	position:relative;

	&:not(.no_link){
		padding-bottom:92px;
	}

	@media(max-width:$Breakpoint-Mobile){
		font-size:16px;
		line-height:28px;
	}

	&:not(.no_link){
		&:after{
			content:'\e5c8';
			font-family: $Font-MaterialSymbols;
			width:48px;
			height:48px;
			border-radius:999px;
			background-color:$Color-LightGrey;
			color:$Color-DarkBlue;
			position:absolute;
			bottom:20px;
			right:24px;
			font-size: 32px;
			padding: 8px;
			line-height: 30px;
			transition:all .25s ease-in;
		}
	}

	.stat_icon{
		display:inline-block;
		width: 100%;
		// margin-bottom:15px;
		img{
			max-width:72px;
			max-height: 72px;
		}
	}

	.stat_title{
		display:inline-block;
		width:100%;
		margin-bottom: 5px;
		strong{
			font-size:32px;
			line-height:32px;
			font-family:$Font-ZainBold;
			font-weight: normal;
			display:block;
			background-size: 1px 1em;

			@include yellow_underline;
			display: inline;

			@media(max-width:$Breakpoint-Mobile){
				font-size:28px;
				line-height:28px;
			}
		}
	}

	.stat_summary{
		display:inline-block;
		width:100%;
	}

	&:not(.no_link){
		&:hover{
			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			.stat_title{
				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover();
				}
			}
		}
	}
}

.resource_item_container{
	display:inline-block;
	width:100%;
	height:100%;
	border-radius:16px;
	background-color:$Color-LighterGrey;
	padding:24px;
	padding-bottom:92px;
	position:relative;
	&:after{
		content:'\e5c8';
		font-family: $Font-MaterialSymbols;
		width:48px;
		height:48px;
		border-radius:999px;
		background-color:$Color-LightGrey;
		color:$Color-DarkBlue;
		position:absolute;
		bottom:20px;
		right:24px;
		font-size: 32px;
		padding: 8px;
		line-height: 30px;
		transition:all .25s ease-in;
	}

	.details{
		display:inline-block;
		width:100%;

		.members_only{
			display:inline-block;
			border-radius:4px;
			background-color:$Color-LightGrey;
			padding:0px 8px;
			font-size:14px;
			line-height:29px;
			position:relative;
			margin-bottom:16px;
			padding-right:30px;

			&:after{
				content:'\e897';
				font-family: $Font-MaterialSymbols;
				position:absolute;
				top:0;
				right:8px;
				color:$Color-DarkBlue;
			}

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:25px;
			}
		}

		.resource_title{
			display:inline-block;
			width:100%;
			strong{
				font-size:28px;
				line-height:28px;
				font-family:$Font-ZainBold;
				font-weight: normal;
				display:block;
				background-size: 1px 1em;

				@include yellow_underline;
				display: inline;

				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}

		.resource_date{
			display:inline-block;
			width:100%;
			font-size:16px;
			line-height:29px;
			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:25px;
			}
		}

		.resource_summary{
			display:inline-block;
			width:100%;
			font-size:18px;
			line-height:32px;
			margin-bottom:16px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:16px;
				line-height:29px;
			}
		}

	}

	&:hover{

		.details{

			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			> span{
				color:$Color-DarkBlue;
			}

			.resource_title{
				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover;
				}
			}

		}
	}
}

.job_item_container{
	display:inline-block;
	width:100%;
	height:100%;
	border-radius:16px;
	background-color:$Color-LighterGrey;
	padding:24px;
	padding-bottom:126px;
	position:relative;

	@media(max-width:$Breakpoint-Mobile){
		padding:16px;
		padding-bottom:92px;
	}

	&:after{
		content:'\e5c8';
		font-family: $Font-MaterialSymbols;
		width:48px;
		height:48px;
		border-radius:999px;
		background-color:$Color-LightGrey;
		color:$Color-DarkBlue;
		position:absolute;
		bottom:20px;
		right:24px;
		font-size: 32px;
		padding: 8px;
		line-height: 30px;
		transition:all .25s ease-in;
	}

	.job_company{
		display:inline-block;
		width:100%;
		position:relative;
		padding-left:40px;
		margin-bottom: 24px;
		> span{
			font-size:16px;
			line-height:26px;
			color:$Color-DarkBlue;

			@media(max-width:$Breakpoint-Mobile){
				font-size:14px;
				line-height:22px;
			}
		}

		img{
			position:absolute;
			left:0;
			top:0;
			border-radius:999px;
			max-width:32px;
			max-height:32px;
			border:1px solid $Color-LightGrey;
		}
	}

	.job_title{
		display:inline-block;
		width:100%;
		strong{
			font-size:28px;
			line-height:28px;
			font-family:$Font-ZainBold;
				font-weight: normal;
			display:block;
			background-size: 1px 1em;
			display: inline;
			@include yellow_underline;

			@media(max-width:$Breakpoint-Mobile){
				font-size:24px;
				line-height:24px;
			}
		}
	}

	.job_city{
		display:inline-block;
		width:100%;
		font-size:16px;
		line-height:24px;
		color:$Color-DarkBlue;
		padding:8px 0;
		@media(max-width:$Breakpoint-Mobile){
			font-size:14px;
			line-height:22px;
		}
	}

	.job_salary{
		display:inline-block;
		width:100%;
		font-size:16px;
		line-height:24px;
		color:$Color-DarkBlue;
		font-weight: 700;
		@media(max-width:$Breakpoint-Mobile){
			font-size:14px;
			line-height:22px;
		}
	}

	&:hover{
		&:after{
			background-color:$Color-DarkBlue;
			color:$Color-White;
		}

		.job_title{
			strong{
				color:$Color-DarkBlue;
				@include yellow_underline_hover;
			}
		}
	}
}

.product_item_container{
	display:inline-block;
	width:100%;
	height:100%;

	.thumbnail{
		-webkit-border-top-left-radius: 16px;
		-webkit-border-top-right-radius: 16px;
		-moz-border-radius-topleft: 16px;
		-moz-border-radius-topright: 16px;
		border-top-left-radius: 16px;
		border-top-right-radius: 16px;
		display:block;
		width:100%;
		height:310px;
		@media(max-width:$Breakpoint-Mobile){
			height:343px;
		}
	}

	.details{
		display:inline-block;
		width:100%;
		-webkit-border-bottom-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius-bottomright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-bottom-right-radius: 16px;
		border-bottom-left-radius: 16px;
		background-color:$Color-LighterGrey;
		padding:24px;
		padding-bottom:92px;
		position:relative;
		height:calc(100% - 310px);

		@media(max-width:$Breakpoint-Mobile){
			padding:16px;
			padding-bottom:92px;
			height:initial;
		}

		&:after{
			content:'\e5c8';
			font-family: $Font-MaterialSymbols;
			width:48px;
			height:48px;
			border-radius:999px;
			background-color:$Color-LightGrey;
			color:$Color-DarkBlue;
			position:absolute;
			bottom:20px;
			right:24px;
			font-size: 32px;
			padding: 8px;
			line-height: 30px;
			transition:all .25s ease-in;
		}


		.product_title{
			display:inline-block;
			width:100%;
			margin-bottom: 4px;
			strong{
				font-size:28px;
				line-height:28px;
				font-family:$Font-ZainBold;
				font-weight: normal;
				display:block;
				background-size: 1px 1em;

				@include yellow_underline;
				display: inline;

				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}

		.product_price{
			display:inline-block;
			width:100%;
			strong{
				font-size:18px;
				line-height:32px;
				font-family: $Font-Lato;
				@media(max-width:$Breakpoint-Mobile){
					font-size:24px;
					line-height:24px;
				}
			}
		}
	}

	&:hover{

		.details{

			&:after{
				background-color:$Color-DarkBlue;
				color:$Color-White;
			}

			> span{
				color:$Color-DarkBlue;
			}

			.product_title{
				strong{
					color:$Color-DarkBlue;
					@include yellow_underline_hover;
				}
			}

		}
	}
}



/*# PAGE BODY CONTAINERS #*/
.article_body_container{

	.article_body_inner_container{
		.row{

			.article_body{
				padding-right:calc(48px);

				@media(max-width:$Breakpoint-Mobile)
				{
					flex:0 0 100%;
					max-width: 100%;
					margin-bottom: 24px;
					padding-right:$bootstrap_padding;
				}
			}

			.article_side_col{
				max-width:325px;
				@media(max-width:$Breakpoint-Mobile)
				{
					flex:0 0 100%;
					max-width: 100%;
					margin-bottom: 24px;
				}
			}
		}
	}
}

.two_column_content_container{
	.two_column_content_inner_container{
		.row{
			.side_column{
				max-width:286px;

				@media (max-width:$Breakpoint-Mobile){
					max-width:100%;
					flex:0 0 100%;
					margin-bottom: 24px;
				}

				/*Side Navigation*/
				.side_navigation_container{
					padding:24px;
					display:inline-block;
					width:100%;
					background-color:$Color-LighterGrey;
					border-radius:16px;

					@media(max-width:$Breakpoint-Mobile){
						padding:8px 12px;
					}

					.side_navigation{
						display:inline-block;
						width:100%;

						.dropdown-toggle{
							background:none;
							border:0px;
							padding:0;
							height:initial;
							padding-bottom:24px;
							border-bottom: 1px solid $Color-LightGrey;
							display:inline-block;
							width:100%;

							@media(max-width:$Breakpoint-Mobile){
								border-bottom:0;
								padding-bottom: 0;
							}


							&:after{
								display:none;

								@media(max-width:$Breakpoint-Mobile){
									display:block;
									margin:0 !important;
									right:0 !important;
									top:2px !important;
								}

							}

							&.show:after{
								@media(max-width:$Breakpoint-Mobile){
									right:0 !important;
								}
							}

							.explore_text{
								display:block;
								font-size:16px;
								line-height:29px;
								color:$Color-DarkBlue;
								margin-bottom: 4px;
								@media(max-width:$Breakpoint-Mobile){
									font-size:12px;
									line-height:22px;
									margin:0;
								}

							}

							.current_parent_page{
								margin:0;

								@media(max-width:$Breakpoint-Mobile){
									font-size:24px;
									line-height:24px;
								}

							}
						}

						.dropdown-menu{
							display:block;
							margin:0;
							padding:0;
							border:0;
							background-color: transparent;
							position: static !important;

							@media(max-width:$Breakpoint-Mobile)
							{
								display:none;
								background-color:$Color-LighterGrey;
								&.show {
									display: block;
								}
							}


							.accordion{
								background-color: transparent;

								.accordion-item{
									margin: 0;
									border:0;
									background-color: transparent;
									border-bottom: 1px solid $Color-LightGrey;
									border-radius: 0;

									@media(max-width:$Breakpoint-Mobile)
									{
										&:last-child{
											border:0;
										}
									}

									.accordion-header{
										border:0;
										.accordion-button{
											padding:16px 0;
											padding-right:25px;
											background:none;
											background-color:transparent;
											color:$Color-DarkBlue;
											font-size:16px;
											line-height:29px;
											font-family: $Font-Lato;
											border:0;
											position:relative;
											box-shadow: none;
											border-radius:12px;
											font-weight: 700;

											&:after{
												content:'\e15b';
												font-family: $Font-MaterialSymbols;
												color:$Color-SilverBlue;
												position:absolute;
												top:16px;
												right:10px;
												background:none;
												transform: none;
												font-size:24px;
											}

											&.collapsed{
												font-weight: normal;
											}

											&.collapsed:after{
												content:'\e145';
											}
										}

									}

									.accordion-collapse{
										border:0;
										background-color:$Color-LighterGrey;
										color:$Color-DarkBlue;
										.accordion-body{
											border:0;
											padding:0;
											padding-bottom: 16px;
											ul{
												padding:0;
												margin:0;
												li{
													list-style: none;
													a{
														font-size:16px;
														line-height:29px;
														color:$Color-DarkBlue;
														padding:0;
														text-decoration: none;
														background:none;
														&:hover{
															text-decoration: underline;
															background:none;
														}
													}
												}
											}
										}
									}

									&.no_accordion_body{
										.accordion-header{
											.accordion-button{

												&:after{
													display:none;
												}

											}

										}
									}
								}
							}
						}
					}

				}
			}

			.content_column{
				padding-left:48px;

				@media (max-width:$Breakpoint-Mobile){
					max-width:100%;
					flex:0 0 100%;
					padding-left:$bootstrap_padding;
				}

				/*Accordions*/
				.accordion_container{
					padding:0 !important;
					.accordion_inner_container{
						padding:0 !important;
						margin:0 !important;
						max-width:100% !important;
					}
				}
			}
		}
	}
}

.product_details_container{
	padding-top:80px;
	padding-bottom: 80px;


	@media (max-width:$Breakpoint-Mobile){
		padding-top:48px;
		padding-bottom: 48px;
	}


	.product_details_inner_container{
		.row{

			.product_image{
				max-width:632px;
				img{
					border-radius: 16px;
				}

				@media (max-width:$Breakpoint-Mobile){
					max-width:100%;
					flex:0 0 100%;
					margin-bottom: 24px;
				}

			}

			.product_details{
				padding-left:48px;


				@media (max-width:$Breakpoint-Mobile){
					max-width:100%;
					flex:0 0 100%;
					padding-left:$bootstrap_padding;
				}


				h1{
					margin-bottom: 12px;
				}

				h3{
					margin-bottom: 32px;
				}

				.product_pricing_details{
					display:inline-block;
					width:100%;
					background-color:$Color-LighterGrey;
					padding:8px 16px;
					border-radius: 12px;
					font-size:14px;
					line-height:25px;
					margin-bottom: 32px;
					a{
						font-size:14px;
						line-height:25px;
						text-decoration: underline;
						&:hover{
							text-decoration: none;
						}
					}
				}

				.product_detail_item{
					display:inline-block;
					width:100%;
					margin-bottom: 32px;
					a{
						text-decoration: underline;
						&:hover{
							text-decoration: none;
						}
					}
				}

				.product_registration_form{
					.form_container{

						.form_inner_container{
							padding:24px;
							display:inline-block;
							width:100%;
							background-color:$Color-LighterGrey;
							border-radius:16px;
							margin-bottom: 32px;
						}
					}

				}

			}
		}

	}
}



/*# Ca. HOMEPAGE BANNER #*/
.homepage_banner_container{
	background:url('../IMG/Backgrounds/homepage_banner_background.png') no-repeat center center / cover;

	@media(max-width:$Breakpoint-Mobile){
		background:url('../IMG/Backgrounds/homepage_banner_mobile_background.png') no-repeat center center / cover;
	}

	.homepage_banner_inner_container{
		position:relative;
		height:650px;
		@media(max-width:$Breakpoint-Mobile){
			padding-top:48px;
			padding-bottom: 48px;
			height:initial;
		}
		.homepage_banner_caption_container{
			max-width: 624px;
			width:40vw;
			position:absolute;
			top:50%;
			transform:translateY(-50%);
			left:$bootstrap_padding;

			@media(max-width:$Breakpoint-Mobile){
				position:relative;
				width:100%;
				max-width: 100%;
				top:initial;
				left:initial;
				transform: none;
				margin-bottom: 32px;
			}

			h1{
				margin-bottom: 12px;
			}

			h2{
				font-size:20px;
				line-height:32px;
				font-family: $Font-Lato;
				font-weight: 400;
				margin-bottom: 32px;

				@media(max-width:$Breakpoint-MobileNavigation){
					font-size:19px;
					line-height:31px;
				}

				@media(max-width:$Breakpoint-Mobile){
					font-size:18px;
					line-height:30px;
				}
			}
		}

		.homepage_banner_image_container{
			max-width: 608px;
			max-height: 450px;
			position:absolute;
			top:50%;
			transform:translateY(-50%);
			right:0;
			padding:16px;
			padding-left:0;
			width:50vw;
			height:40vw;

			@media(max-width:$Breakpoint-Mobile){
				position:relative;
				width:100%;
				height:60vw;
				max-width: 100%;
				max-height: 100%;
				top:initial;
				left:initial;
				transform: none;
				margin-bottom: 0;
			}

			.homepage_banner_image{
				width:100%;
				height:100%;
				display:inline-block;
				-webkit-border-radius: 64px;
				-webkit-border-top-right-radius: 16px;
				-webkit-border-bottom-left-radius: 16px;
				-moz-border-radius: 64px;
				-moz-border-radius-topright: 16px;
				-moz-border-radius-bottomleft: 16px;
				border-radius: 64px;
				border-top-right-radius: 16px;
				border-bottom-left-radius: 16px;
				opacity:0;
				transition:all 0.75s ease-in-out;
				margin-top:-16px;
			}


			&.aos-animate{

				.homepage_banner_image{
					opacity:1;
					transition-delay:0.5s;
					margin-top:0;
				}


			}


		}
	}
}

/*# Cb. FULL WIDTH SOLID BG CTA #*/
.full_width_solidbg_cta_container
{
	background-color:$Color-DarkBlue;
	-webkit-border-top-right-radius: 100px;
	-webkit-border-bottom-left-radius: 100px;
	-moz-border-radius-topright: 100px;
	-moz-border-radius-bottomleft: 100px;
	border-top-right-radius: 100px;
	border-bottom-left-radius: 100px;
	color:$Color-White;
	padding-top:80px;
	padding-bottom: 80px;

	@media(max-width:$Breakpoint-Mobile){
		-webkit-border-top-right-radius: 40px;
		-webkit-border-bottom-left-radius: 40px;
		-moz-border-radius-topright: 40px;
		-moz-border-radius-bottomleft: 40px;
		border-top-right-radius: 40px;
		border-bottom-left-radius: 40px;
		padding-top:48px;
		padding-bottom: 48px;
	}

	.cta_body_content{

		> div:last-child{
			margin:0;
			text-align: center;
			width:100%;
		}

		p{
			color:$Color-White;
			font-size:20px;
			line-height:28px;

			@media(max-width:$Breakpoint-Mobile){
				font-size:18px;
				line-height:26px;
			}
		}

		h2{
			color:$Color-White;
			margin-bottom: 12px;
			@media(max-width:$Breakpoint-Mobile){
				margin-bottom: 8px;
			}
		}

		.cta_subtitle{
			text-align: center;
			width:100%;
			text-transform: uppercase;
			position:relative;
			padding-bottom:28px;

			@media(max-width:$Breakpoint-Mobile){
				padding-bottom:16px;
			}

			&::after{
				content:'';
				height:4px;
				width:40px;
				background-color: $Color-Yellow;
				border-radius:4px;
				position: absolute;
				left:0;
				right:0;
				display:block;
				margin:auto;
				bottom:12px;

				@media(max-width:$Breakpoint-Mobile){
					bottom:6px;
				}
			}
		}

		.cta_title_text{
			text-align: center;
			width:100%;
			margin-bottom: 32px;
			@media(max-width:$Breakpoint-Mobile){
				margin-bottom: 24px;
			}
		}

	}
}

/*# Cc. LATEST NEWS #*/
.latest_news_container{

	.latest_news_inner_container{
		> .row{
			margin-bottom: 48px;

			@media(max-width:$Breakpoint-MobileNavigation){
				margin-bottom:16px;
			}

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}
}

/*# Cd. QUICK LINKS #*/
.quick_links_container{

	padding-top:80px;
	padding-bottom: 80px;

	.section_title_container{
		*, .section_subtitle{
			color:$Color-White;
		}
	}

	@media(max-width:1250px){
		padding-bottom:64px;
	}

	@media(max-width:$Breakpoint-Mobile){
		padding-top:48px;
		padding-bottom: 48px;
	}

	.quick_links_inner_container{

		> .row{

			.col{
				flex:0 0 16.66%;
				max-width:16.66%;

				@media(max-width:1250px){
					flex:0 0 33.33%;
					max-width:33.33%;
					margin-bottom: 16px;
				}

				@media(max-width:650px){
					flex:0 0 50%;
					max-width:50%;
				}

				.quick_link_item_container{
					display:inline-block;
					width:100%;
					height:100%;
					background-color: $Color-White;
					border-radius:16px;
					padding:42px 24px;
					text-align: center;

					*{
						transition:all 0.15s ease-in;
					}

					@media(max-width:$Breakpoint-Mobile){
						padding:42px 16px;
					}

					.icon{
						display:inline-block;
						width:100%;
						margin-bottom:24px;
						img{
							display:inline-block;
							max-width:72px;
							max-height:72px;
						}
					}

					.title{
						display:inline-block;
						width:100%;
						font-size:28px;
						line-height:28px;
						font-family: $Font-ZainBold;

						@media(max-width:$Breakpoint-Mobile){
							font-size:24px;
							line-height:24px;
						}
					}


					&:hover{
						background-color:$Color-Yellow;

						.icon{
							img{
								filter: brightness(0) invert(1);
							}
						}

						.title{
							color:$Color-DarkBlue;
						}
					}
				}
			}

		}
	}
}

/*# Ce. FEATURED JOBS #*/
.featured_jobs_container{
	.featured_jobs_inner_container{
		margin-bottom: 48px;

		@media(max-width:$Breakpoint-MobileNavigation){
			margin-bottom:16px;
		}

		> .row{

			margin-bottom: 48px;

			@media(max-width:$Breakpoint-MobileNavigation){
				margin-bottom:16px;
			}

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}
}

/*# Cf. FEATURED PAGE/NEWS #*/
.featured_page_container{

	.featured_page_inner_container{
		-webkit-border-radius: 16px;
		-webkit-border-top-right-radius: 64px;
		-webkit-border-bottom-left-radius: 64px;
		-moz-border-radius: 16px;
		-moz-border-radius-topright: 64px;
		-moz-border-radius-bottomleft: 64px;
		border-radius: 16px;
		border-top-right-radius: 64px;
		border-bottom-left-radius: 64px;
		overflow:hidden;

		@media(max-width:$Breakpoint-950)
		{
			-webkit-border-radius: 16px;
			-webkit-border-top-right-radius: 24px;
			-webkit-border-bottom-left-radius: 24px;
			-moz-border-radius: 16px;
			-moz-border-radius-topright: 24px;
			-moz-border-radius-bottomleft: 24px;
			border-radius: 16px;
			border-top-right-radius: 24px;
			border-bottom-left-radius: 24px;
		}

		.row{

			.text{
				padding-right:0;

				@media(max-width:$Breakpoint-950)
				{
					order:2;
					flex:0 0 100%;
					max-width:100%;
				}

				.text_inner{
					background-color:$Color-DarkBlue;
					flex:0 0 48%;
					max-width:1312px;
					padding:32px 64px;
					display: inline-block;
					width: 100%;
					height: 100%;

					@media(max-width:$Breakpoint-Mobile)
					{
						padding:32px 16px;
					}

					*:not(.solid_round_button){color:$Color-White;}

					.date{
						font-size:16px;
						line-height:24px;
						display:inline-block;
						width:100%;
						margin-bottom: 12px;
						text-transform: uppercase;
						@media(max-width:$Breakpoint-Mobile){
							margin-bottom: 8px;
							font-size:14px;
							line-height:16px;
						}
					}

					h2{
						margin-bottom: 12px;
						@media(max-width:$Breakpoint-Mobile){
							margin-bottom: 8px;
						}
					}

					.summary{
						display:inline-block;
						width:100%;
						font-size:20px;
						line-height:36px;
						margin-bottom:32px;

						@media(max-width:$Breakpoint-Mobile){
							font-size:18px;
							line-height:32px;
						}
					}
				}

			}

			.image{
				min-height: 450px;
				position:relative;

				@media(max-width:$Breakpoint-950)
				{
					height:210px;
					min-height: initial;
					order:1;
					flex:0 0 100%;
					max-width:100%;
				}

				> div{
					width:100%;
					height:100%;
					position:absolute;
					top:0;
					left:0;
				}
			}
		}
	}
}

/*# Cg. FEATURED COURSES #*/
.featured_courses_container{
	.featured_courses_inner_container{
		.row{
			margin-bottom: 48px;

			@media(max-width:$Breakpoint-MobileNavigation){
				margin-bottom:16px;
			}

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}


			}
		}
	}
}

/*# Ch. NEWSLETTER SIGNUP #*/
.newsletter_container{
	opacity:1 !important;
	.newsletter_inner_container{
		-webkit-border-radius: 64px;
		-webkit-border-top-right-radius: 16px;
		-webkit-border-bottom-left-radius: 16px;
		-moz-border-radius: 64px;
		-moz-border-radius-topright: 16px;
		-moz-border-radius-bottomleft: 16px;
		border-radius: 64px;
		border-top-right-radius: 16px;
		border-bottom-left-radius: 16px;

		@media(max-width:$Breakpoint-Mobile){
			-webkit-border-radius: 24px;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius: 24px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-radius: 24px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
		}

		.newsletter_body{
			display:inline-block;
			width:100%;
			-webkit-border-radius: 64px;
			-webkit-border-top-right-radius: 16px;
			-webkit-border-bottom-left-radius: 16px;
			-moz-border-radius: 64px;
			-moz-border-radius-topright: 16px;
			-moz-border-radius-bottomleft: 16px;
			border-radius: 64px;
			border-top-right-radius: 16px;
			border-bottom-left-radius: 16px;
			padding:80px 64px;
			position:relative;

			@media(max-width:calc($Breakpoint-StandardBodyWidth + 50px)){
				.hover_border_fg{
					display:none;
				}
			 }

			@media(max-width:$Breakpoint-Mobile){
				padding:48px 16px;
				-webkit-border-radius: 24px;
				-webkit-border-top-right-radius: 16px;
				-webkit-border-bottom-left-radius: 16px;
				-moz-border-radius: 24px;
				-moz-border-radius-topright: 16px;
				-moz-border-radius-bottomleft: 16px;
				border-radius: 24px;
				border-top-right-radius: 16px;
				border-bottom-left-radius: 16px;
			}

			.row{
				z-index: 2;
				position: relative;

				.col{

					&.signup_text{
						flex:0 0 48%;
						max-width:560px;

						@media(max-width:1265px){
							flex:0 0 60%;
							max-width:60%;
						}

						@media(max-width:$Breakpoint-950){
							flex:0 0 100%;
							max-width:100%;
							margin-bottom: 48px;
						}

						> img{
							display:block;
							max-width:72px;
							margin-bottom: 32px;
							@media(max-width:1265px){
								margin-bottom:16px;
							}
						}

						h2{
							color:$Color-White;
							margin-bottom: 12px;
						}

						p{
							font-size:20px;
							line-height:36px;
							margin-bottom: 32px;
							color:$Color-White;
							@media(max-width:$Breakpoint-Mobile){
								font-size:18px;
								line-height:32px;
							}
						}

						.join_path_wellness_callout{
							display:inline-block;
							width:100%;
							font-size:18px;
							line-height:28px;
							color:$Color-White;

							@media(max-width:$Breakpoint-Mobile){
								font-size:16px;
								line-height:26px;
							}

							img{
								display:inline-block;
								margin-right:12px;
								@media(max-width:$Breakpoint-950){
									display:block;
									margin-right:0;
									margin-bottom: 8px;
								}
							}
						}
					}

					&.signup_form{
						text-align: right;
						.form_container{
							text-align: left;
							padding:24px;
							background-color:$Color-White;
							width:100%;
							border-radius:16px;
							max-width:512px;
							display:inline-block;

							&.no_bg{
								background:none;
								label, small, p{
									color:$Color-White;
								}
							}
							@media(max-width:$Breakpoint-950){
								max-width:100%;
							}
						}
					}
				}
			}
		}

	}
}

/*# Ci. SEARCH WITH FILTERS #*/
.search_w_filters_container{
	.search_w_filters_inner_container{
		.row{

			.search_filters_column{
				max-width: 312px;

				@media(max-width:$Breakpoint-950){
					max-width:100%;
					flex:0 0 100%;
					margin-bottom: 48px;
					.left_column_desktop_content{
						display:none;
					}
				}

				.solid_round_button.mobile_search_filters_toggle{
					display:none;
					padding-right:36px;
					position:relative;
					width:initial;

					&:after{
						content:'\e429';
						font-family: $Font-MaterialSymbols;
						color:$Color-DarkBlue;
						position:absolute;
						top: 10px;
						right: 10px;
						font-size: 20px;
					}

					@media(max-width:$Breakpoint-950){
						display:inline-block;
					}
				}

				.search_filters_container{
					margin-bottom: 24px;

					@media(max-width:$Breakpoint-950){
						display:none;
						position:fixed;
						z-index:999;
						width:100%;
						height:100%;
						overflow-y: scroll;
						background-color:$Color-White;
						padding:40px;
						top:0;
						left:0;
						&.open{
							display:block;
						}
					}

					.modal_close_button{
						display:none;
						position:absolute;
						top:20px;
						right:20px;
						box-shadow: unset;
						background:none;
						width:initial;
						height:initial;
						color:$Color-DarkBlue;
						opacity:1;
						z-index:10;

						@media(max-width:$Breakpoint-900){
							top:16px;
							right:16px;
						}

						.material-symbols-outlined {
							color:$Color-DarkBlue;
							font-size:30px;
							font-variation-settings:
							'FILL' 1,
							'wght' 400,
							'GRAD' 0,
							'opsz' 24
						}

						@media(max-width:$Breakpoint-950){
							display:block;
						}
					}

					.mobile_search_filters_footer{
						display:none;
						padding:40px 0;
						text-align: center;
						.solid_round_button{
							width:100%;
							max-width:400px;
						}

						@media(max-width:$Breakpoint-950){
							display:block;
						}
					}

					.search_filters_inner_container{


						h3{
							margin-bottom:24px;
						}

						label{
							font-size:16px;
							line-height:28px;
							margin-bottom: 8px;
						}

						.text_bar_wicon {
							display:inline-block;
							width:100%;
							position:relative;
							padding-left:42px;
							height:40px;
							border-radius:4px;
							border: 1px solid $Color-LightGreySecondary;
							margin-bottom: 24px;
							a{
								position:absolute;
								left:16px;
								top:50%;
								transform:translateY(-50%);
								img{
									max-width: 19px;
								}
							}

							input[type=text].form-control{
								font-size:16px;
								line-height:28px;
								border:0;
								height:100%;
								padding:0 16px;
								padding-left:10px;
								&:focus, &:active{
									box-shadow: none;
								}
								&::placeholder{
									font-size:16px;
									line-height:28px;
								}
							}
						}

						.search_dropdown_filter{
							display:inline-block;
							width:100%;
							margin-bottom: 24px;
						}

						.search_checkboxlist_filter{
							padding-top:16px;
							padding-bottom:16px;
							border-top: 1px solid $Color-LightGrey;

							&:last-child{
								border-bottom: 1px solid  $Color-LightGrey;
							}

							.toggle_expand_filters{
								display:inline-block;
								width:100%;
								position:relative;
								font-size:16px;
								line-height:28px;
								color:$Color-DarkBlue;
								padding-right:30px;
								text-decoration: none;
								&:before{
									content:'\e145';
									font-family: $Font-MaterialSymbols;
									font-size:24px;
									position:absolute;
									right:0;
									top:0;
								}
							}

							.checkboxlist_filters{
								height:0;
								max-height: 0;
								overflow:hidden;
								display:block;
								width:100%;
								margin-top:0;
								margin-bottom:0;

								.toggle_show_more{
									font-size:12px;
									line-height:22px;
									font-weight: 700;
								}

								.additional_filters{
									height:0;
									max-height: 0;
									overflow:hidden;
									display:block;
									width:100%;
									transition: all .25s ease-in;
								}
							}



							&.open{

								.toggle_expand_filters{
									&:before{
										content:'\e15b';
									}
								}

								.checkboxlist_filters{
									margin-top:12px;
									margin-bottom:12px;
									height:1000px;
									max-height:fit-content;
									transition: all .25s ease-in;

									.additional_filters.show_all{
										height:1000px;
										max-height:fit-content;
										transition: all .25s ease-in;
									}
								}

							}

						}

					}


				}
			}

			.search_results_column{
				padding-left:48px;

				@media(max-width:$Breakpoint-950){
					max-width:100%;
					flex:0 0 100%;
					padding-left:$bootstrap_padding;
					padding-right:$bootstrap_padding;
				}

				.row{
					.col{
						max-width:33.33%;
						flex:0 0 33.33%;
						margin-bottom:48px;

						@media(max-width:1150px){
							max-width:50%;
							flex:0 0 50%;
						}

						@media(max-width:$Breakpoint-950){
							max-width:33.33%;
							flex:0 0 33.33%;
						}

						@media(max-width:$Breakpoint-Mobile){
							flex:0 0 50%;
							max-width: 50%;
						}

						@media(max-width:$Breakpoint-600){
							flex:0 0 100%;
							max-width: 100%;
							margin-bottom:32px;

						}

					}
				}

				 .show_more_items{
					display:inline-block;
					width:100%;
					text-align: center;
				 }
			}


		}
	}
}

/*# Cj. NEWS DETAILS #*/
.article_details{
	display:inline-block;
	width:100%;
	background-color:$Color-LighterGrey;
	padding:24px;
	border-radius:16px;
	margin-bottom: 40px;

	h3{
		margin-bottom: 24px;
		@media(max-width:$Breakpoint-MobileNavigation)
		{
			margin-bottom: 16px;
		}
	}

	@media(max-width:$Breakpoint-MobileNavigation)
	{
		padding:$site_fixed_padding;
	}

	.detail_item{
		display:inline-block;
		width:100%;
		padding:16px 0;
		border-top:1px solid $Color-LightGrey;
		font-size:$FontSize-BodySmall;
		line-height:$LineHeight-BodySmall;
		color:$Color-SilverBlue;

		a:not(.solid_round_button){
			font-size:$FontSize-BodySmall;
			line-height:$LineHeight-BodySmall;
			color:$Color-SilverBlue;
			text-decoration: underline;
			&:hover{
				text-decoration: none;
			}
		}

		@media(max-width:$Breakpoint-MobileNavigation)
		{
			font-size:$FontSize-BodySmallMobile;
			line-height:$LineHeight-BodySmallMobile;
			a{
				font-size:$FontSize-BodySmallMobile;
				line-height:$LineHeight-BodySmallMobile;
			}
		}

		strong{
			color:$Color-DarkBlue;
			display:block;
			margin-bottom: 8px;
		}

		&:last-child{
			border-bottom:1px solid $Color-LightGrey;
		}

		&.no_border_bottom{
			border-bottom: 0;
		}

		&.w_image{
			position:relative;
			padding-left:64px;
			img{
				position:absolute;
				left:0;
				top:16px;
				max-width:48px;
				max-height: 48px;
				border-radius:999px;
				border:1px solid $Color-LightGrey;
			}
		}
	}
}

.side_col_content_container{
	display:inline-block;
	width:100%;
	padding-top:24px;
	border-top:1px solid $Color-LightGrey;
}

.social_media_container{
	display:inline-block;
	width:100%;
	margin-bottom: 40px;
	a{
		display:inline-block;
		margin-right:8px;
		img{
			max-width:35px;
		}
		&:last-child{
			margin:0;
		}
	}
}

.image_stack_container{
	img{
		margin-bottom: 24px;
		border-radius: 16px;
	}
}

/*# Ck. RELATED/LATEST EVENTS #*/
.latest_events_container{

	.latest_events_inner_container{
		> .row{
			margin-bottom: 48px;

			@media(max-width:$Breakpoint-MobileNavigation){
				margin-bottom:16px;
			}

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}
}

/*# Cl. IMAGE LEFT/RIGHT TEXT CTAS #*/
.image_leftright_cta_container{
	padding-top:16px;
	.image_leftright_cta_inner_container{

		.row{

			.text_column
			{
				padding-right:48px;

				@media(max-width:$Breakpoint-MobileNavigation)
				{
					padding-right:25px;
				}

				@media(max-width:$Breakpoint-Mobile)
				{
					order:2;
					flex:0 0 100%;
					max-width:100%;
					padding-right:$bootstrap_fixed_padding;
				}

				h2{
					margin-bottom: 12px;
				}

				p, ul li{
					font-size:20px;
					line-height:36px;

					@media(max-width:$Breakpoint-Mobile)
					{
						font-size:$FontSize-Body;
						line-height:$LineHeight-Body;
					}
				}

				p, ul{
					&:last-child{
						margin-bottom: 0;
					}
				}

			}

			.image_column{
				position:relative;
				min-height:450px;
				max-width:616px;
				margin-left: auto !important;
				@media(max-width:$Breakpoint-Mobile)
				{
					order:1;
					flex:0 0 100%;
					max-width:100%;
					min-height: initial;
					height:327px;
					margin-bottom:32px;
				}

				.image{
					width:calc(100% - ($bootstrap_fixed_padding + $bootstrap_fixed_padding));
					height:100%;
					max-height:450px;
					position:absolute;
					top:0;
					left:$bootstrap_fixed_padding;
					-webkit-border-radius: 64px;
					-webkit-border-top-right-radius: 16px;
					-webkit-border-bottom-left-radius: 16px;
					-moz-border-radius: 64px;
					-moz-border-radius-topright: 16px;
					-moz-border-radius-bottomleft: 16px;
				}
			}

		}

	}

	&.image_left{
		.row{

			.text_column
			{
				order:2;
				padding-left:48px;
				padding-right:$bootstrap_padding;

				margin-left: auto !important;

				@media(max-width:$Breakpoint-MobileNavigation)
				{
					padding-left:25px;
				}

				@media(max-width:$Breakpoint-Mobile)
				{
					order:2;
					flex:0 0 100%;
					max-width:100%;
					padding-left:$bootstrap_fixed_padding;
				}

			}

			.image_column{
				order:1;
				margin-left:0 !important;
			}
		}
	}

	&.with_background{
		padding-top:80px;
		padding-bottom:80px;
		&.blue_secondary{
			background-color:$Color-BlueSecondary;

			.row{

				.text_column
				{
					color:$Color-White;
					h2{
						color:$Color-White;
					}
				}
			}
		}
	}

}

.image_leftright_wide_cta_container{
	padding:0;
	.image_leftright_wide_cta_inner_container{
		padding:0;


		@media(max-width:$Breakpoint-WideBodyWidth)
		{
			max-width: $Breakpoint-StandardBodyWidth;
		}

		.row{
			margin:0;
			.text_column{
				background-color:$Color-LighterGrey;
				position:relative;

				&.light_yellow_bg{
					background-color:$Color-LightYellow;
				}

				&.lighter_greyblue_bg{
					background-color:$Color-LighterGreyBlue;
				}


				@media(max-width:$Breakpoint-Mobile)
				{
					order:2 !important;
					flex:0 0 100%;
					max-width: 100%;
				}

				.text{
					position:relative;
					padding:32px 64px;
					top: 50%;
    				transform: translateY(-50%);


					@media(max-width:$Breakpoint-MobileNavigation)
					{
						padding:32px 16px;
					}


					p{
						font-size:20px;
						line-height:36px;

						@media(max-width:$Breakpoint-Mobile)
						{
							font-size:$FontSize-Body;
							line-height:$LineHeight-Body;
						}
					}

					.solid_round_button{
						margin-top:32px;
					}
				}
			}

			.image_column{
				min-height:450px;
				position:relative;

				@media(max-width:$Breakpoint-Mobile)
				{
					flex:0 0 100%;
					max-width:100%;
					order:1 !important;
					min-height: initial;
					height:210px;
				}

				.image{
					position:absolute;
					top:0;
					left:0;
					height:100%;
					width:100%;
				}
			}

		}

	}

	&.image_left{
		.image_leftright_wide_cta_inner_container{

			.row{

				.text_column{
					order: 2;
				}

				.image_column{
					order:1;
				}

			}

		}

	}

}

.image_leftright_wbgcolour_cta_container{

	.image_leftright_wbgcolour_cta_inner_container{



		.row{
			margin:0;

			-webkit-border-radius: 16px;
			-webkit-border-top-right-radius: 64px;
			-webkit-border-bottom-left-radius: 64px;
			-moz-border-radius: 16px;
			-moz-border-radius-topright: 64px;
			-moz-border-radius-bottomleft: 64px;
			border-radius: 16px;
			border-top-right-radius: 64px;
			border-bottom-left-radius: 64px;
			overflow:hidden;

			@media (max-width:$Breakpoint-Mobile){
				-webkit-border-radius: 16px;
				-webkit-border-top-right-radius: 24px;
				-webkit-border-bottom-left-radius: 24px;
				-moz-border-radius: 16px;
				-moz-border-radius-topright: 24px;
				-moz-border-radius-bottomleft: 24px;
				border-radius: 16px;
				border-top-right-radius: 24px;
				border-bottom-left-radius: 24px;
			}

			.text_column{
				background-color:$Color-DarkBlue;
				position:relative;

				@media(max-width:$Breakpoint-Mobile)
				{
					order:2 !important;
					flex:0 0 100%;
					max-width: 100%;
				}

				.text{
					position:relative;
					padding:32px 64px;
					top: 50%;
    				transform: translateY(-50%);


					@media(max-width:$Breakpoint-MobileNavigation)
					{
						padding:32px 16px;
					}


					h2{
						margin-bottom: 8px;
						color:$Color-White;
					}

					.cta_subtitle{
						display:inline-block;
						width:100%;
						text-transform: uppercase;
						color:$Color-White;
						font-size:16px;
						line-height:20px;
						margin-bottom: 12px;
						font-weight: 700;
						@media(max-width:$Breakpoint-Mobile)
						{
							font-size:14px;
							line-height:17px;
						}
					}

					p{
						font-size:20px;
						line-height:36px;
						color:$Color-White;

						@media(max-width:$Breakpoint-Mobile)
						{
							font-size:$FontSize-Body;
							line-height:$LineHeight-Body;
						}
					}

					.solid_round_button{
						margin-top:32px;
					}
				}

				&.yellow_text_bg{
					background-color:$Color-Yellow;
					.text{

						h2{
							color:$Color-DarkBlue;
						}

						.cta_subtitle{
							color:$Color-DarkBlue;
						}

						p{
							color:$Color-DarkBlue;
						}
					}
				}

				&.lightblue_text_bg{
					background-color:$Color-LightBlue;
					.text{

						h2{
							color:$Color-DarkBlue;
						}

						.cta_subtitle{
							color:$Color-DarkBlue;
						}

						p{
							color:$Color-DarkBlue;
						}
					}
				}
			}

			.image_column{
				min-height:450px;
				position:relative;
				max-width:50%;
				flex:0 0 50%;

				@media(max-width:$Breakpoint-Mobile)
				{
					flex:0 0 100%;
					max-width:100%;
					order:1 !important;
					min-height: initial;
					height:210px;
				}

				.image{
					position:absolute;
					top:0;
					left:0;
					height:100%;
					width:100%;
				}
			}

		}

	}

	&.image_left{
		.image_leftright_wide_cta_inner_container{

			.row{

				.text_column{
					order: 2;
				}

				.image_column{
					order:1;
				}

			}

		}

	}

}

/*# Cm. FEATURED IMAGE W/TEXT CTA #*/
.featured_image_w_text_cta_container{
	padding-top:80px;
	padding-bottom: 80px;

	&.lightgreyblue_bg{
		background-color:$Color-LightGreyBlue;
	}

	@media(max-width:$Breakpoint-Mobile)
	{
		padding-top:48px;
		padding-bottom: 48px;
	}

	.featured_image_w_text_cta_inner_container{
		text-align: center;
		.text_container{
			text-align: center;
			margin-bottom:48px;
			font-size:20px;
			line-height:36px;

			@media(max-width:$Breakpoint-Mobile)
			{
				font-size:18px;
				line-height:32px;
			}

			h2{
				margin-bottom: 12px;
			}
		}

		img{
			border-radius: 16px;
			max-height: 600px;
			display:inline-block;
		}

	}

}

/*# Cn. STATS #*/
.statistics_container{

	.statistics_inner_container{

		.row{

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}

	&.three_cols{
		.statistics_inner_container{

			.row{

				.col{
					flex:0 0 33.33%;
					max-width: 33.33%;

					@media(max-width:$Breakpoint-600){
						flex:0 0 100%;
						max-width: 100%;
					}

				}
			}
		}
	}
}

/*# Co. TWO COL VIDEOS #*/
.two_col_videos_container{
	.two_col_videos_inner_container{
		.row{
			.col{

				@media(max-width:$Breakpoint-Mobile){
					flex:0 0 100%;
					max-width:100%;
					margin-bottom:16px;
					&:last-col{
						margin:0;
					}
				}
				iframe{
					width:100% !important;
					height:362px !important;
					border-radius: 12px;

					@media(max-width:$Breakpoint-Mobile){
						max-height: 200px;
					}
				}
			}
		}
	}
}

/*# Cp. FEATURED TEXT W/BUTTON #*/
.featured_text_w_button_container{
	padding-top:80px;
	padding-bottom: 80px;
	background-color:$Color-LightGreyBlue;

	@media(max-width:$Breakpoint-Mobile){
		padding-top:48px;
		padding-bottom: 48px;
	}

	.featured_text_w_button_inner_container{

		.cta_subtitle{
			display:inline-block;
			width:100%;
			text-transform: uppercase;
			color:$Color-DarkBlue;
			font-size:16px;
			line-height:20px;
			margin-bottom: 12px;
			font-weight: 700;
			@media(max-width:$Breakpoint-Mobile)
			{
				font-size:14px;
				line-height:17px;
			}
		}

		h2{
			margin-bottom: 12px;
		}

		p{
			font-size:20px;
			line-height:36px;
			@media(max-width:$Breakpoint-Mobile)
			{
				font-size:18px;
				line-height:32px;
			}
		}

		.solid_round_button{
			margin-top:32px;
		}

	}

	&.not_fullwidth{
		padding-top:0;
		padding-bottom: 0;
		background-color:unset;
		.featured_text_w_button_inner_container{
			border-radius:16px;

			.featured_text_w_button_and_bgcolor{
				padding:80px 64px;
				background-color:$Color-LightGreyBlue;
				border-radius:16px;
				@media(max-width:$Breakpoint-Mobile){
					padding:48px 16px;
				}

			}

		}
	}

}

/*# Cq. STAFF LISTING #*/
.staff_listing_container{
	.staff_listing_inner_container{
		.row{
			.col.staff_column{
				flex:0 0 25%;
				max-width:25%;
				margin-bottom: 24px;

				@media(max-width:1150px){
					flex:0 0 33.33%;
					max-width:33.33%;
				}

				@media(max-width:$Breakpoint-900){
					flex:0 0 50%;
					max-width:50%;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width:100%;
					margin-bottom: 16px;
					&:last-child{
						margin:0;
					}
				}

				.staff_container{
					width:100%;
					height:100%;
					display:inline-block;
					border-radius:16px;
					overflow:hidden;
					cursor:pointer;

					.staff_image{
						width:100%;
						display:block;
						height:310px;

						@media(max-width:$Breakpoint-Mobile){
							height:343px;
						}
					}

					.staff_name_title{
						width:100%;
						display:inline-block;
						padding:24px;
						padding-right:55px;
						background-color:$Color-LighterGrey;
						position:relative;

						strong{
							font-size:28px;
							line-height:35px;
							font-family: $Font-ZainBold;
							display:inline-block;
							@include yellow_underline;

							@media(max-width:$Breakpoint-Mobile){
								font-size:24px;
								line-height:24px;
							}
						}

						p{
							font-size:$FontSize-BodySmall;
							line-height:$LineHeight-BodySmall;

							@media(max-width:$Breakpoint-Mobile){
								font-size:$FontSize-BodySmallMobile;
								line-height:$LineHeight-BodySmallMobile;
							}
						}

						&:after{
							content:'\e145';
							width:35px;
							height:35px;
							border:2px solid $Color-DarkBlue;
							text-align: center;
							font-family: $Font-MaterialSymbols;
							color:$Color-DarkBlue;
							border-radius:999px;
							position:absolute;
							right:24px;
							top:50%;
							transform:translateY(-50%);
							font-size:28px;
							line-height:30px;
							transition:all .25s ease-in;


							@media(max-width:$Breakpoint-Mobile){
								width:32px;
								height:32px;
								font-size:26px;
							}
						}
					}


					&:hover{
						.staff_name_title{
							strong{
								@include yellow_underline_hover;
							}
						}

						.staff_name_title{
							&:after{
								background-color:$Color-DarkBlue;
								color:$Color-White;
							}
						}
					}
				}
			}
		}
	}
}

/*# Cr. ACCORDION / DISTRICTS #*/
.accordion_container{

	.accordion_inner_container{

		.accordion{

			.accordion-item{
				margin-bottom: 12px;
				border:0;
				.accordion-header{
					border:0;
					.accordion-button{
						padding:24px 32px;
						padding-right:78px;
						background:none;
						background-color:$Color-LighterGrey;
						color:$Color-DarkBlue;
						font-size:32px;
						line-height:32px;
						font-family: $Font-ZainBold;
						border:0;
						position:relative;
						box-shadow: none;
						border-radius:12px;

						@media(max-width:$Breakpoint-Mobile){
							font-size:24px;
							line-height:24px;
						}

						&:after{
							content:'\e15b';
							font-family: $Font-MaterialSymbols;
							color:$Color-DarkBlue;
							position:absolute;
							top:24px;
							right:32px;
							background:none;
							transform: none;
						}

						&.collapsed:after{
							content:'\e145';
						}
					}

				}

				.accordion-collapse{
					border:0;
					background-color:$Color-LighterGrey;
					color:$Color-DarkBlue;
					.accordion-body{
						border:0;
						padding:24px 32px;
						padding-top:0;
					}
				}
			}
		}


	}


}

.distict_details{

	h4{
		font-size:28px;
		line-height: 28px;
	}

	> p{
		margin-bottom: 24px;
	}

	.district_team_member{
		display:inline-block;
		width:100%;
		margin-bottom: 24px;
		&:last-child{
			margin-bottom: 0;
		}

		p, a{
			font-size:16px;
			line-height:28px;
		}
	}
}

.district_cities{
	.col{
		max-width:25%;
		flex:0 0 25%;

		@media(max-width:$Breakpoint-Mobile){
			max-width:50%;
			flex:0 0 50%;
		}
	}
}

/*# Cs. CARDS CAROUSEL #*/
.card_carousel_container{

	.card_carousel_inner_container{

		.card_carousel{
			overflow: hidden;
			position: relative;
			padding:0;
			opacity:0;
			transition-property: opacity;
			transition-duration: 0.25s;
			transition-timing-function: ease-out;

			margin-right: calc(((100vw - 1440px) / 2) * -1); //get a single side margin width and move the slider over that length

			@media(max-width:$Breakpoint-StandardBodyWidth)
			{
				margin-right:-24px; //fix this
			}

			&.show{
				opacity:1;
			}

			.slick-list {
				margin-right: 0;
				padding-right: calc(((100vw - 1440px) / 2) - 30px); //account for card padding too
				padding-bottom: 0;
				margin-left:-15px; //account for card padding

				@media(max-width:$Breakpoint-StandardBodyWidth)
				{
					padding-right: 50px;
				}
			}

			.slick-slide {
				padding:15px;
				height:initial;
			}

			.slick-track{
				display: flex !important;
			}
		}
	}
}



/*# Ct. FEATURED RESOURCES #*/
.featured_resources_container{
	.featured_resources_inner_container{
		margin-bottom: 48px;

		@media(max-width:$Breakpoint-MobileNavigation){
			margin-bottom:16px;
		}

		> .row{

			margin-bottom: 48px;

			@media(max-width:$Breakpoint-MobileNavigation){
				margin-bottom:16px;
			}

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}
}




/*# Cu. FEATURED PRODUCTS #*/
.latest_products_container {

	.latest_products_inner_container{
		.row{

			.col{
				flex:0 0 25%;
				max-width: 25%;

				@media(max-width:$Breakpoint-MobileNavigation){
					flex:0 0 50%;
					max-width: 50%;
					margin-bottom: 16px;
				}

				@media(max-width:$Breakpoint-600){
					flex:0 0 100%;
					max-width: 100%;
				}

			}
		}
	}
}







/*BACKGROUNDS*/
.darkblue_pattern_bg{
	background:url('../IMG/Backgrounds/quicklinks_bgpattern_desktop.png') no-repeat center center / cover $Color-DarkBlue;
	background-blend-mode: color-burn, normal;
}

.blue_pattern_bg{
	background:url('../IMG/Backgrounds/quicklinks_bgpattern_desktop.png') no-repeat center center / cover $Color-BlueSecondary;
	background-blend-mode: color-burn, normal;
}

.lightblue_pattern_bg{
	background:url('../IMG/Backgrounds/quicklinks_bgpattern_desktop.png') no-repeat center center / cover $Color-LightBlue;
	background-blend-mode: multiply, normal;

	//Banner caption
	.banner_caption{
		color:$Color-DarkBlue !important;
		h1, p{
			color:$Color-DarkBlue !important;
		}
	}

	//Section Title
	.section_title_container{
		.section_title_inner_container{
			h2, p, .section_subtitle{
				color:$Color-DarkBlue !important;
			}
			.section_subtitle{
				&:before{
					background-color:$Color-DarkBlue !important;
				}
			}
		}
	}

	//Quick Link Items
	.quick_link_item_container{
		&:hover{
			background-color:$Color-DarkBlue !important;
			.title{
				color:$Color-White !important;
			}
		}
	}
}


.yellow_pattern_bg{
	background:url('../IMG/Backgrounds/quicklinks_bgpattern_desktop.png') no-repeat center center / cover $Color-Yellow;
	background-blend-mode:multiply, normal;

	//Banner caption
	.banner_caption{
		color:$Color-DarkBlue !important;
		h1, p{
			color:$Color-DarkBlue !important;
		}
	}

	//Section Title
	.section_title_container{
		.section_title_inner_container{
			h2, p, .section_subtitle{
				color:$Color-DarkBlue !important;
			}
			.section_subtitle{
				&:before{
					background-color:$Color-DarkBlue !important;
				}
			}
		}
	}

	//Quick Link Items
	.quick_link_item_container{
		&:hover{
			background-color:$Color-DarkBlue !important;
			.title{
				color:$Color-White !important;
			}
		}
	}

}

.teal_pattern_bg{
	background:url('../IMG/Backgrounds/quicklinks_bgpattern_desktop.png') no-repeat center center / cover $Color-Teal;
	background-blend-mode:multiply, normal;
}




/*#####################*/
/*### D. FOOTER ###*/
/*#####################*/
.footer_container{
	background-color:$Color-DarkBlue;
	color:$Color-White;
	padding-top:48px;
	padding-bottom: 24px;


	a:not(.solid_round_button){
		color:$Color-White;
		text-decoration: none;
		&:hover{
			text-decoration: underline;
		}
	}

	.footer_inner_container{

		.footer_top_container{
			padding-bottom: 24px;
			.row{
				> .col{
					flex:0 0 50%;
					max-width:50%;

					@media(max-width:$Breakpoint-Mobile)
					{
						flex:0 0 100%;
						max-width: 100%;
						margin-bottom:24px;

						&:last-child{
							margin:0;
						}
					}
				}

				.footer_logos{
					display:inline-block;
					width:100%;
					margin-bottom: 32px;
					a{
						margin-bottom: 10px;
						display:inline-block;
						img{
							display:inline-block;
							max-width: 184px;
							transition:all .25s ease-in;
							&:first-child{
								margin-right:24px;
							}
							&:hover{
								transform: scale(1.05);
							}
						}


					}

				}

				.footer_text{
					display:inline-block;
					width:100%;
					margin-bottom: 16px;
					p{
						font-size:$FontSize-BodySmall;
						line-height:$LineHeight-BodySmall;
					}
				}

				.footer_navigation{
					margin-bottom: 32px;
					> .col{
						max-width:33.33%;


						.footer_nav_expand{
							text-transform: uppercase;
							margin-bottom: 16px;
							display:block;
							font-weight: bold;
							font-size:$FontSize-BodySmall;
							line-height:$LineHeight-BodySmall;
							cursor: default;
							&:hover{
								text-decoration: none;
							}
						}

						.footer_nav_items{
							ul{
								padding:0;
								margin:0;
								li{
									list-style: none;
									margin-bottom: 16px;
									&:last-child{margin-bottom: 0;}
									a{
										font-size:$FontSize-BodySmall;
										line-height:$LineHeight-BodySmall;
										text-decoration: none;
										&:hover{
											text-decoration: underline;
										}
									}
								}
							}
						}

						@media (max-width:$Breakpoint-MobileNavigation)
						{
							max-width:100%;
							flex:0 0 100%;
							border-bottom: 1px solid $Color-FaintDarkBlue;
							padding-bottom:10px;
							padding-top:10px;
							&:first-child{
								border-top: 1px solid $Color-FaintDarkBlue;
							}

							.footer_nav_expand{
								font-weight: normal;
								position:relative;
								padding:0;
								padding-right:30px;
								margin:0;
								text-transform: capitalize;
								cursor: pointer;

								&:after{
									content:'\e145';
									font-family: $Font-MaterialSymbols;
									color:$Color-White;
									position:absolute;
									right:0;
									top:0;
									font-size:24px;
								}

								&.show{
									&:after{
										content:'\e15b';
									}
								}
							}

							.footer_nav_items{
								overflow:hidden;
								width:100%;
								max-height: 0px;
								transition:all 0.25s ease-in;
								&.show{
									max-height:200px;
								}
								ul{
									padding-top:16px;
									li{
										a{
											font-size:14px;
										}
									}
								}
							}

						}

					}
				}

				.footer_social_media{
					text-align: right;
					display:inline-block;
					width:100%;

					@media (max-width:$Breakpoint-Mobile)
					{
						text-align: left;
					}

					a{
						display:inline-block;
						margin-right:8px;
						img{
							max-width:30px;
							transition:all .25s ease-in;
							&:hover{
								transform: scale(1.05);
							}
						}
						&:last-child{
							margin:0;
						}
					}
				}
			}
		}

		.footer_bottom_container{
			padding-top:24px;
			border-top: 1px solid $Color-FaintDarkBlue;
			font-size:$FontSize-BodySmall;
			line-height:$LineHeight-BodySmall;

			@media (max-width:$Breakpoint-MobileNavigation)
			{
				.col{
					flex:0 0 100%;
					margin-bottom: 16px;
					text-align: left !important;
					&:last-child{
						margin:0;
					}
				}
			}
		}

	}
}










/*#####################*/
/*### Z. FORMS ###*/
/*#####################*/

small{
	font-size:12px;
	line-height:24px;
	display:inline-block;
	font-weight: 400;
	color:$Color-SilverBlue;
}

label{
	font-size:16px;
	line-height:29px;
	font-family: $Font-Lato;
	font-weight: 700;
	margin-bottom: 4px;

	@media(max-width:$Breakpoint-Mobile){
		font-size:14px;
		line-height:24px;
	}

	small{
		font-weight: 400;
	}
}

input.form-component{
	&[type=text], &[type=password], &[type=email]{
		height: 40px;
		padding: 0px 16px;
		border-radius:4px;
		border: 1px solid $Color-LightGreySecondary;
		font-size:18px;
		line-height:28px;
		color:$Color-DarkBlue;
		display:inline-block;
		width:100%;

		&::placeholder{
			font-size:18px;
			line-height:28px;
			color:$Color-DarkGrey;
		}

		@media(max-width:$Breakpoint-Mobile){
			font-size:16px;
			line-height:26px;
		}
	}
}

.dropdown{

	.dropdown-toggle{
		display:inline-block;
		width:100%;
		position:relative;
		padding:0 16px;
		padding-right:40px;
		height:40px;
		border-radius:4px;
		border: 1px solid $Color-LightGreySecondary;
		background:none;
		background-color:$Color-White;
		color:$Color-SilverBlue;
		text-align: left;

		&:focus, &:active, &:hover{
			box-shadow: none;
			color:$Color-DarkBlue;
		}

		&:after{
			content:'\e5cc';
			font-family: $Font-MaterialSymbols;
			color:$Color-DarkBlue;
			position:absolute;
			right:10px;
			top:0;
			text-decoration: none;
			border:0;
			transform: rotate(90deg);
			font-size: 30px;
			line-height: 40px;
			transition: all 0.10s ease-in;
		}

		&.show{
			&:after{
				content:'\e5cc';
				transform: none;
			}
		}
	}

	.dropdown-menu{
		top:38px !important;
		left:0 !important;
		transform:none !important;
		width:100%;
		border-radius: 0;
		padding:0;
		margin:0;
		inset:initial !important;
		li{
			padding:0;
			margin:0;
			list-style: none;
			a{
				padding:10px 16px;
				&:hover{
					background-color:$Color-LightGrey;
					color:$Color-DarkBlue;
				}
			}
		}
	}
}

.checkbox{
	padding:4px 0;

	[type=checkbox]:not(:checked), [type=checkbox]:checked {
		position: absolute;
		left: -9999px;
		opacity: 0;
	}

	[type=checkbox]:focus + label {
		outline: thin dotted;
		outline: 5px auto -webkit-focus-ring-color;
		outline-offset: -2px;
	  }

	[type=checkbox]:not(:checked) + label,
   [type=checkbox]:checked + label {
		padding:0;
		margin:0;
		position: relative;
		padding-left: 30px;
		font-size: 16px;
		line-height: 28px;
		cursor: pointer;
		color: $Color-SilverBlue;
		font-family: $Font-Lato;
		font-weight: 400;
		display: inline-block;
		width: 100%;
		text-transform: none;
		border: 0;
	}

	[type=checkbox]:not(:checked) + label:before,
	[type=checkbox]:checked + label:before {
		content: "";
		position: absolute;
		left: 0;
		top: 4px;
		width: 20px;
		height: 20px;
		background: #FFFFFF;
		border-radius:4px;
		border: 1px solid $Color-Grey;
		-webkit-transition: all 0.275s;
		transition: all 0.275s;
	}

	[type=checkbox]:not(:checked) + label:after {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	[type=checkbox]:not(:checked) + label:after,
	[type=checkbox]:checked + label:after {
		content: "done";
		font-family: $Font-MaterialSymbols;
		color: $Color-DarkBlue;
		position: absolute;
		top: 14px;
		left: 0px;
		font-size: 24px;
		font-weight: bold;
		line-height: 0;
		-webkit-transition: all 0.25s;
		transition: all 0.25s;
	}

	[type=checkbox]:checked + label:before {
		border-color: $Color-SilverBlue;
	}

	[type=checkbox]:checked + label:after {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}

	[type=checkbox]:checked + label {
		color:$Color-DarkBlue;
	}

	[type=checkbox]:focus + label {
		outline: unset;
	}

}

.radio{
	padding:4px 0;

	[type=radio]:not(:checked), [type=radio]:checked {
		position: absolute;
		left: -9999px;
		opacity: 0;
	}

	[type=radio]:focus + label {
		outline: thin dotted;
		outline: 5px auto -webkit-focus-ring-color;
		outline-offset: -2px;
	  }

	[type=radio]:not(:checked) + label,
   [type=radio]:checked + label {
		padding:0;
		margin:0;
		position: relative;
		padding-left: 30px;
		font-size: 16px;
		line-height: 28px;
		cursor: pointer;
		color: $Color-SilverBlue;
		font-family: $Font-Lato;
		font-weight: 400;
		display: inline-block;
		width: 100%;
		text-transform: none;
		border: 0;
	}

	[type=radio]:not(:checked) + label:before,
	[type=radio]:checked + label:before {
		content: "";
		position: absolute;
		left: 0;
		top: 4px;
		width: 20px;
		height: 20px;
		background: #FFFFFF;
		border-radius:999px;
		border: 1px solid $Color-Grey;
		-webkit-transition: all 0.275s;
		transition: all 0.275s;
	}

	[type=radio]:not(:checked) + label:after {
		opacity: 0;
		-webkit-transform: scale(0);
		transform: scale(0);
	}

	[type=radio]:not(:checked) + label:after,
	[type=radio]:checked + label:after {
		content:'';
		background-color:$Color-DarkBlue;
		width:15px;
		height:15px;
		position: absolute;
		top: 6px;
    	left: 3px;
		border-radius: 999px;
		-webkit-transition: all 0.25s;
		transition: all 0.25s;
	}

	[type=radio]:checked + label:before {
		border-color: $Color-SilverBlue;
	}

	[type=radio]:checked + label:after {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}

	[type=radio]:checked + label {
		color:$Color-DarkBlue;
	}

	[type=radio]:focus + label {
		outline: unset;
	}

}

.form_container{

	.fields_group{
		display:inline-block;
		width:100%;
		margin-bottom: 24px;

		&:last-child{
			margin:0;
		}
	}

}















/*OVERWRITE AOS STYLES ON TABLET/MOBILE

.animated {
	-o-transition-property: none !important;
	-moz-transition-property: none !important;
	-ms-transition-property: none !important;
	-webkit-transition-property: none !important;
	transition-property: none !important;

	-o-transform: none !important;
	-moz-transform: none !important;
	-ms-transform: none !important;
	-webkit-transform: none !important;
	transform: none !important;

	-webkit-animation: none !important;
	-moz-animation: none !important;
	-o-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
}
[data-aos^="fade"][data-aos^="fade"],
[data-aos^="zoom"][data-aos^="zoom"] {
	opacity: 1 !important;
}
[data-aos="zoom-in"] {
	transform: scale(1) !important;
}
*/