/*
Theme: Netherwood
Theme Name: Netherwood
Namespace: netherwood
Theme URI: https://jakearnott.com
Description: Theme for Blood Rival by Jake Arnott
Version: 0.1
Author: Nick W
Text Domain: netherwood

Stylesheet for Netherwood
Background #f7f9e6
Text #221f21
Red #ec3225
Black #000005

*/

/* structure */
body { margin:0; background-color:#f7f9e6; font-family: 'Roboto'; }
.longpage { margin:0; background-color:#f7f9e6; font-family: 'Roboto'; }
#liner { margin:0; background-color:#f7f9e6; }
#wrapper { max-width:1000px; margin:0 auto; position: relative; z-index: 10; background-color:#f7f9e6bb; }
#masthead { height:180px; }
#upper { min-height:500px;  margin:0 100px; }
#lower { min-height:50px; margin:0 100px; }
#footer { min-height:50px; width:100%; }
#tarrifs { margin:18px auto; text-align:center; display:inline-block;width:100%; color:#fff; }
#title-block { width:70%; height:180px; float:left; position: relative; }
#site-title { position: absolute; bottom:10px; left:100px; font-family:'Manrope'; text-transform:uppercase; font-weight: 700; letter-spacing: 3.5pt; }
#site-title a { color:#fff; }
#site-title a img { max-width: 500px; height: auto; }
#book-right { width:30%; height:180px; float:left; position:relative; }
#book-right img { position:absolute; top:21px; right:100px; z-index: 8; max-width: 180px; filter: drop-shadow(0px 4px 2px #888);  -webkit-filter: drop-shadow(0px 4px 2px #888); }
#content { margin: 60px 100px 100px 100px; display: inline-block; }
.post-wrap { margin-bottom: 10px; display: inline-block; width:100%; }
/* #content.landing { margin:80px 100px 0 100px; } */
#left { width:25%; padding: 20px 0 105% 0; float:left; }
#right { margin: 0 10px; }
#zwazwr { position:absolute; z-index: 100; pointer-events:none; }
.edit-this { display: inline-block; width: 100%; }
.post-edit-link {  color: #105f5f; }
.catnav.events { font-size: 28px; color: #707070; }

/* type */
.standfirst { font-size: 1.3em; }
h2 { color: #11100b; font-size: 36px; font-family:Times New Roman, serif; text-transform:uppercase; }
a { color: #ba1a34; text-decoration: none; }
p { font-size: 17px; line-height: 1.3; }
.inter { font-family:'Inter'; }
.wp-block-separator { border-color: #fff; border-top: 1px solid; }
.lyne { margin-top: 24px; display: inline-block; width: 100%; }
.buy-from { font-size:14px; margin:0 0 5px 0; }
.cite { margin-top: 0; display: inline-block; }

/* menu */
#menu-block { margin:0; display: inline-block; background-color: transparent; width:100%; }
#menu-header-menu { margin: 0 100px; padding: 20px 0; float: left; width: 60%; max-width: 800px; display: flex; justify-content: space-between; list-style: none; }
#menu-header-menu li { margin:0; padding:0; }
#menu-header-menu li a { color: #221f21; font-size:18px; text-decoration: none; }
#menu-header-menu li a:hover { color:#bcbcbc; }
#menu-header-menu li:first-of-type { margin-left:0; }

#menu-header-menu .current_page_item a, #menu-header-menu .current-menu-item a, #menu-header-menu .current-menu-parent a, #menu-header-menu .current-post-parent a { color: #9b9b9b; }

#menubtn { position:absolute; top:14px; left:100px; display:none; cursor:pointer; }
.dashicons-menu-alt3::before { color:#444; font-size: 36px; }
.dashicons-no-alt::before { color:#444; font-size: 48px; }
#close { position:absolute; top:22px; left:44px; display:none; cursor:pointer; z-index:10; }

#holding-header { margin: 0 100px; padding: 20px 0; float: left; width: 100%; max-width: 800px; color: #fff; }

/* social media */
.social { list-style:none; margin:10px 0 10px 0; padding:0; text-align: center; display: inline-block; width: 100%; }
.s-btn { display: inline-block; }
.s-btn img { display: block; width:100px; height:auto; }

/* Blog */
.journal h2, .journal h2 a { font-size:24px; color:#105f5f; text-decoration: none; text-transform:none; }
.journal .past h2, .journal .past h2 a { font-size: 24px; color: #777; text-decoration: none; text-transform: none; }
.journal .past h2 a:hover { font-size: 24px; color: #105f5f; }
.journal h2 a:hover { color: #d90d1b; }
.past .times { color:#777; }
.post-categories { display: inline-block; margin: 0; padding: 0; list-style:none; }
.post-categories li { display: inline-block; margin: 0 10px 10px 0; padding: 0; }
.wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; }
.wp-block-embed.wp-embed-aspect-16-9 iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

#navigation {display: inline-block; width: 100%; margin: 10px 0 30px 0; }
#navigation #next { float:right; margin-right:10px; }
.dashicons-controls-forward { float: right; margin-left: 6px;}
.dashicons-controls-back { margin-right: 6px; }
#navigation #previous { float:left; margin-left:10px; }
#navigation a { color:#105f5f; text-decoration: none; }
#navigation a:hover { color: #d90d1b; }
#backto { margin: 60px 100px 100px 100px; display: inline-block; }

/* wp-buttons */
.wp-block-buttons .wp-block-button__link { border-width: 1px; border-color:#000005; }
.wp-block-buttons .wp-block-button__link:hover { border-width: 1px; border-color:#ec3225; }

/* strange */
.bgleft { position: fixed; width: 50%; height: 100%; left:0px; background-image: url("images/waves-left.png"); background-repeat: repeat-y; background-position: 7% 2%; }
.bgright { position: fixed; width: 50%; height: 100%; right:0px; background-image: url("images/waves-right.png"); background-repeat: repeat-y; background-position: 95% 2%; }
.wonky-border { background-repeat: no-repeat; background-size: 100% 100%; background-image:url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%20standalone%3D%22no%22%3F%3E%0A%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%0A%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%201921%20163%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.5%3B%22%20preserveAspectRatio%3D%22none%22%3E%0A%20%20%20%20%3Cg%20transform%3D%22matrix(1%2C0%2C0%2C1%2C-1744.94%2C-1259.06)%22%3E%0A%20%20%20%20%20%20%20%20%3Cg%20transform%3D%22matrix(1%2C0%2C0%2C1%2C-39.8158%2C593.902)%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cpath%20d%3D%22M1801.9%2C673.597C1799.59%2C685.2%201790.04%2C692.727%201788.56%2C698.167L1792.86%2C703.19L1788.83%2C711.476L1794.64%2C718.41L1797.97%2C725.518L1788.95%2C732.137L1788.76%2C739.81L1787.88%2C742.987L1808.78%2C754.312L1806.14%2C762.152L1812.95%2C769.101L1805.71%2C774.608L1806.89%2C778.439L1792.08%2C786.901L1794.01%2C790.833L1788.25%2C796.509L1788.65%2C800.492L1796.74%2C807.325L1796.99%2C814.928L1816.72%2C817.94L1823.63%2C817.25L1854.7%2C819.52L1888.93%2C816.031L1907.16%2C817.415L1933.85%2C821.131L1977.17%2C818.698L2013.78%2C822.955L2059.18%2C818.399L2103.07%2C818.777L2154.45%2C816.38L2191.05%2C814.985L2205.7%2C817.812L2227.93%2C817.334L2247.97%2C819.142L2279.9%2C816.581L2337.05%2C816.9L2366.12%2C819.615L2392.66%2C819.781L2429.63%2C818.011L2484.87%2C812.589L2528.56%2C815.692L2554.97%2C815.74L2582.53%2C818.243L2651.52%2C817.296L2690.54%2C821.749L2753.33%2C819.817L2798.5%2C821.022L2819.12%2C823.266L2847.82%2C821.943L2862.32%2C824.748L2887.95%2C822.02L2910.22%2C823.702L2956.3%2C819.446L2996.72%2C822.177L3006.96%2C819.355L3056.71%2C819.157L3093.5%2C822.486L3142.66%2C819.811L3150.76%2C819.264L3205.54%2C820.056L3236.52%2C821.156L3270.33%2C820.652L3288.77%2C818.378L3335.68%2C816.088L3353.19%2C813.006L3376.97%2C813.282L3404.16%2C812.318L3438%2C814.823L3454.99%2C813.496L3472.45%2C815.217L3537.27%2C813.952L3562.01%2C811.732L3611.56%2C815.265L3657.98%2C814.801L3701.7%2C815.746L3693.88%2C804.924L3687.2%2C802.329L3682.21%2C795.224L3675.51%2C793.272L3675.89%2C787.217L3667.41%2C782.266L3677.83%2C774.56L3675.09%2C767.422L3681.15%2C762.319L3688.7%2C755.006L3681.05%2C739.81L3674.18%2C732.662L3678.42%2C727.422L3678.41%2C719.414L3690.7%2C711.74L3689.3%2C702.894L3696.71%2C696.436L3698.79%2C688.588L3702.14%2C682.499L3672.78%2C679.081L3655.89%2C676.181L3628.81%2C676.811L3616.22%2C675.848L3598.88%2C677.118L3566.88%2C673.849L3543.14%2C674.412L3430.77%2C670.849L3382.93%2C673.873L3348.74%2C673.984L3315.06%2C673.17L3279.28%2C672.802L3229.81%2C671.248L3175.43%2C674.453L3166.75%2C672.431L3144.74%2C673.333L3123.66%2C671.738L3094.28%2C674.424L3068.36%2C673.441L3031.13%2C677.769L2991.34%2C674.678L2944.38%2C677.226L2922.46%2C673.965L2873.81%2C672.442L2828.58%2C674.324L2788.12%2C670.795L2742.06%2C673.147L2713.25%2C671.89L2700.22%2C672.775L2652.41%2C674.165L2632.58%2C675.597L2609.06%2C677.645L2582.41%2C675.595L2561.46%2C678.266L2528.42%2C673.523L2495.01%2C672.156L2455.66%2C673.391L2416.3%2C671.331L2385.93%2C670.416L2374.32%2C671.647L2321.52%2C668.282L2283.82%2C671.583L2248.03%2C672.375L2213.4%2C673.338L2197.55%2C675.962L2177.48%2C674.073L2140.36%2C678.726L2120.79%2C677.971L2095.32%2C678.438L2068.93%2C677.094L2039.35%2C672.027L2011.09%2C674.359L1988.23%2C671.739L1964.66%2C673.417L1946.65%2C671.534L1931.38%2C673.687L1905.69%2C674.222L1881.79%2C676.582L1859.99%2C673.597L1828.49%2C672.67L1801.9%2C673.597Z%22%20style%3D%22fill%3Anone%3Bstroke%3Ablack%3Bstroke-width%3A6.25px%3B%22%2F%3E%0A%20%20%20%20%20%20%20%20%3C%2Fg%3E%0A%20%20%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A"); }
/* .menu-header-menu-container.shown::before { content: ""; background-image: url("images/decal1.jpg"); width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-repeat: repeat-y; background-color: transparent; background-position: right; transform: rotate(108deg); } */
/* responsive */
.outline img { border:0.25pt solid #777; }

@media screen and (max-width:960px){
   #book-right img { right:20px; }
}

@media screen and (max-width:920px){
    h2 { font-size:28px; }
    #menu-header-menu li { margin:0 10px; }
    #menu-header-menu { margin:0 0 0 100px; width:auto; }
    #site-title { width:75%; }
    #site-title a img { width: 100%; }
    
}

@media screen and (max-width:840px){
    #wrapper { margin:0 10px; background-color:#f7f9e6cc; }
    #wrapper.locked { position:fixed; }
    #menu-block { position: relative; height: 60px; }
    #menu-header-menu { visibility: hidden; margin: 0; display:block; }
    #menu-header-menu li { margin:0; }
    #menubtn { position:absolute; top:14px; left:100px; display:block; }
    #upper { margin:0 10px; }
    #lower { margin:0 10px; }
    #menu-header-menu { padding: 20px 0; margin:0; }
    #content { margin: 60px 10px 0 10px; }
    #menubtn { left:20px; }
    #site-title { left:10px; right:10px; width:60%; }
    .menu-header-menu-container { background: #f7f9e6; background-image: url("images/waves-right.png"); background-repeat: no-repeat; background-position: 120% 28px; position: fixed; width: 100%; height: 100%; top: 0; left: 0; visibility:hidden; opacity: 0; transition: all 0.5s; z-index: 8; }
    .menu-header-menu-container.shown { visibility:visible; opacity: 1; }
    .menu-header-menu-container.shown #menu-header-menu { visibility:visible; margin:100px 50px; }
    .menu-header-menu-container.shown #menu-header-menu li { display: inline-block; width: 100%; margin: 18px auto; }
    .menu-header-menu-container.shown #menu-header-menu li a { font-size: 32px; }
    #close.active { display:block; }
    #holding-header { margin:0 10px; width:auto; }
}
@media screen and (max-width:780px){
    #title-block { width: 100%; }
    /* .mugshot { background: black; } */
    .mugshot img { margin-left:10px; }
    #book-right { width: auto; height: auto; float: right; position: relative; }
    #book-right img { position: absolute; top: 100px; right: 20px; z-index: 8; max-width: 120px; }
    .wp-block-buttons > .wp-block-button.has-custom-width { max-width: 300px; }
}
@media screen and (max-width:666px){
    #site-title { font-size:64px; }
    /* #book-right { display: none; }*/
    #title-block { width:100%; }
}

@media screen and (max-width:500px){ 
    .bgright { display: none; }
    .bgleft { width:100%; }
}

@media screen and (max-width:480px){
    #site-title { width:85%; }
    #book-right { display:none; }
    .menu-header-menu-container.shown #menu-header-menu li a { font-size: 28px; }
    /* #site-title { font-size:12vw; } */
}

@media screen and (max-width:375px){
    #site-title { font-size:56px; }
    .menu-header-menu-container.shown #menu-header-menu li a { font-size: 21px; }
}