html, body {
height:100%;
}
body {
color:#202122;
font-family:'Vollkorn', sans-serif;
font-size:1.1rem;
line-height:1.6rem;
margin:0;
padding:0;
}
a:link, a:visited {
color:#898989;
text-decoration:none;
}
a:hover {
color:#f04141;
text-decoration:underline;
}
h1 {
font-size:1.8rem;
text-align:center;
}
h2 {
font-size:1.4rem;
text-align:center;
}
h4 {
color:#f04141;
font-size:1rem;
font-weight:normal;
margin-bottom:0.3rem;
margin-top:1.5rem;
text-align:center;
}
.h4-surround h4 {margin:0;padding-top:0.3rem;}
.h4-subtitle {margin-top:-0.2rem;font-style:italic;}
.h4-surround {
margin-top:2rem;margin-bottom:0.5rem;
/* border-bottom: 1px solid #cdcdcd; border-top: 1px solid #cdcdcd; */
}
ins {
font-style:normal;
text-decoration:none;
}
p {
margin-bottom:0.2rem;
margin-top:0.2rem;
}
p.dcap::first-letter {
color:#f04141;
float:left;
font-size:3.6rem;
line-height:3.1rem;
margin:0;
margin-bottom:-0.2rem;
margin-top:0.2rem;
padding:0;
}
p.para-not-first {
margin-top:0.25rem;
}
.spaced-paras p {margin-top:0.8rem;}
table.scripture td {padding:0;vertical-align:top;}
table.scripture td.verse-num {color:#f04141;}
sup {font-size:0.7rem;vertical-align:top;position:relative;top:-0.4rem;}

.full-page {
display:grid;
grid-template-columns:100%;
grid-template-rows:1fr auto;
height:100%;
}
.before-page-end {
padding-bottom:6rem;
}
.page-end {
background:#f7f7f7;
bottom:0rem;
height:3.1rem;
margin-top:3.5rem;
position:fixed;
width:100%;
}
.cg, .cz {display:none;}
.mod .cg, .mod .cz {display:inline;}
.mod .og, .mod .oz {display:none;}

.first {
font-size:1rem;
text-transform:uppercase;
letter-spacing: 0.2px;
}
.dcap.h .first { margin-left:-0.1rem; }
.dcap.o .first, .dcap.x .first { margin-left:-0.15rem; }
.dcap.c .first, .dcap.e .first, .dcap.g .first, .dcap.m .first, .dcap.s .first { margin-left:-0.2rem; }
.dcap.b .first, .dcap.z .first, .dcap.q .first { margin-left:-0.25rem; }
.dcap.k .first { margin-left:-0.35rem; }
.dcap.r .first { margin-left:-0.45rem; }
.dcap.a .first { margin-left:-0.7rem; }
.dcap.l .first { margin-left:-0.85rem; }
p.dcap.g::first-letter {
padding-right:0.05rem;
}
p.dcap.b::first-letter, p.dcap.m::first-letter, p.dcap.t::first-letter, p.dcap.w::first-letter, p.dcap.x::first-letter, p.dcap.z::first-letter {
padding-right:0.1rem;
}
p.dcap.c::first-letter, p.dcap.e::first-letter, p.dcap.o::first-letter, p.dcap.sing-o::first-letter {
padding-right:0.15rem;
}
p.dcap.a::first-letter, p.dcap.r::first-letter {
padding-right:0.2rem;
}
p.dcap.k::first-letter, p.dcap.l::first-letter, p.dcap.q::first-letter {
padding-right:0.25rem;
}
.hang {
padding-left:2rem;
text-indent:-2rem;
}
.inner {
margin-left:auto;
margin-right:auto;
padding-left:0.25rem;
padding-right:0.25rem;
width:40rem;
}
.mid-ast {
color:#f04141;
display:none;
}
.page-div {
background:#cdcdcd;
border-top:1px solid #cdcdcd;
display:block;
height:0px;
margin-bottom:2rem;
margin-top:2rem;
padding:0;
width:100%;
}
.page-div-small {
background:#cdcdcd;
border-top:1px solid #cdcdcd;
display:block;
height:0px;
margin-bottom:2rem;
margin-left:auto;
margin-right:auto;
margin-top:2rem;
padding:0;
width:20%;
}
/* fleuron divider */
.fleuron-divider {
font-size:1.625rem;
margin:1.5rem 0;
}
.fleuron-divider, .fleuron-divider-line, .fleuron-divider-line-ii {
align-items:center;
color:#bbb;
display:flex;
width:100%;
}
.fleuron-divider-line, .fleuron-divider-line-ii {
font-size:1.625rem;
margin:30px 0;
margin-left:auto;margin-right:auto;
text-align:center;
width:100%;
}
.fleuron-divider::before, .fleuron-divider::after, .fleuron-divider-line::before, .fleuron-divider-line::after, .fleuron-divider-line-ii::before, .fleuron-divider-line-ii::after {
content:'';flex:1;
}
.fleuron-divider-line::before {
margin-right:10px;border-bottom: 1px solid #cdcdcd;
}
.fleuron-divider-line::after {
margin-left:10px;border-bottom: 1px solid #cdcdcd;
}
.fleuron-divider-line-ii::before {
margin-right:10px;
}
.fleuron-divider-line-ii::after {
margin-left:10px;
}
.fleuron-divider-line-ii::before, .fleuron-divider-line-ii::after {
border-bottom: 1px solid #cdcdcd;border-top: 1px solid #cdcdcd;height:4px;
}

.pre-response {
margin-top:1.1rem;
}
.append {
font-style:italic;
margin-top:0.2rem;
}
.prec {
margin-bottom:0rem;
margin-top:0.2rem;
}
.prec-r {
margin-top:0rem;
padding-left:1.5rem;
}
.center {
text-align:center;
}
.semi-center {
padding-left:3.5rem;
padding-right:2.5rem;
}

.canticle p {
margin-top:0.1rem;margin-bottom:0;
}
.canticle p.indent {
margin-top:0;
padding-left:2.5rem;
}

.bottom-menu {
display:flex;
justify-content:space-between;
flex-direction:row;
flex-wrap:wrap;
font-family:'Noto Sans Symbols 2';
}
.accent {
color:#3c87c1;
}
.bottom-menu-parts {
display:flex;
justify-content:space-between;
}
.bottom-menu-left, .bottom-menu-right {
width:calc(50% - 20rem);
}
.bottom-menu-center {
width:40rem;
}
.bottom-menu-center-inner {
background:#fafafa;
border:1px solid #91b5dd;
border-radius:0.2rem;
min-height:4rem;
overflow-y:auto;
padding-bottom:0.5rem;
padding-left:1.5rem;
padding-right:1.5rem;
padding-top:0.8rem;
width:calc(100% - 3rem - 2px);
}
.bottom-menu a:link, .bottom-menu a:visited, .bottom-menu a:hover {
color:#3c87c1;
cursor:pointer;
text-decoration:none;
}
.bottom-menu div {
line-height:3.3rem;
}
.bottom-menu-h {
color:#1872c9;
font-size:0.8rem;
margin:0;
padding-bottom:0.3rem;
text-transform:uppercase;
}
.bottom-nav-title {
color:#1872c9;
font-size:0.8rem;
margin:0;
padding-bottom:1.2rem;
text-align:center;
}
.bottom-nav-title div {
border-bottom:1px solid #91b5dd;
border-top:1px solid #91b5dd;
display:inline-block;
line-height:1;
margin:0;
padding-bottom:0.4rem;
padding-left:1rem;
padding-right:1rem;
padding-top:calc(0.4rem + 2px);
}
.bottom-menu .left, .bottom-menu .right {width:1.4rem;}

.internal-link {
display:block;
font-size:0.9rem;
line-height:1.5em;
margin:0;
padding:0;
padding-bottom:0.5rem;
}
a.internal-link:link, a.internal-link:visited {
color:#202122;
text-decoration:none;
}
.internal-link h4 {
border-right:2px solid #fafafa;
color:#1872c9;
float:right;
font-size:0.8rem;
letter-spacing:normal;
margin:0;
padding-bottom:0rem;
padding-left:0.25rem;
padding-right:calc(0.25rem - 2px);
text-align:right;
}
a.internal-link:hover h4 {
border-right:solid 2px #87b8e7;
}

.office-date-select {
align-items:flex-end;
display:flex;
font-family:'Vollkorn', sans-serif;
justify-content:space-between;
margin-top:1rem;
padding-bottom:0.7rem;
width:100%;
}
.office-date-select a {
border:1px solid #cdcdcd;
font-size:0.9rem;
height:2.5rem;
line-height:2.5rem;
text-align:center;
width:16%;
}
.office-date-select a.evensong {
font-family:'Noto Sans Symbols 2';
}
.office-date-select a:link, .office-date-select a:visited {
color:#202122;
text-decoration:none;
}
.office-date-select a:hover {
background:#4e8cc7;
border:1px solid #4e8cc7;
color:white;
}
.office-date-select a:link.link-ep, .office-date-select a:visited.link-ep {color:#303132;}
.office-date-select a:hover.link-ep {color:white}
.office-subtitle {
color:#848889;
font-size:0.9rem;
font-style:italic;
font-weight:normal;
margin-bottom:0;
margin-left:auto;
margin-right:auto;
margin-top:0;
max-width:80%;
padding-top:0.2rem;
text-align:center;
}
.office-subtitle-inner {
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
display:inline-block;
margin:0;
padding-bottom:1px;
padding-left:1rem;
padding-right:1rem;
padding-top:3px;
}
.this-date {
background:#f2f2f2;
border:1px solid #cdcdcd;
color:#1872c9;
font-size:0.9rem;
height:2.5rem;
line-height:2.5rem;
text-align:center;
width:16%;
}

.selection-container {
cursor:pointer;
display:block;
font-size:0.8rem;
margin-bottom:0.5rem;
padding-left:2.1rem;
position:relative;
user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-webkit-user-select:none;
}
.selection-container input {
cursor:pointer;
height:0;
opacity:0;
position:absolute;
width:0;
}
.checkmark, .rmark {
background-color:#eee;
height:1.4rem;
left:0;
position:absolute;
top:0;
width:1.4rem;
}
.rmark {
border-radius:50%;
}
.selection-container:hover input ~ .checkmark, .selection-container:hover input ~ .rmark {
background-color:#ccc;
}
.selection-container input:checked ~ .checkmark, .selection-container input:checked ~ .rmark {
background-color:#2196f3;
}
.checkmark:after, .rmark:after {
content:"";
display:none;
position:absolute;
}
.selection-container input:checked ~ .checkmark:after, .selection-container input:checked ~ .rmark:after {
display:block;
}
.selection-container .checkmark:after {
border:solid white;
border-width:0 0.1875rem 0.1875rem 0;
height:0.6rem;
left:0.5rem;
top:0.25rem;
transform:rotate(45deg);
-ms-transform:rotate(45deg);
-webkit-transform:rotate(45deg);
width:0.3rem;
}
.selection-container .rmark:after {
background:white;
border-radius:50%;
height:0.5rem;
left:0.45rem;
top:0.45rem;
width:0.5rem;
}

.rubric {
color:#f04141;
font-size:1rem;
font-style:italic;
padding-left:0rem;
padding-right:2rem;
}
.rubric.attach {
margin-bottom:-0.5rem;
}
.newsect {
padding-top:1rem;
}
.compact p {
margin-top:0.4rem;
}

@media only screen and (max-width:40.5rem) {
.inner {
width:calc(100% - 1.5rem);
}
}
@media only screen and (max-width:40rem) {
.bottom-menu-left, .bottom-menu-right {
width:0.75rem;
}
.bottom-menu-center {
width:calc(100% - 1.5rem);
}
}