/* TAGLINE */
body .taglineoverlay {
	bottom: 160px;

	.fixed {
		color: white;
		font-size: calc(var(--fs3) + 3px);
		text-transform: uppercase;
		font-family: var(--font-cursive);
		letter-spacing: 0.24em;

		&>span {
			color: rgb(var(--color2));
		}
	}
}

/* HOME PAGE TYPOGRAPHY*/
body.homePageStyle .bloqTitle {
	padding-bottom: 8px;

	&::before {
		content: '';
		position: absolute;
		width: 70px;
		height: 2px;
		border-radius: 20px;
		bottom: 0;
	}
}

/* HOME WELCOME */
section.homewelcome.ParagraphBloq {
	margin: 0 33px;
	background-color: rgb(var(--color1));
	--welcome-max-width: 950px;
	padding: 90px 20px;
	z-index: 1;

	&>h2.bloqTitle {
		text-align: center;
		position: relative;
		margin-bottom: 60px;
		padding-bottom: 9px;

		&>span {
			color: white;
		}

		&::before {
			background-color: white;
			left: 50%;
			transform: translateX(-50%);
		}
	}

	&>div.Welcome div.WelcomeFlex {
		padding-left: min(var(--welcome-max-width) / 2.82, 33.5%);
		min-height: calc((var(--welcome-max-width) / 2.82) * 0.75);
		padding-right: 0;

		&>label {
			right: calc(50% + 40px);
			transform: translateX(50vw);
			left: auto;
			top: calc((var(--n) * 48px) - 200px);
			font-size: 14px;
			font-weight: 700;
			border: 1px solid rgb(var(--color2));
			background-color: transparent;
			color: white;
			padding: 7px 14px;
			width: 223px;
			border-radius: 0;

		}

		&>.ItemImage {
			left: 0;
			right: auto;
			width: 33.5%;

			&>.ItemBefore {
				width: 75%;
				margin-left: auto;

			}

			&::before {
				content: '';
				position: absolute;
				width: 44%;
				height: 100%;
				top: -9%;
				left: 0;
				background-image: var(--watermarkwhite);
				background-position: 0% 0%;
				background-size: contain;
				background-repeat: no-repeat;
				opacity: 0.2;
			}
		}

		&>.ItemContent {
			padding-right: 0px;
			padding-left: 40px;

			&>.paracontent {
				color: white;
			}
		}

		&>.LinkWrapper {
			padding-left: 40px;
			padding-right: 0px;

			&>.buttonstyle {
				color: white;
			}
		}

		&>input:checked+label {
			background-color: rgb(var(--color2));
		}
	}
}



section.greensvg {
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 200px;
	padding: 0 !important;
	z-index: 2;
}

section.redsvg {
	position: absolute;
	bottom: 0px;
	right: 0px;
	width: 180px;
	padding: 0 !important;
}


section.greensvg #Layer_1 {
	stroke-dashoffset: 839;
	stroke-dasharray: 839;
	animation: draw 3.5s ease-in-out forwards;
}

section.redsvg #Layer_2 {
	stroke-dashoffset: 648;
	stroke-dasharray: 648;
	animation: draw2 3.5s ease-in-out forwards;
}

@keyframes draw {
	from {
		stroke-dashoffset: -839
	}

	to {
		stroke-dashoffset: 0;
	}
}

@keyframes draw2 {
	from {
		stroke-dashoffset: -648
	}

	to {
		stroke-dashoffset: 0;
	}
}

div.welcomewrapper {
	position: relative;
	padding-bottom: 100px;
}

