body {
background-color: black;
background-image: linear-gradient(to right, #8f0000 50%, black 50%);
color: white;
font-family: ibm_plex_sansregular, sans-serif;
}

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

nav a, .fwd a, a.link, .panelcollapsed p, .panel p, a.close {
background-color: #cc0000;
color: white;
border-bottom: 0;
}

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

article {
background-color: black;
color: #eeeeee;
max-width: 800px;
font-size: 17px;
line-height: 27px;
}

.squeeze {padding-right: 100px;}

header, footer {color: #ee0000;}

footer {
font-size: 15px;
line-height: 24px;
}

header {
font-family: ibm_plex_sansmedium, sans-serif;
font-weight: normal;
}

h1 {
font-size: 40px;
line-height: 1.2; 
letter-spacing: +2px;
margin: 15px 20px 0 20px;
}

h2 {
font-size: 22px;
line-height: 1; 
letter-spacing: +1px;
margin: 0;
text-indent: 40px;
}

h3 {
font-size: 20px;
line-height: 1.2; 
letter-spacing: +1px;
margin: 0 20px 0 20px;
padding-top: 15px;
}

nav, .fwd {
padding-top: 10px;
margin-left: 20px;
}

nav a {
float: left;
width: 50%;
}

.fwd a {float: right;}

#walesfwd a {background-image: url(walesid.gif);}

#scotsfwd a {background-image: url(scotsid.gif)}

#scotsfwd a, #walesfwd a {
background-position: 5px center;
background-repeat: no-repeat;
text-indent: 40px;
}

p {margin: 10px 20px 0 20px;}

p.rubric {
color: #ee0000;
font-size: 22px;
line-height: 1;
letter-spacing: +4px;
margin-top: 20px;
}

aside, blockquote {margin: 5px 50px 0 50px;}

.topm {margin-top: 10px;}

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

.spacer {margin-top: 6px;}

table.split, table.chron {width: 100%;}

td.right {width: 48%;}

section, aside.pic {border-left: 2px solid #8f0000;}

section {
background: black url(wales_header.gif) no-repeat scroll 20px 13px;
padding: 10px 0 10px 0;
}

aside, .notesml, .notenorm, .notemed, .notebig, figcaption {
font-size: 15px;
line-height: 24px;
background-color: black;
color: #c0c0c0;
}

.notesml, .notenorm, .notemed, .notebig {border: 2px solid #dd0000;}

aside.pic {
padding-left: 20px;
margin: 15px 10px 10px 0;
}

aside.altpic {margin: 10px auto 0 auto;}

aside.pic img, aside.altpic img {margin: 0 auto 0 auto;}

aside.bordered {
font-size: 16px;
line-height: 26px;
margin-top: 10px;
padding: 10px 0 10px 0;
border-top: 2px solid #8f0000;
border-bottom: 2px solid #8f0000;
}

.panelcontent {
font-size: 16px;
line-height: 26px;
padding: 10px 50px 10px 50px;
border-bottom: 2px solid #8f0000;
background-color: black;
color: #c0c0c0;
}

.chron td {vertical-align: top;}

.chron blockquote, .chron aside {margin-left: 0;}

td.date {
width: 60px;
padding: 5px 0 0 20px;
}

td.datetwo {
width: 60px;
padding: 10px 0 0 20px;
}

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

#alt, aside.altpic {display: none;}

@media screen and (max-width: 750px) {
.squeeze {padding-right: 0}
}

@media screen and (max-width: 700px) {
aside.pic {display: none;}
aside.altpic {display: block;}
}

@media screen and (max-width: 600px) {
nav, .fwd {margin-left: 0;}
nav a, .fwd a {
width: 100%;
margin-bottom: 10px;
}
#scotsfwd a, #walesfwd a {width: auto;}
h1, h3, p {
margin-right: 10px;
margin-left: 10px;
}
aside, blockquote {
margin-right: 40px;
margin-left: 40px;
}
td.date, td.datetwo {padding-left: 10px;}
.panelcontent {
padding-right: 20px;
padding-left: 20px;
}
table.split, table.split tr, table.split td {display: block;}
td.right {width: 100%;}
section {
border: 2px solid #8f0000;
margin: 10px 10px 0 10px;
}
}

@media screen and (max-width: 500px) {
h1 {font-size: 8vw;}
#alt {display: block;}
#norm, #masks {display: none;}
}