/* Navbar */

.custom-wrapper {
	background: var(--brand-primary);
	color: var(--text-color);
	height: 3.3rem;
	overflow: hidden;
	transition: height 0.5s;
	display:flex;
	align-items: center;
}

.pure-menu-link, .pure-menu-link:hover, a.pure-menu-link, a.pure-menu-link:hover, a.pure-menu-link:visited{
  background: var(--brand-primary);
	color: var(--text-color);
}

.custom-wrapper.open {
    height: 100%;
}

.custom-menu-3 {
    text-align: right;
}

.custom-toggle {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 10px;
    right: 5px;
    display: none;
}

.custom-toggle .bar {
	  background: var(--text-color);
    display: block;
    width: 20px;
    height: 2px;
    position: absolute;
    top: 18px;
    right: 7px;
    transition: all 0.5s;
}

.custom-toggle .bar:first-child {
    transform: translateY(-6px);
}

.custom-toggle.x .bar {
    transform: rotate(45deg);
}

.custom-toggle.x .bar:first-child {
    transform: rotate(-45deg);
}
/* Buttons */
.inline-buttons{
	display:flex;
}
.inline-buttons > .pure-button + .pure-button{
	margin-left:0.5rem;
}

/* Dropdowns */
.dropdown ul{left:1rem;}
.dropdown ul li a{position:relative;}
.dropdown input[type=checkbox],.dropdown input[type=checkbox] ~ ul{display:none;}
.dropdown input[type=checkbox]:checked ~ ul{display:block;}

@media (min-width: 768px) {
  #menu{
    overflow: visible;
  }
  .dropdown ul, .dropdown ul a{
    position:absolute;
    background:#1d1d1b;
    color:#fff;
  }
}
@media (max-width: 47.999em) {
    .custom-menu-3 {text-align: left;}
    .custom-toggle {display: block;}
}