/* QUICK LINKS */
section.homequicklinks div.Grid>ul {
	display: flex;
	justify-content: center;
	gap: 45px;

	li {
		flex: 1 1 auto;
		max-width: 305px;

		&>.Item {
			height: 305px;

			&>.ItemInner {
				background-color: rgba(var(--grey0), .4);
				border: 5px solid rgb(var(--color2));
				border-width: 0px;
				transition: 0.4s;

				&>.Title {
					position: absolute;
					left: 50%;
					top: 74%;
					transform: translate(-50%, -50%);
					text-transform: uppercase;
					font-size: 24px;
					letter-spacing: 0.2em;
					font-family: var(--font-cursive);
					transition: 0.4s;

					&::before {
						content: 'EXPLORE';
						font-family: var(--font-normal);
						letter-spacing: 0;
						font-size: 12px;
						font-weight: 900;
						position: absolute;
						left: 50%;
						bottom: -39px;
						transform: translateX(-50%);
						transition: 0.4s;
						opacity: 0;
					}
				}

				&>.ItemIcon {
					background-color: transparent;
					font-size: 0;
					line-height: 0;
					position: absolute;
					top: calc(50% - 50px);
					left: 50%;
					transform: translate(-50%, -50%);
					background-image: var(--sun);
					background-size: contain;
					background-repeat: no-repeat;
					background-position: 50% 50%;
					width: 34px;
					height: 34px;
					opacity: 0;
					transition: 0.4s;
				}
			}

			&:hover {
				&>.ItemInner {
					border-width: 9px;

					&>.Title {
						top: 50%;

						&::before {
							opacity: 1;
						}
					}

					&>.ItemIcon {
						opacity: 1;
					}
				}
			}
		}
	}

	&::before {
		content: '';
		position: absolute;
		width: calc(100% - 60px);
		height: 230px;
		bottom: 0;
		left: 30px;
		background-color: rgb(var(--color6));
	}
}

/* EVENTS */
body section.homeevents.mod_bullets_slider {
	--SliderItemMinWidth: 260px;
	--SliderRowHeight: 185px;
	background-color: rgb(var(--color6));
	margin: 0 30px !important;
	overflow: hidden;

	&>h2.bloqTitle {
		text-align: left;
		max-width: 1010px;
		margin-bottom: 55px;
		position: relative;

		&::before {
			background-color: rgb(var(--color1));
		}
	}

	&>.filterSourceSideBySideButtons .sourceButtonWrapper {
		right: calc(86px + max(calc(50vw - 535px), 0px));
		left: auto;
		transform: translateX(0);
		width: fit-content;
		bottom: auto;
		bottom: 414px;

		&>a {
			width: auto;
			display: inline-grid;
			place-items: center;
			background-color: rgba(var(--button-background-color), 1);
			padding: var(--button-padding);
			font-size: var(--button-font-size);
			color: rgb(var(--color1));
			cursor: pointer;
			text-decoration: none;
			text-align: center;
			text-transform: var(--button-text-transform);
			border: var(--button-border);
			margin: var(--button-gap);
			border-radius: var(--button-border-radius);
			font-family: var(--button-font-family);
			font-weight: var(--button-font-weight);
			line-height: 1.5em;
			min-width: 150px;
			height: auto;
			bottom: 25px;

			&:hover {
				background-color: rgb(var(--color2));
				color: white;
			}
		}
	}

	&>div.Slider {
		max-width: 1010px;

		&>.nav {
			bottom: auto;
			top: -103.5px;

			&.next {
				right: 50px;
			}

			&.last {
				left: auto;
				right: 262px;
			}
		}

		&>.SliderInner>ul>li {
			&>.Item {
				&>.ItemInner {
					&>.ItemDate {
						font-family: var(--font-cursive);
						font-size: 22px;
						text-transform: uppercase;
						letter-spacing: 0.1em;
						left: 64px;

						&> :nth-child(n+3) {
							display: none;
						}
					}

					&>.Title {
						font-size: 18px;
						padding-left: 55px;
					}



					&>.ItemContent .paracontent .cardBottomLinks a {
						width: auto;
						display: inline-grid;
						place-items: center;
						background-color: rgba(var(--button-background-color), 1);
						padding: var(--button-padding);
						font-size: var(--button-font-size);
						color: rgb(var(--color1));
						cursor: pointer;
						text-decoration: none;
						text-align: center;
						text-transform: var(--button-text-transform);
						border: var(--button-border);
						margin: var(--button-gap);
						border-radius: var(--button-border-radius);
						font-family: var(--button-font-family);
						font-weight: var(--button-font-weight);
						line-height: 1.5em;
						min-width: 150px;
						height: auto;
						bottom: 25px;
						left: 56px;

						&:hover {
							background-color: rgb(var(--color2));
							color: white;
						}

						&::before {
							opacity: 1;
						}

						&::after {
							display: none;
						}
					}
				}

				&::before {
					content: '';
					position: absolute;
					width: 33px;
					height: 33px;
					background-image: var(--sun);
					background-size: contain;
					background-repeat: no-repeat;
					background-position: 50% 50%;
					background-color: transparent;
					left: 8px;
					top: -5px;
				}

				&::after {
					content: '';
					background-color: rgb(var(--color1));
					width: 1px;
					height: 100%;
					position: absolute;
					left: 24px;
					top: 28px;
					z-index: 2;
				}
			}
		}

		&::before {
			top: 205px;
			left: 24px;
		}
	}
}

