@media screen and (max-width: 600px) {
	:root {
		--page_width: auto !important;
	}

	html, body {
		width: var(--page_width);
		display: flex;
		flex-direction: column;
	}

	* {
		font-size: 4vw;
	}

	#wrapper, #body, #content, #header, #header_title, 
	#reg_form, #registration_table_container, #download_table, 
	#location_table, #googlemap, #attendee_table,
	#reg_email, .confirmation {
		width: 100%;
	}

	#wrapper, #body {
		display: flex;
		position: relative;
		padding: 0;
		margin: 0 auto;
		flex-direction: column;
	}

	#header {
		height: 200px;
		margin-top: 50px;
		margin-bottom: 20px;
	}

	#header_dates {
		width: 80%
	}
	
	/* Menu */
	
	#navbar {
		display: flex;
		flex-direction: column;
		width: 100%;
		position: absolute;
		z-index: 100;
		overflow: hidden;
		height: 50px;
	    border-top-left-radius: 0;
	    border-top-right-radius: 0;
	}

	#menu_menu {
		background: none !important;
		display: unset !important;
	}

	#menu_menu a {
		color: var(--white) !important;
	}

	body:has(#navbar:hover) #navbar {
		overflow: visible;
		height: auto;
	}

	#menu_row {
		flex-direction: column;
		flex-wrap: wrap;
	}

	#menu li, #menu a {
		width: 90%;
		margin: 0 auto;
	}

	body:has(#navbar:hover) #menu_close {
		display: unset !important;
		position: absolute;
		background: none !important;
		left: 0;
		width: 50px !important;
		height: 50px;
	}

	body:has(#navbar:hover) #menu_close a {
		font-size: 8vw !important;
		border: 1px solid var(--white);
		color: var(--white);
		height: 30px;
		width: 30px;
		padding: 4px;
		border-radius: 5px;
	}
	
	body:has(#menu_close > a:target) #navbar {
		overflow: hidden;
		height: 50px;
	}

	/* Content */

	#banner_req_group {
		display: flex;
		flex-direction: column;
	}

	#dates_table, .agenda_table {
		width: 100%;
	}
	
	.ui-datepicker {
		width: 100% !important;
	}

	.reg_left_column, .reg_right_column {
		width: 100% !important;
		text-align: center !important;
		word-wrap: break-word;
		margin: 0 auto;
		padding: 0;
	}
	
	#registration_table tr {
		display: flex;
		flex-direction: column;
	}

	#registration_table input[type=text], 
	#registration_table select,
	#registration_table textarea
	{
		width: auto;
	}

	#reg_email, .regemail {
		word-wrap: break-word !important;
		width: 100% !important;
	}

	#print {
		padding: 0 !important;
		margin: 0 !important;
		width: auto;
	}

	.confirmation {
		word-break: break-all;
	}

	#agenda_table-payment-3 > tbody > tr:nth-child(2) > td > img {
		width: 100% !important;
	}



	/*
	#menu_row > li:not(:first-child) {
		display: none !important;
	}

	#menu_row > li:hover {
		display: unset !important;
	}
	*/
	
	/*
	#menu_open {
		
	}

	#menu_closed {
		
	}

	#menuToggle {
		display: flex;
		flex-direction: column;
		position: relative;
		top: 25px;
		left: 25px;
		z-index: 1;
		-webkit-user-select: none;
		user-select: none;
	}
		
	#menuToggle input {
		display: flex;
		width: 40px;
		height: 32px;
		position: absolute;
		cursor: pointer;
		opacity: 0;
		z-index: 2;
	}
		
	#menuToggle span {
		display: flex;
		width: 29px;
		height: 2px;
		margin-bottom: 5px;
		position: relative;
		background: #ffffff;
		border-radius: 3px;
		z-index: 1;
		transform-origin: 5px 0px;
		transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
			background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
			opacity 0.55s ease;
	}
		
	#menuToggle span:first-child {
		transform-origin: 0% 0%;
	}
		
	#menuToggle span:nth-last-child(2) {
		transform-origin: 0% 100%;
	}
		
	#menuToggle input:checked ~ span {
		opacity: 1;
		transform: rotate(45deg) translate(-3px, -1px);
		background: #36383F;
	}
	
	#menuToggle input:checked ~ span:nth-last-child(3) {
		opacity: 0;
		transform: rotate(0deg) scale(0.2, 0.2);
	}
		
	#menuToggle input:checked ~ span:nth-last-child(2) {
		transform: rotate(-45deg) translate(0, -1px);
	}
		
	#menu {
		position: absolute;
		width: 180px;
		height: 400px;
		box-shadow: 0 0 10px #85888C;
		margin: -50px 0 0 -50px;
		padding: 50px;
		padding-top: 125px;
		background-color: #F5F6FA;
		-webkit-font-smoothing: antialiased;
		transform-origin: 0% 0%;
		transform: translate(-100%, 0);
		transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
	}
		
	#menu li {
		padding: 10px 0;
		transition-delay: 2s;
	}
		
	#menuToggle input:checked ~ ul {
		transform: none;
	}
	*/
}
