@media only screen {
	.panel-header {
		position: relative;
		top: 0;
		width: 100%;
		background-color: white;
		/* do not set overflow hidden here or the dropdowns won't work */
		z-index: 10;
	}

	.panel-header .header-row {
		position: relative;
		display: flex;
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding: 0;
	}
	.panel-header .header-row.row-top,
	.panel-header .header-row.row-middle {
		position: fixed;
		background-color: #d26d33;
	}
	.panel-header .header-row.row-top {
		top: 0;
		z-index: 2;
	}
	.panel-header .header-row.row-bottom {
		background-color: white;
	}
	.panel-header .header-row.row-bottom .booking {
		width: 100%;
		max-width: 100%;
	}
	body.menu-open .panel-header .header-row.row-bottom {
		display: none;
	}
	.panel-header > hr {
		display: none;
	}

	.panel-header .nav-wrapper {
		position: relative;
		width: 100%;
	}
}

@media (max-width: 64em) {
	body.menu-open .panel-header {
		position: fixed;
		height: 100%;
		overflow-y: scroll;
		z-index: 999;
	}
	.panel-header .header-row.row-top {
		height: 74px;
	}
	.panel-header .header-row.row-middle {
		display: none;
	}
	body.menu-open .panel-header .header-row.row-top,
	body.menu-open .panel-header .header-row.row-middle {
		position: relative;
	}
	body.menu-open .panel-header .header-row.row-middle {
		display: block;
		background-color: white;
	}
	.panel-header .header-row.row-bottom {
		top: 74px;
	}
	
	.panel-header .header-row.row-top nav.nav-secondary {
		display: none;
	}
	.panel-header .header-row.row-middle .secondary-nav {
		display: block;
	}

	.panel-header .header-row.row-middle .logo-wrapper {
		display: none;
	}
	.panel-header .header-row.row-top .logo-wrapper a {
		background: none;
		display: none;
	}
	.panel-header .header-row.row-top .logo-wrapper {
		position: relative;
		display: block;
		padding-top: 18px;
		flex-basis: calc(100% - 140px);
		text-align: center;
		margin: 0 auto;
	}
	.panel-header .header-row.row-top .logo-wrapper a {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		width: 140px;
		height: 49px;
		background-image: url(/includes/public/assets/images/logo.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: top left;
		z-index: 1;
	}
	
	/* menu icon */
	.panel-header .mobile-menu {
		position: relative;
		display: block;
		flex-basis: 70px;
		z-index: 1;
	}
	.panel-header .mobile-menu .mobile-toggle {
		position: relative;
		display: inline-block;
		vertical-align: top;
		top: 10px;
		padding: 3px;
		margin: 0 0 0 20px;
		border: none;
		outline: 0;
		background-color: transparent;
		text-indent: 0;
		cursor: pointer;
	}
	.panel-header .mobile-menu .mobile-toggle .line {
		width: 32px;
		height: 3px;
		margin: 9px 0 0 0;
		background-color: white;
	}

	.panel-header .nav-wrapper {
		display: none;
		top: 6em;
	}
	body.menu-open .panel-header .nav-wrapper {
		display: block;
	}
	
	.panel-header .tripbuilder {
		flex-basis: 70px;
	}

	.panel-header .search-box {
		display: none;
		position: absolute;
		left: 0;
		top: 5em;
		width: 100%;
	}
	body.menu-open .panel-header .search-box {
		display: block;
	}
}

@media (min-width: 64.063em) {
	.panel-header .header-row {
		flex-direction: row;
	}

	.panel-header .header-row.row-top {
		height: 46px;
		background-color: white;
	}

	.panel-header .header-row.row-middle {
		top: 46px;
		height: 66px;
		align-items: center;
		z-index: 2;
	}

	.panel-header .header-row .row-inner {
		max-width: 63em;
		margin: 0 auto;
	}

	.panel-header .header-row.row-middle .row-inner {
		justify-content: space-between;
	}

	.panel-header .header-row.row-bottom {
		display: block;
		top: 112px;
		width: 100%;
		z-index: 1;
	}
	
	.panel-header .search-box {
		display: block;
		position: relative;
		top: 0;
		flex-grow: 1;
		flex-shrink: 0;
		margin-right: 20px;
	}

	.panel-header .secondary-nav {
		flex-grow: 0;
		flex-shrink: 1;
	}

	.panel-header .tripbuilder {
		flex-basis: 170px;
		flex-grow: 0;
		flex-shrink: 1;
	}

	.panel-header .header-row.row-top .logo-wrapper {
		display: none
	}
	.panel-header .header-row.row-top .logo-wrapper a {
		background: none;
		display: none;
	}

	.panel-header .header-row.row-middle .logo-wrapper {
		display: block;
		flex-shrink: 1;
	}
	.panel-header .header-row.row-middle .logo-wrapper a {
		display: block;
		position: relative;
		width: 160px;
		height: 56px;
		background-image: url(/includes/public/assets/images/logo.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-size: cover;
		background-position: top left;
		text-align: left;
		z-index: 1;
	}

	.panel-header .nav-wrapper {
		flex-basis: 740px;
		flex-grow: 0;
		flex-shrink: 1;
	}
	
	.panel-header .nav-wrapper .secondary-nav,
	body.menu-open .panel-header .nav-wrapper .secondary-nav {
		display: none;
	}
	
	.panel-header .header-row.row-top nav.nav-secondary {
		display: block;
		height: 50px;
		overflow: hidden;
	}

	.panel-header .mobile-menu {
		display: none;
	}
}

@media (min-width: 75em) {
	.panel-header .header-row .row-inner {
		max-width: 73em;
	}
	.panel-header .search-box {
		flex-basis: 368px;
		margin-right: 30px;
	}
	
	.panel-header .secondary-nav {
		/* flex-basis: 600px; */
	}
	
	.panel-header .nav-wrapper {
		flex-basis: 854px;
	}

}