body section.mod_overlap_slider.homedataslider {
	--SliderRowHeight: 405px;
	--SliderItemMinWidth: 280px;
	--SliderGridGap: 20px;
	padding-bottom: 180px !important;

	&>h2.bloqTitle {
		position: relative;

		&>span {
			color: white;
		}

		&::before {
			background-color: white;
		}
	}

	&>.filterSourceSideBySideButtons {
		position: absolute;
		bottom: 120px;
		right: 190px;
		width: fit-content;

		&>.sourceButtonWrapper {
			padding-right: 0;

			&>a {
				background-color: transparent;
				padding: var(--button-padding);
				font-size: var(--button-font-size);
				color: white;
				cursor: pointer;
				text-decoration: none;
				text-align: center;
				text-transform: var(--button-text-transform);
				border: 1px solid rgb(var(--color2));
				margin: 0 0 0 15px;
				border-radius: var(--button-border-radius);
				font-family: var(--button-font-family);
				font-weight: var(--button-font-weight);
				line-height: 1.5em;
				height: auto;
				color: white;

				&:hover {
					background-color: rgb(var(--color2));
				}

				&::before {
					content: 'VIEW NEWS';
					font-family: var(--font-normal);
				}
			}

			&>a:nth-child(2) {
				&::before {
					content: 'facebook';
				}
			}
		}
	}

	&>h2.bloqTitle {
		padding-top: 70px;
	}

	&>div.Slider {
		margin: 30px -190px 0;

		&>.nav {
			top: auto;
			bottom: -50px;
			color: white;

			&.next {
				right: calc(50% - 50vw + 138px);
			}

			&.last {
				left: auto;
				right: calc(50% - 50vw + 525px);

			}
		}

		&>.SliderInner ul li {
			--color: var(--color4);

			&>.Item {
				&>.ItemInner {
					border: 4px solid white;
					border-color: white;
					border-radius: 10px;
					overflow: hidden;
					padding-bottom: 50px;

					&>.ItemIcon {
						color: white;
						background-color: transparent;
						border: 1px solid white;
						transition: 0.4s;
					}

					&>.ItemDate {
						font-family: var(--font-cursive);
						letter-spacing: 0.15em;
						margin-bottom: 7px;

					}

					&>.Title {
						font-weight: 900;
						font-size: 20px;
						margin-bottom: 14px;
					}

					&>.ItemContent .paracontent {
						font-size: 15px;
						overflow: visible;
						padding-bottom: 60px;
						position: relative;

						&::before {
							content: 'READ MORE';
							width: auto;
							display: inline-grid;
							place-items: center;
							background-color: transparent;
							padding: var(--button-padding);
							font-size: var(--button-font-size);
							color: white;
							cursor: pointer;
							text-decoration: none;
							text-align: center;
							text-transform: var(--button-text-transform);
							border: 1px solid white;
							margin: var(--button-gap);
							border-radius: var(--button-border-radius);
							font-family: var(--button-font-family);
							font-weight: var(--button-font-weight);
							line-height: 1.5em;
							height: auto;
							position: absolute;
							left: 0;
							bottom: -28px;
							width: 118px;
							min-width: 1px;

							&:hover {
								background-color: white;
								color: rgb(var(--color));
							}
						}
					}

					&::before {
						transition: 0s;
					}
				}

				&:hover {
					&>.ItemInner {
						border-color: rgba(var(--color), 0.85);

						&>.ItemIcon {
							background-color: white;
							color: rgb(var(--color));
						}

						&::before {
							background: rgba(var(--color), 0.85) !important;
						}
					}
				}
			}

			&[data-title="Facebook"] {
				--color: var(--color5)
			}
		}
	}
}

div.facebookwrapper {
	position: relative;
	background-color: rgb(var(--color1));

	&>section.greensvg2section {
		position: absolute;
		right: 0;
		top: 100px;
		width: 210px;
	}
}

section.greensvg2section #Layer_3 {
	stroke-dashoffset: 806;
	stroke-dasharray: 806;
	animation: draw3 3.5s ease-in-out forwards;
}

section.redsvg2section #Layer_4 {
	stroke-dashoffset: 624;
	stroke-dasharray: 624;
	animation: draw4 3.5s ease-in-out forwards;
}

