@font-face {
	font-family: "Arial";
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url("fonts/arial.woff") format("opentype"), url("fonts/arial.ttf") format("truetype");
}

@font-face {
	font-family: "Arial Bold";
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url("fonts/arialbd.woff") format("opentype"), url("fonts/arialbd.ttf") format("truetype");
}

@font-face {
	font-family: Arial black;
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url("fonts/arial_black.ttf") format("truetype");
}

:root {
	--primary: #002469;
	--secondary: #12636B;
	--accent: #F26D00;
	--lightBlue: #E4F0F9;
	--white: #FFFFFF;
	--black: #000000;
	--darkGrey: #424242;
	--lightGrey: #CECECE;

	--font-h1: clamp(1.75rem, 1.575rem + 0.875vw, 2.625rem);
	--font-h2: clamp(1.375rem, 1.25rem + 0.625vw, 2rem);
	--font-h3: clamp(1.25rem, 1.2rem + 0.25vw, 1.5rem);
	--text: 18px;

	--shadow: 0 4px 7px 0 rgba(0, 0, 0, 0.17);
	--font-family-heading: 'Arial black', sans-serif;
	--font-family: 'Arial', sans-serif;
	--font-family-bold: 'Arial Bold', sans-serif;
}

#container_menu_top,
#header_top,
#apptitle,
#pull {
    display: none;
}

#container_menu {
    overflow: visible;
}

#ballroom,
#search-header {
    *, :before, :after {
        box-sizing: border-box;
    }


}

#container_menu_top,
#apptitle,
#ctl00_myBreadcrum_breadcrum {
	display: none;
}

#innercontainer  header{
	box-shadow: var(--shadow);
	position: relative;
}

#innercontainer .b_header-wrapper {
	max-width: 1400px;
	width: 100%;
	margin: 0 auto;
	height: 120px;
	display: flex;
    align-items: center;
    justify-content: space-between;
}

#header {
	height: 100%;
	width: 100%;
}

#innerheader {
	display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
    height: 100%;
	
	figure {
		margin: unset;
		justify-content: center;
	}
}

#innercontainer {
	header {
		padding: 24px 14px;
		max-height: 120px;
		display: flex;
		width: 100%;
		align-items: center;
		background-color: var(--white);
		/* overflow: visible; */
		z-index: 4;
	}

	#ctl00_menu {
		display: none;
		align-items: center;
		list-style-type: none;
		padding-left: unset;
		background-color: var(--white);

		li {
			border-top: 1px solid var(--lightGrey);
			width: 100%;
			padding: 20px 16px;
		}
		
		li.active {
			a {
				text-decoration: underline;
                text-decoration-color: var(--secondary);
                text-underline-offset: 5px;
                text-decoration-thickness: 2px;
			}
		}

		li a {
			width: 100%;
			text-align: center;
			display: flex;
			justify-content: center;
			white-space: nowrap;
		}

		a {
			text-decoration: none;
			color: var(--primary);
			font-size: var(--text);
			font-family: "Arial Bold";
		}
		
		a:hover{
			text-decoration: underline;
			text-decoration-color: var(--secondary);
			text-underline-offset: 5px;
			text-decoration-thickness: 2px;
		}

		&.b_menu-open {
			display: flex;
			background-color: var(--white);
			flex-direction: column;
			position: absolute;
			left: 0;
			width: 100%;
			z-index: 70;
			padding-bottom: 10px;
			top: 90px;
		}

		#p15 a {
			color: var(--primary);
			display: flex;
			align-items: center;
			gap: 8px;
			border-radius: 3px;
			border: 1px solid transparent;
			line-height: 1;

			&::after {
				display: block;
				content: "\f002";
				font-family: "Font Awesome 6 Pro";
				color: var(--primary);
				font-size: 18px;
				font-weight: 900;
				line-height: 1;
			}
		}
		#p15 a:hover{
			text-decoration: none !important;
		}

	}

	.b_menu-search-wrapper {
		position: unset;
	}
}

#pull {
	display: flex;
	align-items: center;
	color: var(--white);
	text-decoration: none;
	font-size: 20px;
	font-weight: 700;

	.menu-button {
		display: none;
	}

	&:after {
		background-color: var(--primary);
		padding: 12px;
		display: inline-block;
		color: var(--white);
		font-weight: 600;
		font-size: 16px;
		content: "\f0c9";
		border-radius: 3px;
		font-family: "Font Awesome 6 Pro";
	}
}

#footer {
    margin-top: auto;
}

#innerfooter {
	max-width: unset;
	border-top: 4px solid var(--secondary);
	background-color: var(--white);

	* {
		font-family: var(--font-family);
	}

	figure {
		margin: unset;
	}

	.footer {
		max-width: 1480px;
		margin: 0 auto;
		display: flex;
		gap: 40px;
		justify-content: space-between;
		padding: 40px;
		flex-direction: column;
	}

	.footer__svg {
		display: flex;
	}

	.footer__content {
		display: grid;
		width: 100%;
        justify-content: space-between;
		grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
		row-gap: 40px;
	}

	.footer__content--list {
		display: flex;
		flex-direction: column;
		gap: 16px;
		max-width: 320px;
		width: 100%;
		color: var(--primary);
	}

	h3,
	p {
		margin: unset;
	}

	h3 {
		font-size: var(--font-h3);
		font-family: Arial black;
	}

	p,
	a {
		font-size: var(--text);
	}

	a:hover{
		text-decoration: underline;
		text-decoration-color: var(--secondary);
		text-underline-offset: 5px;
		text-decoration-thickness: 2px;
	}

	ul {
		padding-left: unset;
		list-style-type: none;
		display: flex;
		flex-direction: column;
		gap: 16px;
		margin: unset;

		a {
			text-decoration: none;
			color: var(--primary);
		}

		li::before {
			content: '\f054';
			font-family: "Font Awesome 6 Pro";
			display: inline-block;
			margin-right: 8px;
			color: var(--secondary);
			font-size: 14px;
			line-height: 1;
			font-weight: 900;
		}

		li.email::before {
			content: '\f0e0';
		}
	}
}

@media all and (min-width: 1140px) {
    #innercontainer #ctl00_menu {
		display: flex;

		li {
			border: none;
			display: flex;
			padding: 12px 16px;
		}

		li#p15 {
			padding: unset;
		}

		#p15 a {
			background-color: var(--primary);
			color: var(--white);
			display: flex;
			align-items: center;
			gap: 8px;
			padding: 12px 16px;
			border-radius: 3px;
			border: 2px solid transparent;
			
			&:focus,
			&:hover {
				background-color: var(--white);
				color: var(--primary);
				border: 2px solid var(--primary);

				&::after {
					color: var(--primary);
				}
			}

			&::after {
				display: block;
				content: "\f002";
				font-family: "Font Awesome 6 Pro";
				color: var(--white);
				font-size: 18px;
				font-weight: 900;
			}
		}
	}

	#pull {
		display: none;
	}

	#innerfooter .footer {
		flex-direction: row;
	}
}

@media all and (min-width: 768px) {
	#innerfooter {
		.footer__content {
			max-width: 1040px;
			grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
		}
	}
}

@media screen and (max-width: 1399px) {
	#data{
		padding: 0 20px 60px;
	}
	.ballroom_links,
	.page_links  {
		#content {
			padding: 60px 20px !important;
		}
	}
	span.h2-style {
    word-break: break-all;
}
}

@media screen and (max-width: 999px) {
	#data{
		padding: 40px 20px 40px;
	}
}