body {
margin:0;
font-family:arial;
}

header {
background-color:#084B8A;
color:#f2f2f2;
padding:6px 12px;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow: 0 0 2px #f2f2f2,
0 0 2px #f2f2f2,
0 0 2px #f2f2f2,
0 0 2px #f2f2f2;
}

#logo {
font-family:arial;
font-size:2rem;
font-weight:bold;
}

header #hnav a {
color:#fff;
}

#wrap {
position:fixed;
top:48px;
bottom:0;
left:8px;
right:8px;
font-size:1.3rem;
}

nav {
position:absolute;
left:0;
width:200px;
display:flex;
flex-direction:column;
gap:3px;
padding:22px 0;
}

header #hnav {
position:relative;
left:none;
width:auto;
display:flex;
flex-direction:row;
padding:0;
}

#wrap nav a {
color:#000;
}
#wrap nav h3 {
margin:3px 0;
}

header #hnav a {
color:#fff;
}

main {
position:absolute;
top:0;
left:200px;
right:0;
bottom:6px;
padding:0 12px;
overflow-y:scroll;
}

#services-table {
width:100%;
border-collapse:collapse;
}
#services-table td {
padding:6px;
border-bottom:2px solid #151515;
}

.endpoint {
margin:6px 0;
background-color:#f2f2f2;
border:1px solid #8d8d8d;
}

.endpoint p, pre {
padding:0 6px;
}

.epname {
padding:6px;
}

.path, .get, .post {
background-color:#151515;
}

.path {
padding:6px;
color:#00b140;
}

.get {
color:#fff;
}

.header {
color:red;
}