@keyframes draw3 {
	from {
		stroke-dashoffset: -806
	}

	to {
		stroke-dashoffset: 0;
	}
}

@keyframes draw4 {
	from {
		stroke-dashoffset: -624
	}

	to {
		stroke-dashoffset: 0;
	}
}

div.lowerwrapper {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	margin: 0 auto;
	max-width: 1280px;
	position: relative;
	padding-bottom: 130px;
	margin-top: -100px;

	&>section {
		flex: 1 1 50%;
		width: 50%;

		&.homequote {
			background-color: rgb(var(--color6));
			padding: 30px 45px;
			border-radius: 7px;

			&>div.Blockquote ul li .Item .ItemInner {
				display: flex;
				flex-direction: column-reverse;

				&>.ItemContent .paracontent {
					font-family: var(--font-cursive);
					font-size: var(--fs1);
					color: rgb(var(--color1));
					font-weight: 300;
				}

				&>.Title {
					font-size: 14px;
					text-transform: uppercase;
					color: rgb(var(--color3));
					font-weight: 700;
					margin-top: 100px;
				}
			}
		}

		&.homealumni {
			--SliderRowHeight: 110px;
			--SliderItemMinWidth: 300px;
			padding: 0 65px;
			--grid-gap: 18px;

			&>div.Slider {
				padding: 0 0 100px 0 !important;

				&>.nav {
					top: auto;
					bottom: 0;

					&.last {
						left: auto;
						right: 65px;
					}

					&.next {
						right: 18px;
					}
				}

				&>.SliderInner>ul>li .Item {
					border-radius: 0;
					width: calc(100% - 36px);
					margin-left: 18px;
					transition: 0.4s;

					&>.ItemInner {
						height: 100% !important;
						background-color: rgb(var(--color2));

						&>.ItemIcon {
							display: none;
						}

						&>h3.Title {
							margin: 0;
							position: absolute;
							top: 24px;
							left: 126px;
							font-size: 25px;
							font-family: var(--font-cursive);
							text-transform: uppercase;
							letter-spacing: 0.2em;
							min-width: fit-content;
							color: white;
						}

						&>.ItemSubtitle {
							margin: 0;
							position: absolute;
							top: 64px;
							left: 126px;
							font-size: 14px;
							text-transform: uppercase;
							font-weight: 700;
							color: white;
						}

						&>.ItemContent .paracontent .cardBottomLinks {
							height: 100%;
							border-top: none;
						}
					}

					&>.ItemBefore {
						background-color: transparent;
						top: 0 !important;
						left: 0 !important;
						right: 0 !important;
						bottom: 0 !important;

						&>img {
							object-fit: contain;
							margin: auto;
							object-position: 50% 50% !important;
							transition: .2s;
							position: absolute;
							z-index: 1;
							width: 75px;
							height: 75px;
							border-radius: 50%;
							object-fit: cover;
							top: 50%;
							transform: translateY(-50%);
							left: 30px;
						}
					}

					&:hover {
						margin-left: 0;
						width: 100%;

						&>.ItemInner {
							background-color: rgb(var(--color1));
						}
					}
				}
			}

			&::before {
				content: '';
				position: absolute;
				width: 180px;
				height: 180px;
				right: 10px;
				top: -80px;
				background-image: var(--watermarkblack);
				background-size: contain;
				background-position: 50% 50%;
				background-repeat: no-repeat;
				opacity: 0.07;

			}
		}
	}

	&>section.redsvg2section {
		position: absolute;
		width: 265px;
		left: calc(50% - 50vw);
		bottom: -6px;
	}
}

