@charset "utf-8";

/**************************************
* page-nav.css
**************************************/

/* @group page-nav
--------------------------------------------------------*/

.page-nav{
position:relative;
height:3.75rem;
}

.page-nav-body{
position:absolute;
z-index:200;
top:0;
right:0;
left:0;
background:hsl(0, 0%, 100%);
-webkit-transition:all .25s cubic-bezier(.6, .5, .5, .75);
transition:all .25s cubic-bezier(.6, .5, .5, .75);
}

.fit-sticky .page-nav-body{
position:fixed;
}

.page-nav ul{
position:relative;
margin-bottom:0;
}

.page-nav ul,
.page-nav li{
display:flex;
}

.page-nav ul a{
display:flex;
justify-content:center;
align-items:center;
height:3rem;
color:hsl(0, 0%, 20%);
}

.page-nav ul a:hover{
color:hsl(334, 78%, 50%);
}

@media (max-width:47.9375em){

.page-nav-body{
box-shadow:inset 0 -1px 0 0 hsl(0, 0%, 80%);
}

.page-nav ul{
position:absolute;
overflow:hidden;
z-index:2;
top:3.75rem;
right:0;
left:0;
max-height:0;
flex-wrap:wrap;
background:hsl(0, 0%, 100%);
box-shadow:inset 0 -1px 0 0 hsl(0, 0%, 80%),0 -1px 0 0 hsl(0, 0%, 80%);
transition:.5s max-height cubic-bezier(.55,0,.1,1);
}

#toggle-nav:checked ~ ul{
max-height:2000em;
}

.page-nav li{
width:50%;
}

.page-nav ul a,
.page-nav p a{
width:100%;
padding:.375rem;
background:hsl(0, 0%, 100%);
color:hsl(0, 0%, 20%);
box-shadow:inset 0 -1px 0 0 hsl(0, 0%, 80%);
}

.page-nav li:nth-of-type(2n+1) a{
box-shadow:inset -1px -1px 0 0 hsl(0, 0%, 80%);
}

}

@media (min-width:48em){

.page-nav{
height:3.75rem;
}

.page-nav-body{
display:flex;
justify-content:space-between;
height:3rem;
padding-top:.375rem;
padding-bottom:.375rem;
box-shadow:0 1px 0 0 hsl(0, 0%, 80%);
}

.page-nav ul,
.page-nav li{
align-items:center;
}

.page-nav li{
margin-right:.375rem;
}

.page-nav .page-nav-logo,
.page-nav .toggle-nav,
.page-nav .toggle-nav-link,
.page-nav .nav-toggle-bg{
display:none;
}

}

@media (min-width:48em) and (max-width:61.9375em){

.page-nav ul{
font-size:.875rem;
}

}

@media (min-width:62em){

.page-nav li{
margin-right:.75rem;
}

}

/* @end page-nav */

/* @group toggle-nav
--------------------------------------------------------*/

@media (max-width:47.9375em){

.page-nav .toggle-nav-link{
box-sizing:border-box;
position:absolute;
z-index:3;
top:0;
right:0;
display:flex;
justify-content:center;
align-items:center;
width:3.75rem;
height:3.75rem;
box-shadow:inset 1px 0 0 hsl(0, 0%, 80%);
cursor:pointer;
transition:.25s all cubic-bezier(.55,0,.1,1);
}

.toggle-nav-link:hover,
#toggle-nav:checked ~ .toggle-nav-link{
background:hsl(334, 78%, 50%);
}

.nav-toggle-inner{
position:relative;
width:2.25rem;
height:2.25rem;
}

.nav-toggle-inner:before,
.nav-toggle-inner:after,
.nav-toggle-inner>span:before,
.nav-toggle-inner>span:after{
content:'';
speak:none;
position:absolute;
left:0;
width:2.25rem;
height:.25rem;
background:hsl(334, 78%, 50%);
border-radius:.5rem;
transition:.25s transform cubic-bezier(.55,0,.1,1);
-webkit-backface-visibility:hidden;backface-visibility:hidden;
}

.toggle-nav-link:hover .nav-toggle-inner:before,
.toggle-nav-link:hover .nav-toggle-inner:after,
.toggle-nav-link:hover .nav-toggle-inner>span:before,
.toggle-nav-link:hover .nav-toggle-inner>span:after{
background:hsl(0, 0%, 100%);
}


.nav-toggle-inner:before,
.nav-toggle-inner:after{
top:1rem;
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
}

.nav-toggle-inner>span:after{
top:.25rem;
}

.nav-toggle-inner>span:before{
bottom:.25rem;
}

#toggle-nav{
position:fixed;
left:-99em;
}

#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner:before,
#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner:after,
#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner>span:before,
#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner>span:after{
background:hsl(0, 0%, 100%);
}

#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner:before{
transform:rotate(-45deg);
}

#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner:after{
transform:rotate(45deg);
}

#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner>span:before,
#toggle-nav:checked ~ .toggle-nav-link .nav-toggle-inner>span:after{
transform:scale(0, 0);
}

#toggle-nav:checked ~ .nav-toggle-bg{
position:fixed;
z-index:1;
top:0;
top:0;
right:0;
bottom:0;
left:0;
}


}

/* @end toggle-nav */

/* @group page-nav-button
--------------------------------------------------------*/

.page-nav .page-nav-button{
display:flex;
justify-content:center;
align-items:center;
background:hsl(334, 78%, 50%);
border-radius:.25rem;
color:hsl(0, 0%, 100%);
font-size:1rem;
line-height:1.5;
font-weight:600;
}

.page-nav .page-nav-button img{
width:1.5rem;
margin-right:.375rem;
}

.page-nav .page-nav-button:hover{
background:hsl(334, 78%, 45%);
}

@media (max-width:47.9375em){

.page-nav .page-nav-button{
position:absolute;
z-index:3;
top:.625rem;
right:4.5rem;
width:8.25rem;
height:2.625rem;
}

}

@media (min-width:48em){

.page-nav .page-nav-button{
padding:.75rem;
}

}

/* @end page-nav-button */

/* @group page-nav-logo
--------------------------------------------------------*/

@media (max-width:47.9375em){

.page-nav h2{
display:flex;
justify-content:center;
flex-direction:column;
height:3.75rem;
padding-left:.75rem;
font-family:'simplificasimplifica';
margin-bottom:0;
font-size:1.5rem;
line-height:1.1;
}

.page-nav h2 a,
.page-nav h2 a:hover{
color:inherit;
}

.page-nav h2 span{
text-transform:uppercase;
}

.page-nav h2 em{
}

}

@media (min-width:48em){

.page-nav h2{
display:none;
}

}

/* @end page-nav-logo */

/*--------------------------------------------------------*/