/*
Theme name: Mayfair
Description: Mayfair Theme
Version: 1.31.0
Author: OllyOlly
*/

/*
	Source post-css styles are located in resources/css/
	The compiled bundle is saved to `dist/css/bundle-${fingerprint}.css`
	(dist/manifest.json provides the exact path mapping).

	DEVELOPMENT.md file contains instructions how to get the compilation
	process up & running.

	If you need to make a quick fix, feel free to add CSS
	below this comment -- it's loaded after the compiled bundle.
*/

/* Responsive BBB Badge Layout */
nav .brand {
	display: inline-block;
	vertical-align: middle;
}

nav .bbb-badge {
	display: inline-block;
	vertical-align: middle;
	margin-left: 8px;
}

nav .bbb-badge img {
	height: 42px;
	width: auto;
	display: block;
}

nav .menu-trigger {
	display: inline-block;
	vertical-align: middle;
}

/* Reduce logo size slightly on desktop to make room for BBB badge */
@media (min-width: 769px) {
	nav .brand .logo img:not(.mobile-logo) {
		width: 200px !important;
		max-width: 200px !important;
	}
}

/* Responsive adjustments - keep logo and hamburger on same line, drop BBB badge below */
@media (max-width: 1024px) {
	/* Keep logo and hamburger on the same line */
	nav .brand {
		display: block;
		float: left;
		width: auto;
		max-width: calc(100% - 60px);
	}

	nav .menu-trigger {
		display: block;
		float: right;
		margin-top: 0;
	}

	/* Drop BBB badge to next row below logo and hamburger */
	nav .bbb-badge {
		display: block;
		float: none;
		margin-left: 0;
		margin-top: 10px;
		padding-bottom: 15px;
		text-align: left;
		clear: both;
		width: 100%;
	}

	nav .bbb-badge img {
		height: 35px;
		margin: 0;
	}
}

/* Make logo smaller on tablet/mobile screens */
@media (max-width: 768px) {
	nav .brand .logo img:not(.mobile-logo) {
		width: 160px !important;
		max-width: 160px !important;
	}

	nav .brand .mobile-logo {
		width: 160px !important;
		max-width: 160px !important;
	}
}

/* Make BBB badge slightly smaller on very small mobile screens */
@media (max-width: 480px) {
	nav .bbb-badge img {
		height: 30px;
	}
}

p {}