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

body{
display:grid;
grid-template-columns:auto;
grid-template-rows:auto 4rem auto auto auto auto auto;
grid-gap:0;
grid-template-areas:
"topnav"
"header"
"teaser"
"content"
"container_1"
"container_2"
"footer";
}

}


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

body{
display:grid;
grid-template-columns:1fr minmax(0, 100rem) 1fr;
grid-template-rows:1.875rem 10rem auto auto auto auto auto;
grid-gap:0;
grid-template-areas:
"topnav topnav topnav"
"header header header"
"teaser teaser teaser"
"container_1 container_1 container_1"
". content ."
"container_2 container_2 container_2"
". footer .";
}

}

#content{
grid-area:content;
display:grid;
grid-template-columns:auto;
grid-template-rows:minmax(0, auto);
grid-gap:0;
grid-template-areas:
"main";
}

main{
margin:0;
grid-area:main;
}

article header{
float:left;
width:100%;
margin:0;
padding:0;
}

article{
float:left;
width:100%;
margin:0 0 1rem 0;
padding:0 .75rem;
border:0px #0FF000 solid;
}

article:first-child{
margin:0;
}

article:last-of-type{
margin:0;
}

article .asset{
border-bottom:var(--base-border-color) 1px solid;
}

article section{
float:left;
width:100%;
margin:0;
padding:0;
border:0px #0FF000 solid;
}