* {margin:0px; font-family:sans-serif; font-size:1vw}
body{background:#234}
.page-wrapper{border:0.5vw solid #456; padding:1vw}
.intro,.sidebar,[role=main]{margin:0.15vw 0px;padding:0.5vw;border:0.15vw solid #789;border-radius:5px}
[role=article]{color:#7DD}
a{color:#4AA}
h3{color:#7D7}

.intro{border-bottom-left-radius: 7vw; border-top-right-radius: 7vw; background: #345}
.intro>header{ z-index:2; float:left; width:17vw; padding:2vw; border:1.5vw solid #A3A; border-radius: 1vw; background:#123}
header+div{position:absolute; float:right; margin-left:23.5vw; margin-top:4vw; padding: 1.8vw 0.5vw; border:0.15vw solid #A3A; border-top-right-radius:1vw}
header+div+div{margin-top:10vw; margin-left:6vw; border-left:0.15vw solid #A3A; border:0.15vw solid #A3A; border-radius:1vw; padding-left:0.5vw}
[role=banner]{color:#D35;font-variant: small-caps}
h1{font-size:2vw;transform:skew(20deg)}
h2{font-size:1.25vw;text-decoration:overline;transform:skew(-20deg);text-decoration-color:#D6D}
h2>abbr{font-size:1.25vw}
header+div>p {color:#DD8}

#zen-supporting{height:24vw; display:flex; justify-content: space-evenly; background:#123; scrollbar-color:#7D7;}
#zen-supporting>div{overflow-y:auto; text-indent: 1vw}
#zen-supporting>div>h3{font-weight:900; padding-bottom:0.5vw;}
#zen-supporting div p{line-height:1.5vw; font-family:Georgia}
[role=main]>div+div{background:#543; padding:1vw; border:0.5vw solid #913}
#zen-requirements>:last-child{padding:1vw;color:#A3A}
#zen-supporting>footer{align-content:space-evenly}
#zen-supporting>footer>a{display:block; padding:1.5vw; color:#C8C}

aside{background:#913}
aside a{color:#DD6;}
aside nav>ul{display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center}
aside nav>ul>li{min-width: 20vw}
#design-selection{float:left; width:45vw}
#design-resources{width:30vw}
#design-archives{float:right; width:20vw}

::-webkit-scrollbar {width: 10px}
::-webkit-scrollbar-track {background: #AAA}
::-webkit-scrollbar-thumb {background: #444}