/* Mobile View */
@media screen and (max-width: 45rem){

header{
display:flex;
justify-content:center;
background:var(--bgr-header-300);
}

header .card{
margin:.15rem .75rem;
color:var(--clr-header-300);
}

header .card .title{
margin:.35rem 0 0 0;
}

header .card .title h2{
margin:0;
padding:0;
}

header .card .title h2 .hl{
font-size:var(--fs-s);
}


}

/* Mobile View > Tablet */
@media screen and (min-width: 45rem) and (max-width: 79.5rem){

header{
display:flex;
justify-content:space-between;
background:var(--bgr-header-300);
}

header .card{
margin:.15rem 1rem;
color:var(--clr-header-300);
}

header .card .title{
margin:.35rem 0 0 0;
}

header .card .title h2{
margin:0;
padding:0;
}

header .card .title h2 .hl{
font-size:var(--fs-p);
}

}

/* Desktop View */
@media screen and (min-width: 79.5rem){

header{
display:flex;
justify-content:space-between;
background:var(--bgr-header-300);
}

header .card{
margin:.5rem 1.5rem;
border:none;
color:var(--clr-header-300);
}

header .card .title{
margin:.35rem 0 0 0;
}

header .card .title h2{
margin:0;
padding:0;
}

header .card .title h2 .hl{
font-size:var(--fs-s);
}

}