@font-face {
font-family: 'Linguistics Pro';
src: url('subset-LinguisticsPro-Regular.woff2') format('woff2'),
url('subset-LinguisticsPro-Regular.woff') format('woff');
font-weight: normal;
font-style: normal;
}

body {
background: black url(dark_bg.jpg) no-repeat center center fixed;
background-size: cover;
color: #8f8fbd;
font-family: ibm_plex_sansregular, sans-serif;
}

a, .nb a:hover, .tip a:hover, a.switch:hover, a.nov:hover {
background-color: transparent;
color: #cccccc;
border-bottom: 2px solid #8f8fbd;
}

nav a, .fwd a, a.close, a.link, a.link_back, .hept a, a.xi, .panelcollapsed p, .panel p {
background-color: #8f8fbd;
color: white;
border-bottom: 0;
}

a:hover, .panel p:hover, .panelcollapsed p:hover {
background-color: #dd3333;
color: white;
border-color: transparent;
}

article {
max-width: 800px;
font-size: 17px;
line-height: 27px;
}

.bg {
background-color: black;
color: #c1c1db;
}

.block, .m_l_block, h1 {padding: 0 40px 0 50px;}

.block {border-right: 10px solid black;}

.m_l_block {border-right: 10px solid #8f8fbd;}

h1, h2 {
font-family: 'Linguistics Pro', serif;
color: #8f8fbd;
font-weight: normal;
margin: 0;
padding-top: 20px;
}

h1 {
font-size: 40px;
line-height: 48px;
}

h2 {
font-size: 24px;
line-height: 29px;
}

h2.tuck {padding-top: 5px;}

h2.title {
padding-top: 5px;
margin: 0 40px 0 40px;
}

h3 {
margin: 0;
font-size: 17px;
line-height: 22px;
font-weight: normal;
}

p, aside {margin: 10px 0 0 0;}

aside.quote {margin: 5px 0 0 0;}

blockquote {margin: 5px 40px 0 40px;}

blockquote.topm {margin: 10px 40px 0 40px;}

aside blockquote, .panelcontent blockquote {margin: 3px 40px 0 40px;}

.notenorm blockquote, .notemed blockquote, .notebig blockquote {margin: 3px 30px 0 30px;}

.spacer {margin-top: 6px;}

nav {margin-top: 10px;}

.fwd {
background-color: #8f8fbd;
border-top: 15px solid black;
}

nav a {float: left;}

a.sel_20 {width: 20%;}
a.sel_30 {width: 30%;}
a.sel_40 {width: 40%;}
a.sel_50 {width: 50%;}

aside, footer, figcaption, .notesml, .notenorm, .notemed, .notebig {
font-size: 15px;
line-height: 24px;	
}

footer {padding: 0 10px 0 10px;}

.border, .notesml, .notenorm, .notemed, .notebig {
border: 2px solid #8f8fbd;
background-color: black;
color: #8f8fbd;
}

aside, figcaption, .panelcontent {color: #8f8fbd;}

aside.border {
font-size: 16px;
line-height: 26px;
padding: 10px;
}

figure.border figcaption {padding: 4px 6px 6px 6px;}

.panelcontent {
font-size: 16px;
line-height: 26px;
border-bottom: 2px solid #8f8fbd;
padding: 10px 0 10px 0;
}

.panelcollapsed p, .panel p {
width: 250px;
margin: 5px 0 0 -30px;
}

#ident {
font-family: 'Linguistics Pro', serif;
background-color: black;
color: #8f8fbd;
font-size: 22px;
line-height: 28px;
position: fixed;
bottom: 10px;
left: 5px;
width: 30px;
text-align: center;
border-right: 2px solid #8f8fbd;
}

#menu {
background-color: black;
font-size: 16px;
line-height: 27px;
width: 100px;
display: none;
position: fixed;
bottom: 45px;
left: 40px;
padding: 0 0 5px 6px;
border: 2px solid #8f8fbd;
}

a.xi, #detach {font-family: ibm_plex_sansmedium, sans-serif;}

a.xi {
padding: 0 2px 0 2px;
cursor: pointer;
}

.line {
border-top: 2px solid #8f8fbd;
margin: 15px 0 0 0;
}

ul.list, ul.list li {margin: 5px 0 0 0;}

.hept {
text-align: right;
margin-top: 2px;
}

.hept a {
font-family: ibm_plex_sansmedium, sans-serif;
letter-spacing: +0.1em;
font-size: 14px;
line-height: normal;
padding: 1px 0 2px 10px;
position: relative;
left: 50px;
top: 2px;
}

table.split, #hid {margin: 15px -30px 0 -30px;}

table.split {width: 108.5%;}

table.split td {
width: 50%;
vertical-align: top;
}

td.col_l {
border-right: 2px solid #8f8fbd;
padding-right: 10px;
}

td.col_r {
border-left: 2px solid #8f8fbd;
padding-left: 10px;
}

@media screen and (max-width: 700px) {
a.sel_20, a.sel_30, a.sel_40 {
width: 100%;
border-bottom: 10px solid black;
}
.block, .m_l_block, h1 {padding: 0 5px 0 10px;}
.panelcollapsed p, .panel p {margin-left: -10px;}
.hept a {left: 15px;}
table.split, #hid {margin: 15px 0 0 0;}
table.split {width: 100%;}
table.split blockquote {margin: 5px 20px 0 20px;}
}

@media screen and (max-width: 600px) {
a.sel_50, .fwd a {
width: 100%;
border-bottom: 10px solid black;
}
}

@media screen and (max-width: 500px) {
blockquote, blockquote.topm, aside blockquote, h2.title {
margin-right: 30px;
margin-left: 30px;
}
}