@media (max-width: 900px) { 
	*{
		box-sizing: border-box;

	}

.hero-content .form {
    display: none;
}

main {
}

.hero-content h1 {}

.auth-link {
    position: absolute;
    bottom: 5em;
    width: 90vw;
    display: flex;
    justify-content: space-between;
    background-color: black;
}

form#guest-booking {
    font-size: 0.85rem;
}

#form-errors {
    font-size: 0.7em;
}

.modal-footer {flex-flow: row;}

.modal-footer button {
    font-size: 0.8rem;
}

.copyright {display: flex;flex-direction: column;background-color: antiquewhite;padding: 1em;}

.socials {
    justify-content: center !important;!i;!;
    margin: 2em 0;
    background: #eee;
    height: 90%;
    padding-top: 2em;
}

	body{
		width: 100vw;
		overflow-x:hidden;
		font-size: 13px;
	}

	header{
		position: relative;
	}

	.auth{
		display: flex;
		justify-content: space-between;
		align-items: center;
		width:100%;
		height: 50px;
		background-color: #aaa;
		padding: 0 1em;
	}

	.menu{
        display: flex;
        flex-direction: column;
        width: 100%;
        margin: 0;
        margin-top: 3em;
        padding: 1em;
	}

	.nav-wrapper{
        display: flex;
        flex-direction: column;
	}

	.navigation{
		display: none;
		flex-direction: column;
		height: 100vh;
		height:100dvh;
		position: absolute;
		background-color: #fff;
		z-index: 10;
		width: 100vw;
		justify-content: space-between !important;
		align-items: flex-start !important;
		transform: translateX(100%);
		transition: all 0.5s;
	}

	.menu-open .navigation{
		transform: translateX(0);
		transition: all 0.5s;
		display: flex;
		padding: 0;
	}

	.menu-item{
		font-size: 1.5rem;
		white-space: nowrap;
		margin-bottom: 0.6em;
/*		text-decoration: underline 7px solid red;*/
	}

	.auth .menu-item{
		font-size: 1.5em;
	}

	.listing-item{

	}

	.mobile-menu{
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 100%;
	}

	.logo{
		width:134px;
		margin-right: auto;
	}

	.hamburger-menu {
		position: absolute;
		margin: 1.2rem;
		display: flex;
		flex-flow: column wrap;
		justify-content: space-between;
		height: 2.5rem;
		width: 2.5rem;
		cursor: pointer;
		top: 0;
		right:0;
		z-index: 11;
	}

	.bar-top,
	.bar-middle,
	.bar-bottom {
		height: 5px;
		background: black;
		border-radius: 5px;
		margin: 3px 0;
		transform-origin: left;
		transition: all 0.5s;
	}
	.menu-open .hamburger-menu .bar-top {
		transform: rotate(45deg);
	}
	.menu-open .hamburger-menu .bar-middle {
		transform:translateX(1rem);
		opacity: 0;
	}
	.menu-open .hamburger-menu .bar-bottom {
		transform: rotate(-45deg);
	}


	body.menu-open{
		position: fixed;
		height: 100vh;
		overflow: hidden;
	}



/*HERO	*/
.hero{
	overflow: hidden;
	padding-top: 3em;
}
	.search-form{
		max-width: 100vw;
	}

	.search-form .nav{
		gap:5px;
	}
	.headline{
		height: 240px;
	}


/*Listings	*/

	.listings .grid-container{

		grid-template-columns:1fr;
	}

	.listing-item{
		max-width: 100%;
	    min-width: 90%;
	}
	.search-form .nav-link{
		padding: 5px;
		min-width: 100%;
		font-size: 1.5em;
	}
	.search-form .nav-link::after,
	.search-form .nav-link.active::after{
		display: none;
	}

	.content-wrapper .side-info{
		padding: 5px 20px;
		border-left: none;
		background-color:#e9967a;
	}

	.quick-facts{
		margin-top:3em;
	}

	.header{
		height: 65vh;
		padding-top:3em;
	}
	.header .header-title{
		font-size: 2rem;
	}

	.form-wrapper{

	}
	.signup-form{
		max-width: 100vw;
		padding: 1em;
	}
	.signup-form input{
		font-size: 1.3em;
		height: 60px;
	}
	.form-wrapper input, 
	.form-wrapper textarea, 
	.form-wrapper select{
		height: 60px;
		font-size: 1.3em;
	}

	.form-wrapper input.form-check-input{
		height: 20px;

	}

	.form-wrapper label{
		font-size: 1.3em;
	}
	.form-wrapper .form-select{
		margin-bottom: 1em;
		
	}

/*	*/

.event-images{
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	

}


}