.lowerwrapper .biopopup {
	top: 50%;

	&>.popupInner {
		display: flex;
		background-color: rgb(var(--color2));
		border-radius: 0;
		padding: 70px 40px !important;
		max-height: 100vh;

		&>.popupHeader {
			display: flex;
			flex-direction: column;
			align-items: center;
			text-align: center;
			flex: 1 1 50%;
			padding-right: 10px;

			&>label {
				--nav-size: 50px;
				background-color: white !important;
				border-color: white !important;
				border-radius: 50%;

				&::before,
				&::after {
					background-color: rgb(var(--color2)) !important;
				}
			}

			&>.popupTitle {
				font-size: 25px;
				font-family: var(--font-cursive);
				text-transform: uppercase;
				letter-spacing: 0.2em;
				position: relative;
				padding-top: 50px !important;
				color: white;

				&::before {
					content: '';
					position: absolute;
					width: 30px;
					height: 30px;
					background-image: var(--watermarkwhite);
					background-position: 50% 50%;
					background-size: contain;
					background-repeat: no-repeat;
					top: 0;
					left: 50%;
					transform: translateX(-50%);
				}

			}

			&>.staffsubtitle {
				display: block !important;
				font-size: 14px;
				text-transform: uppercase;
				font-weight: 700;
				color: white;
			}

			&::before {
				content: '';
				width: 170px;
				min-height: 170px;
				background-image: var(--item-image);
				background-position: 50% 50%;
				background-size: cover;
				border-radius: 50%;
				order: 1;
				margin-top: 33px;
			}
		}

		&>.popupContent {
			flex: 1 1 50%;
			color: white;
			padding-left: 30px;
			border-left: 1px solid white;
		}
	}
}

div.homesvg {
	display: none;
}


@media only screen and (max-width: 1200px) {
	body .taglineoverlay {
		.fixed {
			font-size: calc(var(--fs3) - 12px);
		}
	}

	div.welcomewrapper {

		&>section.greensvg,
		&>section.redsvg {
			display: none !important;
		}

		section.homewelcome.ParagraphBloq {
			margin: 0 0;
			padding: 40px 20px 90px 20px;

			&>h2.bloqTitle {
				padding: 130px 20px 9px 20px;
				margin-bottom: 0px;
			}

			&>div.Welcome div.WelcomeFlex {
				padding-left: 0;
				position: static;

				&>label {
					right: 0;
					transform: translateX(0);
					top: calc((var(--n) * 48px) - 20px);
					position: absolute !important;
					margin: 0 !important;
				}

				&>.ItemImage {
					display: none;
				}

				&>.ItemContent,
				.LinkWrapper {
					padding-left: 0;
				}
			}
		}
	}

	body.homePageStyle .bloqTitle {
		--hp-bloq-font-size: calc(var(--fs1) - 10px);
	}

	section.homequicklinks div.Grid>ul {
		&::before {
			width: 100%;
			left: 0;
		}
	}

	body section.homeevents.mod_bullets_slider {
		margin: 0 0 !important;

		&>h2.bloqTitle {
			margin: 0 auto 120px auto;
			text-align: center;

			&::before {
				left: 50%;
				transform: translateX(-50%);
			}
		}

		&>.filterSourceSideBySideButtons .sourceButtonWrapper {
			right: 50%;
			transform: translateX(50%);
			bottom: 398px;
		}

		&>div.Slider {
			&>.nav {
				transform: translateX(50%);
				top: -87.5px;

				&.last {
					right: calc(50% + 110px);
				}

				&.next {
					right: calc(50% - 110px);
				}
			}
		}
	}

	body div.facebookwrapper {
		&>section.greensvg2section {
			display: none !important;
		}

		&>section.mod_overlap_slider.homedataslider {
			&>.filterSourceSideBySideButtons {
				right: 50%;
				transform: translateX(50%);
				bottom: 94px;

				&>.sourceButtonWrapper {
					flex-direction: column;
					gap: 20px;

					&>a {
						margin: 0;
					}
				}
			}

			&>div.Slider {
				margin: 30px -0px 0;

				&>.nav {
					transform: translateX(50%);

					&.last {
						right: calc(50% + 150px);
					}

					&.next {
						right: calc(50% - 150px);
					}
				}
			}
		}
	}

	div.lowerwrapper {
		margin-top: 0;
		flex-direction: column;
		align-items: center;

		&>section.redsvg2section {
			display: none !important;
		}

		&>section {
			width: 100%;
			&.homequote{
				padding: 30px 45px;
				& > div.Blockquote ul li .Item .ItemInner {
					&>.Title{
						margin-top: 40px;
					}
                &>.ItemContent .paracontent{
					font-size: var(--fs3);
				}
			}
			}
			&.homealumni {
				padding: 0 0;
				max-width: 500px;

				&>div.Slider {
					&>.SliderInner>ul>li .Item {
						&>.ItemBefore img {
							left: 15px;
						}

						&>.ItemInner {
							&>h3.Title {
								left: 100px;
								font-size: 15px;
								width: calc(100% - 100px);
								text-align: left;
							}
							&>.ItemSubtitle{
								font-size: 13px;
								left: 100px;
								text-align: left;
							} 
						}
					}
				}
			}
		}
	}
}