 /*
 *  Reset
*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,select,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
strong{font-weight:700;}
ol,ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}abbr,acronym{border:0;}

button::-moz-focus-inner {border:0; padding:0;}

 /*
 *  Fonts
*/

@font-face {
  font-family: 'TimesProRoman';
  src: url('/fonts/TimesProRoman.woff2') format('woff2'),
      url('/fonts/TimesProRoman.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

 /*
 *  Styles
*/

* {box-sizing:border-box;}

:root {

  --brand-pink: #b83a64;

  --base-font-size: 16px;

  --heading-font-family: 'TimesProRoman', sans-serif;
  --heading-font-size: 35px;

  --body-font-family: 'Helvetica Neue', 'Mulish', sans-serif;
  --body-font-size: 1rem;
  --body-font-color: rgba( 0,0,0, .9 );
  
  --font-awesome: "Font Awesome 5 Free";
  
  --gutter: 20px;
  
  --background-grey: #f7f7f7;
  
}

@media ( max-width:768px ){
  :root {
    --base-font-size: 18px;
  }
}

.preload * {transition:none !important;}

html {display:flex; flex-direction:column; min-height:100%; font-size:var(--base-font-size)}

body {--brandbg:#40444a; --brandfg:255,255,255; position:relative; flex:1; display:flex; flex-direction:column; width:100%; min-height:100%;}

body.noscroll {overflow:hidden;}

body,
input,
select,
textarea {font-family:var(--body-font-family); font-weight:normal; font-size:var(--body-font-size); line-height:150%; color:var(--body-font-color);}

h1 {margin:0 0 30px 0; font-family:var(--heading-font-family); font-size:var(--heading-font-size); line-height:150%; font-weight:normal;}
h2 {margin:0 0 30px 0; font-family:var(--heading-font-family); font-size:var(--heading-font-size); line-height:150%; font-weight:normal;}
h3 {margin:0 0 20px 0; font-family:var(--heading-font-family); font-size:var(--heading-font-size); line-height:150%; font-weight:normal;}

hr {margin:1.5em 0; border:0; border-bottom:1px solid rgba( 0,0,0, .1 );}

p {margin:0 0 1em 0;}
p:last-child {margin-bottom:0;}

ul {list-style:disc; margin:0 0 1em 20px;}
ul:last-child {margin-bottom:0;}

a:link,
a:visited {color:black;}
a:hover {text-decoration:none;}

strong {font-weight:bold;}
em {font-style:italic;}

button,
a.button {display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:10px 20px; background:black; border-radius:3px; /* background:var(--brandbg); color:rgba( var(--brandfg), 1 ); */ border:0; font-family:var(--body-font-family); font-size:1rem; line-height:120%; font-weight:normal; color:white; text-decoration:none; cursor:pointer;}

button:hover,
a.button:hover {background:rgba( 0,0,0, .8 ); /* background:var(--brandbg); opacity:.8; */ color:white;}

button i,
.button i {font-size:.6em; color:rgba( 255,255,255, .5 );}

button:disabled {background:rgba( 0,0,0, .5 ); cursor:default;}

form select,
form input[type="text"],
form input[type="number"],
form input[type="date"],
form input[type="password"],
form input[type="email"],
form textarea {padding:8px; border:0; background:rgba( 0,0,0, .05 );}

main {flex:1;}

.container {width:100%; max-width:1100px; margin:auto;}

@media ( max-width:1160px ){
  .container {max-width:100%; margin:0; padding:0 30px;}
}

@media ( max-width:600px ){
  .container {}
}

.pageresponse {position:relative; z-index:3; padding:20px 0; background:#fff585; font-weight:600;}

@media ( max-width:1160px ){
  .pageresponse {padding:20px;}
}

 /*
 *  Ideas (tags)
*/

.ideas {display:flex; flex-wrap:wrap; align-items:center; gap:10px;}
.ideas .idea {display:inline-flex; padding:5px 12px; background:rgba( 0,0,0, .1 ); border-radius:3px; color:rgba( 0,0,0, .8 ); font-size:10px; line-height:120%; text-decoration:none; cursor:pointer;}
.ideas .idea:hover {background:var(--brandbg); color:rgba( var(--brandfg), 1 );}
.ideas label {align-self:center; font-size:12px; line-height:120%; color:rgba( 0,0,0, .5 );}

@media (max-width:500px){
  .ideas label {flex:100%;}
}

 /*
 *  Header/nav
*/

header {position:sticky; top:0; z-index:4; padding:50px 0 30px 0; background:white; transition:padding .2s;}
header .container {max-width:none; padding:0 50px; transition:padding .2s;}
body.noscroll header {z-index:4;}
header .flex {display:flex;}
header .logo {flex:1; display:flex; align-items:center; margin:0 20px 0 0;}
header .logo img {max-height:50px; transition:max-height .2s; image-rendering:-webkit-optimize-contrast;}
header .logo .green {display:none;}
header .logo .white {display:flex !important;}

header .search {align-self:center; margin-right:40px;}
header .search .input {display:flex; align-items:center; justify-content:space-between; width:300px; padding:8px 14px; background:rgba( 0,0,0, .05 ); color:black;}
header .search .input input {width:100%; margin:0; padding:0; background:none; border:0; outline:none; color:black; font-size:14px;}
header .search .input input::placeholder {color:rgba( 0,0,0, .5 );}
header .search .input i {color:rgba( 0,0,0, .5 ); font-size:14px;}

header .quicklinks {display:flex; align-items:center; justify-content:flex-end; gap:50px;}
header .quicklinks a,
header .quicklinks button.search-button {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:15px; text-decoration:none;}
header .quicklinks button.search-button {padding:0; background:none; color:black;}
header .quicklinks a .label,
header .quicklinks button.search-button .label {flex:1; font-size:14px; line-height:120%;}
header .quicklinks a.button {background:rgba( 0,0,0, .8 );}
header .quicklinks a.button:hover {background:black;}
header .quicklinks a .image {position:relative; display:flex; flex-direction:column; align-items:center;}
header .quicklinks a img {display:block; height:24px;}
header .quicklinks a svg,
header .quicklinks button.search-button svg {display:block; height:24px;}
header .quicklinks a:hover,
header .quicklinks button.search-button:hover {color:var(--brandbg);}
header .quicklinks a:hover svg path,
header .quicklinks button.search-button:hover svg path {fill:var(--brandbg);}
header .quicklinks a.burger:hover svg path {stroke:var(--brandbg) !important;}

header .quicklinks .icon-dropdown {}
header .quicklinks .icon-dropdown > a {margin:0;}

header .quicklinks .subscribe > a {text-decoration:none;}
header .quicklinks .subscribe:hover > a {background:none;}

header .quicklinks .favourites {position:relative; text-decoration:none;}
header .quicklinks .favourites.favourited > a {color:var(--brand-pink);}
header .quicklinks .favourites i.fa-spinner,
header .quicklinks .favourites.favourited i {font-weight:bold;}
header .quicklinks .favourites .badge {position:absolute; bottom:0; right:0; transform:translate(50%,30%); display:flex; justify-content:center; align-items:center; min-width:13px; height:13px; padding:2px; border-radius:50%; background:var(--brand-pink); border:1px solid white; color:white; font-size:9px; font-weight:bold;}
header .quicklinks .favourites:not(.highlight) .badge {display:none;}
header .quicklinks .favourites.favourited .on {display:none;}
header .quicklinks .favourites:not(.favourited) .un {display:none;}

header .quicklinks .burger {font-size:30px;}
header .quicklinks .burger i {font-size:30px; color:rgba( 0,0,0, .75 );}
header .quicklinks .line {align-self:stretch; width:0px; margin:0 15px; border-right:1px solid rgba( 0,0,0, .1 );}

.dropdown {position:relative; --options-bg:black;}
.dropdown .options {transition:all .15s; position:absolute; top:100%; left:50%; min-width:150%; transform:translate(-50%,0);}
.dropdown .options:before {content:'\f0d8'; font-family:var(--font-awesome); display:flex; justify-content:center; margin-bottom:-9px; font-weight:bold; font-size:24px; color:var(--options-bg);}
.dropdown .options .inner {display:flex; flex-direction:column; padding:10px; background:var(--options-bg); border-radius:3px; font-size:.8em; line-height:1.4em;}
.dropdown .options a {margin:0; padding:8px 10px; text-decoration:none; color:white;}
.dropdown .options a:hover {background:rgba( 255,255,255, .2 );}
.dropdown:not(:hover) .options {opacity:0; transform:translate(-50%,-10px); pointer-events:none;}
.dropdown:hover > a {background:black;}
.dropdown:hover > a i {font-weight:bold;}

header .dropdown.icon-dropdown .options {min-width:200px;}
header .dropdown.icon-dropdown:hover > a {background:none;}

header .dropdown.favourites a[data-favourite-link]:not(.visible) {display:none;}

header.no-transition,
header.no-transition .logo img {transition:none !important;}

/*
@media ( min-width:1061px ){
  header.fixed-top {position:absolute; top:0; left:0; right:0;}
}
*/
header.fixed {/* position:fixed; top:0; left:0; right:0; */ padding:20px 50px; /* background:#f2f2f2; */ box-shadow:0 0 8px 2px rgba( 0,0,0, .2 );}
header.fixed > .container {padding:0;}
header.fixed .logo img {max-height:30px;}

@media ( max-width:1060px ){
  body {padding-top:0 !important;}
}

@media ( max-width:1160px ){
  header .container {padding:0 30px;}
}

@media ( max-width:900px ){
  header,
  header.fixed {padding:20px 30px;}
  header .container {padding:0;}
  header .flex {flex-direction:column; align-items:center;}
  header .quicklinks {margin:20px 0 0 0; align-items:center;}
  header .logo {max-width:75%; margin:0;}
  header .logo img {max-height:30px;}
  header .logo .white {max-width:100%;}
}

@media ( max-width:600px ){
  header .flex {flex-direction:row; justify-content:space-between;}
  header .logo {max-width:100%;}
  header .quicklinks {margin:0 0 0 20px;}
  header .quicklinks > *:not(.burger) {display:none;}
  header .quicklinks .burger {margin:0;}
}

nav {transition:all .2s; position:fixed; z-index:1000; left:0; top:0; display:flex; align-items:flex-start; justify-content:flex-end; width:100%; height:100%; /* padding:40px 60px; */ /* background:#e6e6e6; */ background:none;}
nav .upper {width:100%; background:white;}
nav .container {display:flex; flex-direction:column; margin:0 auto; padding:50px;}
header.fixed nav .container {padding-top:20px;}
nav:not(.visible) {opacity:0; pointer-events:none;}
nav .inner {position:relative; display:inline-flex; align-items:flex-start; gap:80px; margin:30px 0 0 0;}
nav .inner > * {flex:1;}
nav ul {display:flex; flex-direction:column; gap:15px; margin:0; list-style:none; font-size:1rem;}
nav .inner > ul {padding-bottom:60px;}
nav ul li:first-child {margin-left:0;}
nav ul a:link,
nav ul a:visited {display:inline-flex; align-items:center; padding:2px 0; text-decoration:none; font-weight:normal; color:black;}
nav ul a:hover,
nav ul a:active {color:var(--brandbg);}
nav ul ul a:link,
nav ul ul a:visited {color:rgba( 0,0,0, .5 );}
nav ul ul a:hover {color:rgba( 0,0,0, 1 );}
nav ul ul a:before {content:'+'; margin-right:5px;}
nav ul ul ul a {padding-left:60px;}
nav ul li.logo {display:flex; margin-top:80px;}
nav ul li.logo:not(:first-child) {margin-top:80px;}
nav .social {display:flex; align-items:center; margin-top:40px; margin-top:80px; font-size:18px;}
nav .social:not(:first-child) {margin-top:40px; /* margin-top:60px; */}
nav .social a:link,
nav .social a:visited {font-weight:normal; text-decoration:none;}
nav .social a:hover {color:rgba( 0,0,0, .8 ); color:rgba( var(--brandfg), .8 );}
nav .social a:not(:first-child) {margin-left:25px;}
nav .social svg {width:40px; aspect-ratio:1/1;}
nav .social .twitter-x svg {width:35px;}
nav .social svg path {fill:black;}
nav .social a:hover svg path {fill:var(--brandbg);}
nav .contact {margin-top:20px; color:rgba( 0,0,0, .5 ); color:rgba( var(--brandfg), .5 ); font-size:11px; line-height:1.6em;}
nav .contact a:link,
nav .contact a:visited {color:rgba( 0,0,0, .5 ); color:rgba( var(--brandfg), .5 ); text-decoration:underline;}
nav .contact a:hover {text-decoration:none;}
nav .contact p:last-child {display:flex; flex-direction:column; align-items:flex-start;}
/*
nav .close {position:absolute; top:0; right:0; color:rgba( 255,255,255, .5 ); font-size:32px; transition:all .2s;}
*/

nav .ideas {max-width:200px;}
nav .ideas .idea {background:rgba( 0,0,0, .05 );}
nav .ideas .idea:hover {background:var(--brandbg); color:white;}

/* DISABLED FOR NOW */
nav .ideas {visibility:hidden; pointer-events:none;}

@media ( max-width:900px ){
  nav .ideas {display:none;}
}

nav .top {display:flex; align-items:flex-start; justify-content:space-between; gap:40px; width:100%;}
nav .top .nav-logo {align-self:center;}
nav .top .nav-logo img {max-height:50px;}

nav .subtitle {margin:40px 0 40px 0; font-size:24px; line-height:120%; font-family:var(--heading-font-family);}

nav .close {display:flex; flex-direction:column; justify-content:center; align-items:center; gap:15px; color:black; text-decoration:none;}
nav .close svg {height:24px;}
nav .close:hover svg path {stroke:var(--brandbg) !important;}
nav .close .label {font-size:14px; line-height:120%;}
header:not(.fixed) nav .close {line-height:46px;}
nav .close:hover {color:var(--brandbg);}
nav hr {margin:10px 0; border-color:rgba( 255,255,255, .1 );}

nav .special-links {margin-top:30px;}

@media ( min-width:901px ){
  nav .show-mobile {display:none;}
}

@media ( max-width:1160px ){
  nav .container {padding:50px 30px;}
}

@media ( max-width:900px ){

  header .search-form .input {display:none;}

  nav {padding:30px; overflow:auto; background:white;}
  nav .container {padding:0;}
  nav .upper {}
  nav .inner {position:static; flex-direction:column; gap:30px; width:100%; margin-top:20px; padding:0;}
  nav .top .nav-logo img {max-height:30px;}
  nav ul {gap:5px; padding:0;}
  nav .inner > ul {padding-bottom:0;}
  nav ul ul {margin-top:3px; font-size:1.2rem; line-height:1.2rem;}

  nav .contact {color:rgba( 0,0,0, .5 );}

  nav .ideas {max-width:100%;}

  nav ul a:link,
  nav ul a:visited {padding:6px 0;}
  /*
  nav .inner > ul:not(:first-child) {margin:0; padding:0; border:0; margin-top:30px; padding-top:30px; border-top:1px solid rgba( 255,255,255, .1 );}
  */
  nav .close {position:absolute; top:25px; right:32px;}
  header.fixed nav .close {top:22.5px;}
  header:not(.fixed) nav .close {line-height:36px;}

}


.socialfooter {position:relative; padding:20px 30px; background:rgba( 0,0,0, .05 );}
.socialfooter .container {display:flex; justify-content:center; gap:50px;}
.socialfooter .twitter {--social-color:#4099ff;}
.socialfooter .facebook {--social-color:#3b5998;}
.socialfooter .instagram {--social-color:#a64931;}
.socialfooter a {display:flex; align-items:center; text-decoration:none; color:black;}
.socialfooter a:hover {color:var(--social-color);}
.socialfooter a i {margin-right:8px; color:var(--social-color);}

@media ( max-width:600px ){
  .socialfooter .container {flex-direction:column; justify-content:flex-start; align-items:center; gap:20px;}
}

.pre-footer {padding:30px 0; background:rgba( 0,0,0, .8 ); color:white; background:var(--brandbg); color:rgba( var(--brandfg), 1 );}
.pre-footer .container {display:flex; justify-content:space-between; gap:20px;}
.pre-footer p {margin:0; font-size:1.4em; line-height:1.4em; font-weight:bold;}
.pre-footer .button {background:white; color:black;}
.pre-footer .button:hover,
.pre-footer .dropdown:hover > a.button {background:rgba( 255,255,255, .8 ); color:black;}

@media ( max-width:900px ){
  .pre-footer .container {flex-direction:column; justify-content:flex-start; align-items:center;}
  .pre-footer p {text-align:center;}
  .pre-footer .dropdown:hover .options {display:none;}
}

footer {margin:0; color:white; font-size:14px; line-height:1.4em;}

footer .top {padding:60px 0; background:#2d2e35;}
footer .top a:link,
footer .top a:visited {color:white;}

footer hr {display:flex; width:100%; height:3px; border:0; background:var(--hr-white-url) top left repeat-x; background-size:contain;}

footer .actions {margin-bottom:40px; text-align:center;}
footer .actions a.button {color:white; border-color:white; font-family:var(--heading-font-family); font-size:18px;}
footer .actions a.button:not(:first-child) {margin-left:20px;}
footer .actions a.button:hover {background:white; color:var(--brand-green);}

footer .container.parts {display:flex; padding:30px 0;}
footer section {flex:1; margin:0 15px;}
footer section.logo {flex:3; display:flex; flex-direction:column; align-items:flex-start; gap:20px;}
footer section.logo img {max-height:40px; image-rendering:-webkit-optimize-contrast;}
footer section.logo .tagline {font-family:var(--heading-font-family); font-size:18px; line-height:140%;}
footer section.logo .links {display:flex; flex-direction:column;}
footer section.logo .links a:link,
footer section.logo .links a:visited {text-decoration:underline;}
footer section.logo .links a:hover {text-decoration:none;}
footer section.logo .links a:not(:last-child) {margin-bottom:3px;}
footer section a:link,
footer section a:visited {color:black; text-decoration:none;}
footer section a:hover {text-decoration:underline;}
footer section.nav ul {list-style:none; display:flex; flex-direction:column; align-items:flex-start;}
footer section.nav a:link,
footer section.nav a:visited {display:flex; margin:0 0 .5em 0;}
footer section.nav a:hover {}
footer section.nav a:not(:first-child) strong {margin-top:8px;}
footer section.ideas {flex:1.5; align-self:flex-start; align-items:flex-start; gap:8px;}
footer section.ideas .idea {flex:0; padding:5px; background:#e8e8e8; color:black; white-space:nowrap;}

/*
footer section p:before {content:''; display:flex; width:100%; height:3px; margin:0 0 .75em 0; background:url('/images/hr.png') top left repeat-x; background-size:contain;}
*/

footer .supporters {background:rgba( 0,0,0, .125 );}
footer .supporters .container {display:grid; grid-template-columns:repeat( var(--item-count), auto ); gap:30px; align-items:center; justify-content:center; padding:30px 80px;}
footer .supporters p {display:contents;}
footer .supporters a {}
footer .supporters img {display:block; max-width:100%;}

@media ( min-width:901px ){
  footer .supporters img.registered-charity {max-height:50px;}
  footer .supporters img {max-height:60px;}
}

@media ( max-width:900px ){
  footer .supporters {padding:30px;}
  footer .supporters .container {grid-template-columns:repeat( 2, 1fr ); justify-items:center; gap:30px 60px; padding:0;}
  footer .supporters img {max-width:175px; max-height:50px;}
}

@media ( max-width:768px ){
  footer .supporters img {max-width:100%;}
}

@media ( max-width:600px ){
  footer .supporters {grid-template-columns:repeat( 2, auto ); grid-gap:30px;}
}

footer .address {margin:0 0 1em 0;}
footer .acknowledgement {margin:0 0 1em 0; max-width:280px; font-size:14px; line-height:1.2em; color:white;}

footer .copyright {padding:30px 0; background:white; text-align:center; font-size:11px; line-height:1.2em; color:rgba( 0,0,0, .8 );}
footer .copyright a:link,
footer .copyright a:visited {color:rgba( 0,0,0, .9 );}

footer .contact-details .address {margin:10px 0;}
footer .contact-details hr {margin:10px 0;}
footer .contact-details p {margin:0 0 10px 0;}
footer .contact-details p.email {font-size:.9em;}

footer .social {display:flex; align-items:center;}
footer .social a:link,
footer .social a:visited {display:flex; align-items:center; justify-content:center; font-size:24px; color:white;}
footer .social svg {width:36px; aspect-ratio:1/1;}
footer .social .twitter-x svg {width:32px;}
footer .social svg path {fill:white;}
footer .social a:hover {color:white; text-decoration:none;}
footer .social a:hover svg path {fill:var(--brandbg);}
footer .social a:not(:first-child) {margin-left:20px;}


@media ( max-width:900px ){
  
  footer .top {display:flex; flex-direction:column; gap:30px; padding:30px 0;}
  footer .top .container {padding:0 30px;}
  footer section {margin:0;}

  footer .container {padding:30px;}
  footer .container.parts {flex-direction:column; text-align:center; gap:30px;}
  footer section.logo {gap:30px; align-items:center; text-align:center;}
  footer .email {text-align:center;}
  footer section.ideas {justify-content:center;}
  footer section p {width:100%; margin:0;}
  footer section.nav {margin:0;}
  footer section.nav a {justify-content:center;}
  footer hr.hide-mobile {opacity:.5;}
  footer .social {justify-content:center;}
  footer .acknowledgement,
  footer p.acknowledgement:last-child {max-width:none;}

  footer .copyright {padding:0;}
}

@media ( max-width:600px ){
  footer .actions a.button:not(:first-child),
  footer .actions a {margin:10px;}
  footer section.logo {}
}


section.tagline {padding:60px 0; font-size:40px; line-height:120%; font-family:var(--heading-font-family);}
section.tagline .container {max-width:none; padding:0 50px;}

@media ( max-width:1160px ){
  section.tagline .container {padding:0 30px;}
}

@media ( max-width:1024px ){
  section.tagline {padding:30px 0; font-size:24px; line-height:120%;}
}


 /*
 *  Home page sections
*/

section.home-articles {margin:20px 0; padding:30px 0;}

section.home-articles .cards:not(:last-child) {margin-bottom:50px;}

@media ( min-width:1025px ){
  section.home-articles {padding:60px 0;}
}

section.home-issue {position:relative; background:rgba( 0,0,0, .05 );}
section.home-issue .container {position:relative;}
section.home-issue a.container {text-decoration:none;}
section.home-issue .image {position:relative; z-index:1;}
section.home-issue .image img {display:block; width:100%;}
section.home-issue .columns {display:flex;}
section.home-issue .left {flex:1;}
section.home-issue .middle {flex:2; margin:0 40px;}
section.home-issue .right {flex:1;}
section.home-issue .cards {grid-template-columns:repeat( 2, 1fr );}
section.home-issue .editorial {grid-column:span 2;}

section.home-issue .left .image img {max-width:100%;}

section.home-issue .info {position:absolute; left:80px; bottom:80px; z-index:2; display:flex; flex-direction:column; gap:20px; max-width:400px;}
section.home-issue .title {color:white; font-family:var(--heading-font-family); font-size:45px; line-height:120%;}
section.home-issue a.title {text-decoration:none;}
section.home-issue .ideas .idea {padding:5px 12px; background:white;}
section.home-issue .ideas .idea:hover {background:var(--brandbg);}

@media ( min-width:1100px ){
  section.home-issue .container {/* max-width:1400px; */ max-width:none;}
}

@media ( max-width:1160px ){
  section.home-issue .container {padding:0;}
}

@media ( max-width:1024px ){
  section.home-issue .info {position:relative; left:auto; bottom:auto; max-width:100%; padding:30px; word-break:break-word;}
  section.home-issue .title {color:black;}

  section.home-issue .columns {flex-direction:column;}
  section.home-issue .middle {margin:30px 0 0 0;}
}

@media ( max-width:600px ){
  section.home-issue .cards {grid-template-columns:1fr;}
  section.home-issue .editorial {grid-column:span 1;}
}


section.home-feature {margin:40px 0; padding:80px 0; background:linear-gradient( -5deg, #f2cfb1 45%, #f5d9c1 45% );}
section.home-feature .container {display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:40px;}
section.home-feature .image {aspect-ratio:3/2; background-size:cover;}
section.home-feature .details {grid-column:span 2; padding:10px;}
section.home-feature .name {font-size:1.8em; line-height:1.2em; font-weight:bold;}
section.home-feature .author {margin-top:5px; font-size:1.4em; line-height:1.4em; font-family:var(--heading-font-family);}
section.home-feature .intro {margin-top:30px; font-style:italic; line-height:1.6em;}
section.home-feature .gallery {grid-column:span 3; display:grid; grid-template-columns:repeat( 3, 1fr ); grid-gap:40px;}
section.home-feature .gallery .image {width:100%;}
section.home-feature .buttons {grid-column:span 3; display:flex; justify-content:flex-end; margin-top:10px;}
section.home-feature .buttons .button {background:black; color:white;}

@media ( max-width:768px ){
  section.home-feature {padding:40px 0;}
  section.home-feature .container {grid-template-columns:1fr;}
  section.home-feature .buttons,
  section.home-feature .details {grid-column:1;}
  section.home-feature .gallery {grid-column:1; grid-template-columns:1fr;}
  section.home-feature .image.empty {display:none;}
}

section.home-reviews {margin:80px 0; width:100%;}
section.home-reviews .container {display:flex; max-width:100%; width:100%;}
section.home-reviews .header {display:flex; flex-direction:column; width:260px; padding:30px 40px; background:#23272a; color:white; font-size:.8em; line-height:1.4em;}
section.home-reviews .header h3 {margin-bottom:60px;}
section.home-reviews .header h3 a {text-decoration:none;}
section.home-reviews .header a {display:inline-block; color:white;}
section.home-reviews .header a:not(:last-child) {margin-bottom:5px;}
section.home-reviews .list {position:relative; overflow:hidden; display:flex; flex-direction:column; flex:1; padding:80px 40px; background:#383b40;}
/*
section.home-reviews .list:after {content:''; pointer-events:none; position:absolute; z-index:2; right:0; top:0; width:200px; height:100%; background:linear-gradient( to right, rgba( 59,56,64, 0 ), #383b40 80% );}
*/

section.home-reviews .arrows {position:relative; transform:translateY(-40px); z-index:3; display:flex; justify-content:flex-end;}
section.home-reviews .arrows i {transition:color .2s; color:rgba( 255,255,255, .5 ); font-size:20px; cursor:pointer;}
section.home-reviews .arrows i:hover {color:white;}
section.home-reviews .fa-arrow-left {margin-right:20px;}

section.home-reviews .cards {flex:1; position:relative; z-index:1; max-width:100%; gap:0;}
section.home-reviews .cards .slick-list {margin-top:30px;}
section.home-reviews .cards .card {flex:1; width:240px; margin:0 15px; background:none; border:0; color:white;}
section.home-reviews .cards .card .image {overflow:hidden; aspect-ratio:4/3;}
section.home-reviews .cards .card .details {display:flex; flex-direction:column; gap:5px; padding:20px 0 0 0;}
section.home-reviews .cards .card .type {display:none;}
section.home-reviews .cards .card .author {color:rgba( 255,255,255, .5 ); font-family:var(--heading-font-family);}

@media ( max-width:1160px ){
  section.home-reviews .container {padding:0;}
}

@media ( max-width:900px ){
  section.home-reviews .container {flex-direction:column;}
  section.home-reviews .header {width:100%;}
  section.home-reviews .header h3 {margin-bottom:30px;}
  section.home-reviews .list {padding:30px;}
  section.home-reviews .list:before {content:''; pointer-events:none; position:absolute; z-index:2; left:0; top:0; width:90px; height:100%; background:linear-gradient( to left, rgba( 59,56,64, 0 ), #383b40 80% );}
  section.home-reviews .list:after {width:90px;}
  section.home-reviews .arrows {display:none;}
}


section.home-back-issues {position:relative; padding:30px 0; background:rgba( 0,0,0, .025 );}
section.home-back-issues .container {position:relative;}
section.home-back-issues h3 {margin:0 0 30px 0; text-align:center; font-family:var(--heading-font-family); font-size:2em; line-height:1.4em; font-weight:normal; color:rgba( 0,0,0, .5 );}
section.home-back-issues .fa-arrow-left,
section.home-back-issues .fa-arrow-right {position:absolute; z-index:3; top:50%; transform:translateY(-50%); font-size:30px; cursor:pointer; color:rgba( 0,0,0, .5 );}
section.home-back-issues .fa-arrow-left {left:30px;}
section.home-back-issues .fa-arrow-right {right:30px;}
section.home-back-issues .fa-arrow-left:hover,
section.home-back-issues .fa-arrow-right:hover {color:rgba( 0,0,0, 1 );}
section.home-back-issues .fa-arrow-left {opacity:0; pointer-events:none;}
section.home-back-issues .grid:after {content:''; pointer-events:none; position:absolute; z-index:2; right:0; top:0; width:200px; height:100%; background:linear-gradient( to right, rgba( 249,249,249, 0 ) 0%, #f9f9f9 80% );}
section.home-back-issues .card {margin:0 30px; background:none;}
section.home-back-issues .card .image {margin-bottom:10px;}
section.home-back-issues .card .name {border-bottom:0; font-weight:bold; width:100%; font-size:var(--base-font-size); text-decoration:none;}
section.home-back-issues .card .issue {margin-top:5px; font-size:12px; text-transform:none; font-family:var(--heading-font-family); font-weight:normal; color:#666; text-decoration:none;}

@media ( max-width:1200px ){
}

@media ( min-width:901px ) and ( max-width:1200px ){
  section.home-back-issues .fa-arrow-left {opacity:0; pointer-events:none;}
}

@media ( max-width:900px ){
  section.home-back-issues .card {margin:0 15px;}
  section.home-back-issues .grid:before {content:''; pointer-events:none; position:absolute; z-index:2; left:0; top:0; width:90px; height:100%; background:linear-gradient( to left, rgba( 249,249,249, 0 ), #f9f9f9 80% );}
  section.home-back-issues .grid:after {width:90px;}
  section.home-back-issues .fa-arrow-left,
  section.home-back-issues .fa-arrow-right {opacity:0; pointer-events:none;}
}


section.home-testimonial {padding:80px 0;}
section.home-testimonial .container {display:flex; flex-direction:column; align-items:center; max-width:700px; margin:0 auto;}
section.home-testimonial .testimonial {display:grid; grid-template-columns:1fr 1fr; grid-gap:30px; align-items:center; padding:70px 0;}
section.home-testimonial .mark {position:relative; width:100%; border-bottom:2px solid rgba( 0,0,0, .05 ); text-align:center; font-size:140px; line-height:1em; font-family:var(--heading-font-family); color:rgba( 0,0,0, .075 );}
section.home-testimonial .mark span {position:absolute; top:0; left:50%; transform:translate(-50%,-50%); height:40px; padding:0 30px; background:white;}
section.home-testimonial .quote {grid-column:span 2; font-family:var(--heading-font-family); text-align:center; font-style:italic; font-size:1.2em; line-height:1.4em;}
section.home-testimonial .name {justify-self:flex-end; font-weight:bold;}
section.home-testimonial .name:last-child {grid-column:span 2; justify-self:center;}
section.home-testimonial .source {padding-right:40px; color:rgba( 0,0,0, .5 ); font-size:.75em; line-height:1.2em;}

@media ( max-width:480px ){
  section.home-testimonial .testimonial {grid-template-columns:1fr;}
  section.home-testimonial .testimonial .name,
  section.home-testimonial .testimonial .source {justify-self:center;}
  section.home-testimonial .testimonial .source {padding:0;}
  section.home-testimonial .testimonial .quote,
  section.home-testimonial .testimonial .name:last-child {grid-column:1;}
}


section.home-profiles {padding:40px 0;}
section.home-profiles a.home-profile {display:flex; text-decoration:none;}

section.home-profiles .home-profile .details {position:relative; flex:2; padding:30px 40px 30px 30px; background:rgba( 0,0,0, .1 );}
section.home-profiles .home-profile .details .badge {position:absolute; left:30px; top:0; padding:10px 20px; transform:translateY(-10px); background:#333; color:white; text-transform:uppercase; font-size:.8em; line-height:1em;}
section.home-profiles .home-profile .details .name {margin:30px 0 10px 0; font-size:1.4em; line-height:1.4em; font-weight:bold;}
section.home-profiles .home-profile .details .date {}
section.home-profiles .home-profile .details hr {margin:30px 0;}
section.home-profiles .home-profile .details .intro {color:rgba( 0,0,0, .5 ); font-family:var(--heading-font-family);}

section.home-profiles .home-profile .image {flex:3; background:center; background-size:cover;}
section.home-profiles .home-profile .image.empty {background:rgba( 0,0,0, .15 );}
section.home-profiles .home-profile .image img {display:none;}

@media ( max-width:1024px ){
  section.home-profiles a.home-profile {flex-direction:column;}
  section.home-profiles a.home-profile .image {aspect-ratio:3/2}
  section.home-profiles .home-profile .image.empty {display:none;}
}


section.promo {}
section.promo .container {position:relative; display:flex; flex-direction:column; gap:120px; padding:60px; background-color:var(--promo-color);}
section.promo .text {font-family:var(--heading-font-family); font-size:36px; line-height:120%; color:white;}
section.promo .link .button {background:white; color:black;}
section.promo .link .button i {color:black;}
section.promo .link .button:hover {opacity:.85;}
section.promo .logo {position:absolute; right:60px; bottom:60px; width:140px;}
section.promo.button-right .link {display:flex; justify-content:flex-end;}
section.promo.button-right .logo {left:60px; right:auto;}

@media ( max-width:1024px ){
  section.promo .container {gap:40px; padding:40px;}
  section.promo .text {font-size:24px; line-height:120%;}
  section.promo .logo {display:none;}
}

section.articles {margin:40px 0;}


section.article-with-image {--bg-color:rgba( 0,0,0, .05 ); background-color:var(--bg-color);}
section.article-with-image .container {position:relative; display:flex; flex-direction:column; max-width:100%; background:var(--bg-color);}
section.article-with-image a.container {text-decoration:none;}
section.article-with-image .image {width:100%; background:center no-repeat; background-size:cover;}
section.article-with-image .image img {opacity:0; width:100%;}
section.article-with-image .text {position:absolute; left:80px; bottom:80px; display:flex; flex-direction:column; gap:10px;}
section.article-with-image .title {max-width:400px; font-size:45px; line-height:120%; color:white; font-family:var(--heading-font-family);}
section.article-with-image a.title {text-decoration:none;}
section.article-with-image .author {font-size:16px; line-height:120%; color:white;}
section.article-with-image .ideas .idea {padding:5px 12px; background:white;}
section.article-with-image .ideas .idea:hover {background:var(--brandbg);}

@media ( min-width:1100px ){
  section.article-with-image .container {/* max-width:1400px; */ max-width:none;}
}

@media ( max-width:1160px ){
  section.article-with-image .container {padding:0;}
}

@media ( max-width:1024px ){
  section.article-with-image .container {padding:0;}
  section.article-with-image .text {position:relative; left:auto; bottom:auto; padding:30px;}
  section.article-with-image .title,
  section.article-with-image .author {color:black;}

  section.article-with-image .columns {flex-direction:column;}
  section.article-with-image .middle {margin:30px 0 0 0;}
}


 /*
 *  Sub page sections
*/

.content section {}

.content section.snip {padding:30px 0; font-family:var(--heading-font-family); color:rgba( 0,0,0, .5 );}
.content section.snip .container {}

.content section.text {padding:30px 0;}
.content section.text .container {}
.content section.text blockquote {margin:20px 0 20px 20px; padding:10px 20px; border-left:5px solid rgba( 0,0,0, .15 ); font-style:italic;}
.content section.text blockquote:last-child {margin-bottom:0;}

.content section.text h3 {font-size:24px; line-height:140%;}
.content section.text em {font-style:italic;}
.content section.text hr {}

.content section.text table {margin:0 0 1em 0;}
.content section.text table td {padding:10px 20px 10px 10px; border:1px solid rgba( 0,0,0, .1 );}

hr.dots {display:flex; width:100%; height:3px; background:var(--hr-green-url) top left repeat-x; background-size:contain; border:0;}
.content section.hr hr {}

@media ( max-width:1160px ){
  .content section.text .container {padding:0 30px;}
  .content section.hr {padding:0 30px;}
}

@media ( max-width:1024px ){
  .content section.text .container {padding:0 30px;}
}

.content section.columns .container {display:flex; padding:0 30px;}
.content section.columns .container .column {flex:1;}
.content section.columns .container .column:first-child {margin-right:30px;}
.content section.columns .container .column:last-child {margin-left:30px;}
@media ( max-width:900px ){
  .content section.columns .container {flex-direction:column;}
  .content section.columns .container .column,
  .content section.columns .container .column:first-child,
  .content section.columns .container .column:last-child {margin:0 0 1em 0;}
}

.content section.title {padding-top:40px;}
.content section.title:first-child {padding-top:20px;}
.content section.title:first-child .container {padding-top:30px; border-top:1px solid rgba( 0,0,0, .1 );}
.content section.title h2 {margin:0;}
.content section.title .padding {padding:0 30px;}

@media ( max-width:1160px ){
  .content section.title .container {padding:0 30px;}
}

@media ( max-width:900px ){
  .content section.title .container {padding:0 30px;}
}

@media ( max-width:900px ){
  .content section.title .padding {padding:0;}
}

.content section.gallery {margin:0 0 30px 0;}
.content section.gallery .container {display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:30px;}
.content section.gallery img {max-width:100%;}

@media ( max-width:1160px ){
  .content section.gallery {padding:0 30px;}
}

@media ( max-width:600px ){
  .content section.gallery .container {display:grid; grid-template-columns:repeat(2, 1fr); grid-gap:30px;}
}

@media ( max-width:400px ){
  .content section.gallery .container {display:grid; grid-template-columns:repeat(1, 1fr); grid-gap:30px;}
}

.content section.pdf-embed {width:100%; padding:30px 0; background:var(--background-grey);}
.content section.pdf-embed iframe {width:100%; height:55vw; border:0;}

@media ( max-width:1160px ){
  .content section.pdf-embed {padding:0;}
}

.content section.crumbs {width:100%;}
.content section.crumbs .container {padding:30px 0;}
.content section.crumbs .container:after {content:''; display:flex; width:100%; height:3px; margin:15px 0 0 0; background:var(--hr-green-url) top left repeat-x; background-size:contain;}
.content section.crumbs .inner {padding:0 30px;}
.content section.crumbs a:link,
.content section.crumbs a:visited {color:var(--brand-green); text-decoration:none;}
.content section.crumbs a:hover {text-decoration:underline;}
.content section.crumbs span {margin:0 10px; color:rgba( 0,0,0, .25 );}

@media ( max-width:600px ){
  .content section.crumbs .container {padding:10px 0;}
}

.content section.featured-text.green {padding:40px 0; text-align:center; font-family:var(--heading-font-family); font-size:22px; line-height:1.4em; color:var(--brand-green);}
.content section.featured-text.green p {max-width:700px; margin:0 auto 1em auto;}

.content section.featured-text.charcoal {margin:30px 0; padding:40px 0; background:rgba( 0,0,0, .75 ); font-family:var(--heading-font-family); font-size:22px; line-height:1.4em; color:white;}
.content section.featured-text.charcoal .container {padding:0 30px;}
.content section.featured-text.charcoal strong {font-size:24px; line-height:1.4em;}

.content section.featured-text.white-left {margin:30px 0; padding:40px 0; background:rgba( 0,0,0, .03 ); font-family:var(--heading-font-family); font-size:22px; line-height:1.4em;}
.content section.featured-text.white-left .container {padding:0 30px;}

@media (max-width: 768px){
  .content section.featured-text .container {padding:0 30px;}
}

.content .video {padding:30px 0; text-align:center;}
.content .video iframe {width:600px; height:400px;}
.content .video.fullwidth iframe {width:100%; height:55vw;}
.content .video.fullwidth .container {max-width:100%;}

.content section.image-with-text {padding:40px 0;}
.content section.image-with-text .container {display:flex; gap:40px;}
.content section.image-with-text .image {flex:2;}
.content section.image-with-text .image {background:none !important;}
.content section.image-with-text .text {flex:3; padding:20px 0; background:white;}

.content section.image-with-text.image-right .image {order:2;}

.content section.image-with-text.full {background:rgba( 0,0,0, .02 ); color:var(--brand-green); font-family:var(--heading-font-family); font-size:18pt; line-height:1.2em;}
.content section.image-with-text.full .container {max-width:100%; padding:40px; display:flex;}
.content section.image-with-text.full .image {margin-right:0;}
.content section.image-with-text.full .text {padding:30px 40px;}

@media (max-width:1160px){
  .content section.image-with-text .container {padding:0 30px;}
}

@media (max-width:600px){

  .content section.image-with-text .container {flex-direction:column; gap:30px;}
  .content section.image-with-text .image {text-align:center;}
  .content section.image-with-text .text {padding:0 20px;}
  
  .content section.image-with-text.full .container {padding:30px;}
  .content section.image-with-text.full .text {padding:0;}

}

section.features {padding:30px 0; background:rgba( 0,0,0, .05 );}

@media ( max-width:1024px ){
  section.features .container {padding:0 30px;}
}

 /*
 *  Cards
*/

.cards {display:grid; grid-template-columns:repeat( 4, 1fr ); grid-gap:20px; align-items:flex-start;}
.cards .card {position:relative; display:flex; flex-direction:column; gap:20px; /* border:1px solid rgba( 0,0,0, .1 ); */}
.cards .card.large {grid-column:span 3;}
.cards .card.old {padding-bottom:15px; border-bottom:1px solid rgba( 0,0,0, .1 );}
.cards .cardpromo {align-self:flex-start;}
.cards .card .favourite {transition:transform .1s, background-color .1s; position:absolute; z-index:2; top:8px; right:8px; display:flex; align-items:center; justify-content:center; width:25px; height:25px; border-radius:50%; background:rgba( 255,255,255, .75 ); font-size:12px; line-height:1em; color:black;}
.cards .card:not(:hover) .favourite {display:none;}
.cards .card .favourite i {font-weight:normal;}
.cards .card .favourite i.fa-spinner {font-weight:bold;}
.cards .card .favourited i {color:var(--brandbg); font-weight:bold;}
.cards .card .favourite:hover {transform:scale(1.1);}
.cards .card .favourite:hover i {font-weight:bold;}
.cards .card:hover .favourite {background:white;}
.cards .card:hover .favourite:not(.favourited) i {color:black;}
.cards .card .image {}
.cards .card img {display:block; max-width:100%;}
.cards .card .details {display:flex; flex-direction:column; gap:10px;}
.cards .card .details .name {font-family:var(--heading-font-family); font-size:18px; line-height:140%;}
.cards .card .details a.name:link,
.cards .card .details a.name:visited {text-decoration:none;}
.cards .card:hover .details a.name {color:var(--brandbg);}
.cards .card .details .date {font-size:14px; line-height:140%;}
.cards .card .details .type {display:none;}
.cards .card .details .ideas {display:flex; gap:8px; margin-top:10px; font-size:11.5px; line-height:120%;}
.cards .card .details .ideas .idea {padding:5px 12px; background:rgba( 0,0,0, .1 ); border-radius:3px;}
.cards .card .details .ideas .idea:hover {background:var(--brandbg); color:rgba( var(--brandfg), 1 );}
.cards .card a {text-decoration:none;}

.card .details .details,
.card .articleinfo,
.card .articleissue,
.card .infoless .articletype {display:none;}
.card .articlecontext {font-size:12px; line-height:1.4em; color:rgba( 0,0,0, .4 );}
.card .articleissue {color:rgba( 0,0,0, .7 );}

.cards.cardssidebar {grid-template-columns:1fr;}
.cards .card .image img {max-width:100%;}

.cards.cardsrelated:not(:last-child) {margin-bottom:30px;}

.cards.horizontal {grid-template-columns:1fr; grid-gap:0;}
.cards.horizontal .card {padding:15px 0; border:0;}
.cards.horizontal .card .context {/* padding:10px; */ font-size:.8em; font-style:italic; color:rgba( 0,0,0, .8 );}
.cards.horizontal .card .details {padding:0;}
.cards.horizontal .card .type {font-size:.8em; text-transform:uppercase; font-weight:bold; color:var(--brand-pink);}
.cards.horizontal .card .author {font-size:.8em; text-transform:uppercase;}
.cards.horizontal .card:not(:last-child) {border-bottom:1px solid rgba( 0,0,0, .1 );}

@media ( max-width: 1024px ){
  .cards {grid-template-columns:repeat( 2, 1fr );}
  .cards .card.large {grid-column:span 2;}
}

@media ( max-width:600px ){
  .cards {grid-template-columns:repeat( 1, 1fr );}
  .cards .card.large {grid-column:span 1;}
  .cards .card:not(:hover) .favourite {display:flex;}
  .cards .card .favourite {--touch-padding:15px; display:flex; width:35px; height:35px; font-size:17px; line-height:100%;}
  .cards .card .favourite::after {content:""; position:absolute; left:50%; top:50%; width:175%; height:175%; transform:translate(-50%, -50%)}
}

.cards {display:grid; grid-gap:40px;}

.card {background:white;}
a.card {text-decoration:none;}
.card .details {}
.card .name {}
.card .snip {display:none;}
.card .author {font-size:14px; line-height:140%;}
.card .author a:hover {text-decoration:underline;}
.card .issue {font-size:14px; line-height:140%; font-style:italic;}
.card a.issue:hover {text-decoration:underline;}
.card .type {color:rgba( 0,0,0, .5 ); font-size:.9rem; line-height:1.4em;}
.card .image img {width:100%; max-width:100%;}
.card:hover .image {opacity:.9;}

@media ( min-width:600px ){
  .cards.cardsfeatured {grid-template-columns:repeat( 3, 1fr );}
}



 /*
 *  Issue page
*/

.issue .issue-top {display:flex; gap:40px; margin:40px 0 30px 0;}
.issue .issue-top .buttons {display:flex; gap:15px;}
.issue .issue-hero {flex:1;}
.issue .issue-hero img {width:100%;}
.issue .issue-info {flex:1; display:flex; flex-direction:column; gap:30px;}
.issue .issue-info h1 {margin:0;}
.issue .issue-info h2 {margin:-20px 0 0 0; font-size:25px; line-height:140%;}
.issue .issue-info .image-caption {color:rgba( 0,0,0, .3 ); font-size:80%; line-height:140%;}


@media ( max-width:900px ){
  .issue .issue-top {flex-direction:column; gap:30px;}
  .issue .issue-hero img {max-width:100%;}
}


section.search {padding:40px 0;}
section.search form {display:flex; flex-wrap:wrap; gap:10px;}
section.search > .container > p {margin-top:1em;}

iframe {max-width:100%;}

.content {display:flex; flex-direction:column; padding-bottom:40px;}

.content img {max-width:100%;}

/*
.content .hero {position:relative; z-index:1; display:flex; align-items:flex-end; width:100%; height:60vh; margin-bottom:20px; padding:30px; background:center no-repeat; background-size:cover; font-family:var(--heading-font-family); font-size:18pt; line-height:1.2em;}
.content .hero img {display:none;}
.content .hero .text {margin:0 auto; padding:30px; background:var(--brand-green); color:white; font-family:var(--heading-font-family); font-size:18pt; line-height:1.2em;}
.content .hero .text strong {display:flex;}
.content .hero .text strong:not(:only-child) {margin-bottom:5px;}

.content .hero .container {width:100%;}
.content .hero .overlay {max-width:320px; min-height:300px; padding:40px; background:var(--brand-green); color:rgba( 255,255,255, .75 );}
.content .hero .overlay h3 {margin:0 0 1.5em 0; color:white; font-family:var(--heading-font-family); font-size:18pt; line-height:1em;}
.content .hero .overlay p {margin:0 0 1.5em 0; font-size:12pt; line-height:1.2em;}
.content .hero .overlay a:link,
.content .hero .overlay a:visited {color:white;}

.content .hero:last-child {margin-bottom:0;}

@media ( max-width:900px ){
  .content .hero .overlay {max-width:100%;}
}

@media (max-width: 768px){
  .content .hero {flex-direction:column; height:auto; padding:0; background:none !important;}
  .content .hero .text {}
  .content .hero img {display:flex;}  
}
*/

.content ol {list-style:decimal inside; margin:0 0 20px 0; padding-left:20px;}

.featurehero {position:relative; margin:auto; overflow:hidden; max-height:50vh; background-size:cover; background-repeat:no-repeat; background-position:center; background-attachment:scroll;}
.featurehero img {opacity:0; display:block; width:100%;}

.featureherocaption {position:absolute; z-index:3; bottom:0; left:0; padding:5px; background:rgba( 0,0,0, .4 ); color:rgba( 255,255,255, .5 ); text-align:left; font-family:var(--heading-font-family); font-size:12px; line-height:1.2em; font-style:italic;}
.featureherocaption:hover {color:white; background:black;}

.archives {border:5px solid rgba( 0,0,0, .075 ); padding:20px 30px;}

@media ( max-width:1024px ){
  .archives {border-width:5px 0;}
}

.warning {margin:0 0 1em 0; padding:20px; background:#ffc;}

.issueheader {margin-bottom:20px; padding:20px 0; background:rgba( 0,0,0, .1 ); font-size:15px; line-height:1.4em; color:rgba( 0,0,0, .5 );}
.issueheader .container {/*border-bottom:1px solid #eee; padding-bottom:15px;*/}
.issueheader ul {list-style:none; margin:20px 20px 0 20px;}
.issueheader ul li {display:block; margin:5px 0;}
.issueheader ul li:first-child a {}
.issueheader a {color:#595959;}
.issueheader a:hover {color:#000;}
.issueheader span {padding:0 10px; color:#ddd;}


/* To convert to sectional styles */
.issueheroimage {position:relative; height:50vh; /* transition:background-position .1s; */}
.issueheroimage h1 {position:absolute; bottom:0; left:0; width:100%; margin:0 auto; padding:50px 0 20px 0; background:linear-gradient( to bottom, rgba( 0,0,0, 0 ) 0%,rgba( 0,0,0 , .65 ) 100%); color:#fff; text-align:center; font-family:var(--heading-font-family); font-size:60px; line-height:1em;}

.socialshare a {display:inline-flex; align-items:center; gap:8px; padding:5px 10px; background:#eee; border:1px solid #eee; border-radius:3px; text-decoration:none; font-size:14px; line-height:1.4em;}
.socialshare a:hover {background:#fff;}
.socialshare a i {}

.article .fa-facebook-square {color:#3b5998;}
.article .fa-twitter-square {color:#4099ff;}




 /*
 *  Article page (new July 2023)
*/
div.article {display:grid; grid-template-columns:1fr 3fr; gap:60px; padding-top:40px;}
div.article.no-hero {margin-top:40px; border-top:1px solid rgba( 0,0,0, .1 );}

/* Landscape */
.article.landscape > figure.hero {grid-column:span 2;}
.article.landscape > figure.hero figcaption {border-bottom:1px solid rgba( 0,0,0, .1 );}

/* Landscape, two-column */

.article.landscape-columns .herotitle {grid-column:span 2; display:flex; gap:40px;}
.article.landscape-columns .herotitle figure.hero {flex:3;}
.article.landscape-columns .herotitle figure.hero img {width:100%;}
.article.landscape-columns .herotitle .title-abstract {flex:2;}

/* Portrait */

.article.portrait .herotitle {grid-column:span 2; display:flex; gap:40px;}
.article.portrait .herotitle figure.hero {flex:1;}
.article.portrait .herotitle figure.hero figcaption {border-bottom:1px solid rgba( 0,0,0, .1 );}
.article.portrait .herotitle figure.hero img {width:100%;}
.article.portrait .herotitle .title-abstract {flex:1;}
.article.portrait .issue-details {display:flex; flex-direction:column; align-items:flex-start; gap:30px;}
.article.portrait .title-abstract {display:flex; flex-direction:column; align-items:flex-start; gap:30px;}


.article figure.hero {display:flex; flex-direction:column; text-align:left;}
.article figure.hero img {max-width:100%;}
.article figure.hero figcaption {padding:10px 0; font-size:14px; line-height:120%;}

.article .authordate {display:flex; flex-direction:column; gap:8px;}
.article .authordate .author {font-size:1.25rem; line-height:140%;}
.article .authordate .author a {text-decoration:none;}
.article .authordate .author a:hover {text-decoration:underline;}
.article .articledate {font-size:1rem; line-height:120%;}

.article .issuenumbername {display:flex; flex-direction:column; gap:8px;}
.article .issuenumber {font-weight:bold;}
.article .issuename {font-size:1.25rem; line-height:125%;}

.article aside {display:flex; flex-direction:column; align-items:flex-start; gap:30px;}
.article aside .cardimage {max-width:100%;}
.article aside .related {display:flex; flex-direction:column; align-items:flex-start; gap:20px; font-size:1.2rem; line-height:140%;}
.article aside .ads {margin-top:60px; display:flex; flex-direction:column; align-items:flex-start; gap:20px;}
.article aside .ads img {width:100%;}
.article aside .context {font-size:16px; line-height:187.5%;}

.article .ideas-block {display:flex; flex-direction:column; gap:10px;}
.article .ideas .idea.idea-type {background:none; border:1px solid rgba( 0,0,0, .1 );}
.article .ideas .idea.idea-type:hover {background:var(--brandbg); border:1px solid rgba( 0,0,0, 0 );}

.article article {font-size:16px; line-height:187.5%;}
.article article p {max-width:800px;}

.article a[rel="footnote"] {scroll-margin-top:calc(var(--header-height) + 30px);}


@media (max-width:1024px){

  div.article {grid-template-columns:1fr; gap:30px;}
  div.article.no-hero {margin-top:20px;}
  
  .article article {order:2;}
  .article aside {order:3;}

  .article.landscape > figure.hero {grid-column:span 1;}
  .article.landscape-columns .herotitle {grid-column:span 1;}

}



 /*
 *  Article section types
*/

.article section.title-and-context {}
.article section.title-and-context h1 {margin:0 0 30px 0; font-size:var(--heading-font-size); line-height:140%; font-family:var(--heading-font-family);}
.article section.title-and-context .context {font-size:30px; line-height:133%; color:#808080}

article section.text {padding:0;}

article section.article-text blockquote {margin:20px 0 20px 20px; border-left:5px solid #ccc; padding:10px 20px;}
article section.article-text blockquote p {font-style: italic;}
article section.article-text blockquote p:first-child {margin-top:0;}
article section.article-text blockquote p:last-child {margin-bottom:0;}

article section.article-text p.indent {padding-left:2rem;}
article section.article-text p.indent-2 {padding-left:4rem;}
article section.article-text p.indent-3 {padding-left:6rem;}

@media ( min-width:1025px ){
  article section.text .container {padding:0;}
}

article section.video {width:100%;}
article section.video iframe {width:100%; height:auto; aspect-ratio:3/2;}

article section.footnotes {padding:10px 0; border-top:1px solid rgba( 0,0,0, .05 ); font-family:var(--body-font-family); font-size:.6em; line-height:187.5%;}
article section.footnotes header {display:none;}
article section.footnotes ol {display:block; margin:0; padding-left:10px; list-style-type:decimal;}
article section.footnotes ol li {scroll-margin-top:calc( var(--header-height) + 20px ); color:rgba( 0,0,0, .8 );}
article section.footnotes ol li sup {padding-right:10px; vertical-align:middle;}
article section.footnotes ol cite {display:inline-block; width:90%; vertical-align:top;}
@media ( max-width:450px ){
  article section.footnotes ol cite {width:90%;}
}
@media ( max-width:700px ){
  article section.footnotes a {word-break: break-all;}
}


.buy-or-subscribe {margin-top:30px;}

section.more-articles {padding:40px 0;}


.articleabstract {padding-bottom:20px; border-bottom:1px solid rgba( 0,0,0, .1 );}

article sup {vertical-align:middle; top:0; font-size:.6em;}

article section.tail {margin:0 0 30px 0; padding-top:30px; border-top:1px solid rgba( 0,0,0, .05 ); font-size:12px; line-height:187.5%;}
article section.context {margin:0 0 20px 0;}

section.byline {margin:0 0 30px 0; padding-top:30px; border-top:1px solid rgba( 0,0,0, .05 ); font-size:14px; line-height:120%;}


figure {margin:0; text-align:center;}
figure.image {padding:20px 0 0 0; border-bottom:1px solid #eee; margin-bottom:30px; width:100%;}
figure.image img {display:block; margin-bottom:10px;}
figure.image:not(.keepsize) img {width:100%; height:auto;}
figure.image.keepsize {display:flex; flex-direction:column; align-items:flex-start;}
figure.image figcaption {font-size:12px; line-height:140%; opacity:0.6; padding-bottom:10px; font-family:'Muli', Arial, Helvetica, sans-serif; /* font-style: italic; */ text-align:left;}
figure.image .images {display:flex; gap:10px; margin-bottom:10px;}
figure.image .images .image {flex:1;}
figure.image .images .image img {width:100%; height:100%; object-fit:cover; margin:0;}
.portraitphoto, figure.portraitphoto, figure.image img.portraitphoto {width:75%; margin-left:auto; margin-right:auto;}
.veryportraitphoto, figure.veryportraitphoto, figure.image img.veryportraitphoto {width:50%; margin-left:auto; margin-right:auto;}
figure.portraitphoto img.portraitphoto {width:100%;}
figure.veryportraitphoto img.veryportraitphoto {width:100%;}
figure.image:hover figcaption {opacity:1;}


.articletail {margin:0 0 30px 0; padding-top:30px; border-top:1px solid rgba( 0,0,0, .05 );}


.issuecoverside {width:100%; height:auto; padding:0 20px;}
.issuecoverside img {max-width:100%; height:auto;}

.profiles .cards .card .image.empty {aspect-ratio:3/4; width:100%; background:rgba( 0,0,0, .15 );}




 /*
 *  Contributors list
*/

section.featured-contributors {padding:30px 0;}
section.featured-contributors .cards .item {display:flex; flex-direction:column; gap:15px;}
section.featured-contributors .cards .item .image {aspect-ratio:1/1; overflow:hidden;}
section.featured-contributors .cards .item .image img {width:100%; height:100%; object-fit:cover;}
section.featured-contributors .cards .item .name {font-size:25px; line-height:120%; font-family:var(--heading-font-family);}
section.featured-contributors .cards .item .latest {display:flex; flex-direction:column; gap:5px;}
section.featured-contributors .cards .item .buttons {margin-top:5px;}



 /*
 *  Contributor page
*/

section.contributor {}
section.contributor .container {display:flex; gap:30px; margin-top:20px; padding-top:30px; border-top:1px solid rgba( 0,0,0, .1 );}
section.contributor h2 {margin:0 0 10px 0;}
section.contributor .location {margin:0 0 20px 0;}
section.contributor .profile-image {flex:1; max-width:300px;}
section.contributor .profile-image img {display:block; width:100%; height:auto;}
section.contributor .details {flex:1;}

section.contributor .website {margin-top:1em;}


section.profile table.list {width:100%; margin-top:50px;}
section.profile table.list td {border-width:1px 0;}
section.profile table.list tr:first-child td {border-top:0;}
section.profile table.list tr:last-child td {border-bottom:0;}
section.profile table.list .demote {font-size:80%; color:rgba( 0,0,0, .5 );}
section.profile table.list a {text-decoration:none;}
section.profile table.list a:hover {text-decoration:underline;}

section.profile .info {display:flex; gap:120px; margin-bottom:80px;}
section.profile .info .bio {flex:4;}
section.profile .info .contact {flex:1; display:flex; flex-direction:column; gap:20px;}
section.profile .info .contact p {display:flex; flex-direction:column; gap:3px; margin:0;}
section.profile .info .contact p label {font-weight:bold; color:rgba( 0,0,0, .5 ); font-size:14px; line-height:1.4em; text-align:right;}
section.profile .info .contact p .value {text-align:right;}

@media ( max-width:1024px ){

  section.contributor .container {flex-direction:column;}

  section.contributor .profile-image {max-width:100%;}

  section.profile table.list tr {display:flex; flex-direction:column; gap:5px; padding:10px 0;}
  section.profile table.list tr.card:not(:last-child) {border-bottom:1px solid rgba( 0,0,0, .1 );}
  section.profile table.list td {padding:0; border:0;}
  section.profile table.list .type {color:var(--brand-pink);}

  section.profile .info {flex-direction:column; gap:40px;}
  section.profile .info .contact p label,
  section.profile .info .contact p .value {text-align:left;}

}

@media ( max-width:600px ){

  section.contributor.title.has-image {padding-top:0;}
  section.contributor.title.has-image .container {padding-top:1em; border-top:1px solid rgba( 0,0,0, .1 );}

}


 /*
 *  Contact page
*/

section.contact form {display:flex; flex-direction:column; gap:30px; align-items:flex-start;}
section.contact form .field {display:flex; flex-direction:column; gap:5px; width:100%;}
section.contact form input[type="text"],
section.contact form input[type="email"] {width:100%; max-width:600px;}
section.contact form textarea {width:100%; height:100px; max-width:600px;}

@media ( max-width:900px ){
  section.contributor.title.has-image {padding-top:0;}
  section.contributor.title.has-image .container {padding-top:1em; border-top:1px solid rgba( 0,0,0, .1 );}
}

 /*
 *  Search page
*/

section.search {margin:20px 0 40px 0; padding:50px 0; background:rgba( 0,0,0, .05 );}
section.search .container {}
section.search h2 {border-bottom:0; font-family:var(--heading-font-family);}

section.search .searchform {display:flex; flex-direction:column;}
section.search .searchform .searchrow {display:flex; align-items:center; gap:20px; padding:10px 20px; background:rgba( 0,0,0, .05 ); /* padding-bottom:10px; border-bottom:1px solid black; */}
section.search .searchform input[type="text"] {/* padding:10px 20px; */ padding:0; border:0; background:none; outline:none;}
section.search .searchform select {padding:10px 20px; border:0; background:rgba( 0,0,0, .1 ); outline:none;}

section.search .searchform .ideas {margin:10px 0;}
section.search .searchform .ideas:empty {display:none;}
section.search .searchform .ideas .idea {gap:10px; padding:8px 16px; background:rgba( 0,0,0, .1 ); font-size:12px;}
section.search .searchform .ideas .idea:hover {background:var(--brandbg);}
section.search .searchform .ideas .idea .remove {font-size:14px;}
section.search .searchform .ideas .idea .remove:hover {color:rgba( 0,0,0, .5 );}
section.search .searchform .ideas .idea.active {background:var(--brandbg); color:rgb( var(--brandfg) ); cursor:pointer;}
section.search .searchform .ideas .idea:not(.active) .remove {display:none;}

@media (min-width:701px){
  section.search .searchform input[type="text"] {min-width:300px;}
}

@media (max-width:700px){
  section.search .searchform .searchrow {flex-wrap:wrap;}
}

section.search-years {margin-top:30px;}
section.search-years .container {display:flex; align-items:center; justify-content:flex-start; flex-wrap:wrap; gap:6px;}
section.search-years a {display:inline-flex; padding:5px 10px; background:rgba( 0,0,0, .1 ); border-radius:3px; font-size:12px; line-height:120%; text-decoration:none;}
section.search-years a:hover {background:var(--brandbg); color:white;}
section.search-years a.active {background:var(--brandbg); color:white;}

@media (max-width:700px){
  section.search-years .container {justify-content:center;}
}

section.search .card {background:none;}


section.search-results {padding:30px 0;}

section.search-results .cards .card .ideas {gap:8px;}

section.search-results .issues .card .label {display:flex; flex-direction:column; gap:10px;}
section.search-results .issues .card .label .name {font-family:var(--heading-font-family); font-size:18px; line-height:140%;}
section.search-results .issues .card .label .number {font-size:14px; line-height:140%;}

@media (max-width:1024px){

  section.search {margin:20px 0;}
  
}


 /*
 *  Issues grid section
*/


section.issues {padding:30px 0;}
section.issues .grid {width:100%; display:grid; grid-template-columns:repeat( 4, 1fr ); gap:40px;}
section.issues .card {display:flex; flex-direction:column; gap:20px; border:0; text-decoration:none;}
section.issues .card img {width:100%; height:auto;}
section.issues .card:hover {background:transparent;}
section.issues .card:hover img {opacity: 0.9;}
section.issues .card a.name {text-decoration:none;}
section.issues .card .label {display:flex; flex-direction:column; gap:10px; word-break:break-word;}
section.issues .card .label .name {font-family:var(--heading-font-family); font-size:25px; line-height:140%;}
section.issues .card .label .number {font-size:14px; line-height:140%;}

@media ( max-width:1160px ){
  section.issues .container {padding:0 30px;}
}

@media ( max-width:1024px ){
  section.issues .grid {grid-template-columns:repeat( 3, 1fr );}
}

@media ( max-width:700px ){
  section.issues .grid {grid-template-columns:repeat( 2, 1fr );}
}

@media ( max-width:480px ){
  section.issues .grid {grid-template-columns:repeat( 1, 1fr );}
}


 /*
 *  Latest issue section
*/

section.latest-issue {padding:30px 0;}
section.latest-issue .container {display:flex; gap:40px;}
section.latest-issue .image {flex:1;}
section.latest-issue .image img {width:100%;}
section.latest-issue .details {flex:1; display:flex; flex-direction:column; gap:30px;}
section.latest-issue .details h1 {margin:0;}
section.latest-issue .details h2 {margin:-20px 0 0 0; font-size:25px; line-height:140%;}
section.latest-issue .details .ideas {}
section.latest-issue .details .snip {}
section.latest-issue .details .buttons {}

@media ( max-width:1024px ){
  section.latest-issue .container {flex-direction:column; gap:30px;}
}

form.form fieldset {display:grid; grid-template-columns:2fr 5fr; grid-gap:15px; align-items:center; padding:30px; background:rgba( 0,0,0, .025 ); border:1px solid rgba( 0,0,0, .05 ); box-shadow:3px 3px 2px 0px rgba( 0,0,0, .2 );}
form.form fieldset .submit button {margin:0;}
form.form input[type="text"],
form.form input[type="email"],
form.form textarea,
form.form select {padding:5px 8px; background:white; border:1px solid rgba( 0,0,0, .2 ); border-radius:3px; line-height:1em;}
form.form select {padding:5px;}
form.form textarea {height:120px;}
form.form button {cursor:pointer;}
form.form .header {grid-column:1 / span 2;}

@media (max-width:600px){
  form.form fieldset {grid-template-columns:1fr; grid-gap:8px; border-width:1px 0; box-shadow:none;}
  form.form .header {grid-column:1;}
}


.home {padding:40px 0;}

.home-page .content {margin-top:20px;}

.home-page .hero {position:relative; flex-direction:column; max-height:75vh; background-position:top center; background-size:cover;}
.home-page .hero > .text {position:absolute; bottom:0; left:0; width:100%; padding:50px 0 20px 0; background:linear-gradient( to bottom, rgba( 0,0,0, 0 ) 0%,rgba( 0,0,0 , .65 ) 100%); text-align:center; font-family:var(--heading-font-family); color:white; font-size:60px; line-height:1em;}
.home-page .hero > .text .container {}
.home-page .hero img {opacity:0; pointer-events:none;}
.home-page .hero p:last-child {display:flex; align-items:flex-start;}
.home-page .hero a.button:link,
.home-page .hero a.button:visited {display:inline-flex; white-space:nowrap; padding:7px 20px; background:white; color:var(--brand-green); font-size:14px;}
.home-page .hero a.button:hover,
.home-page .hero a.button:active {}
.home-page .hero a.button:not(:first-child) {margin-left:5px;}

@media ( max-width:900px ){
  /*
  .home-page .hero {margin-bottom:200px; background-position:right;}
  .home-page .hero > .container {margin-bottom:-200px; margin-top:0; padding-top:200px; padding-bottom:0;}
  */
  .home-page .hero {margin:0;}
  .home-page .hero > .container {margin-top:0; padding:0;}
  .home-page .hero .overlay {min-height:1px; padding:30px;}
  .home-page .hero .overlay p:last-child {margin-bottom:0;}
}

@media ( max-width:600px ){
  .home-page .content {margin-top:0;}
  .home-page .hero .overlay h3 {margin-bottom:15px;}
  .home-page .hero .overlay p {font-size:18px;}
  .home-page .hero .overlay p:last-child {justify-content:space-evenly;}
  .home-page .hero a.button:link,
  .home-page .hero a.button:visited {padding:10px 25px; font-size:18px;}
  .home-page .hero a.button:not(:first-child) {margin-left:10px;}
}


.home-hero {--image-count:1; position:relative; margin:0 0 40px 0;}
a.home-hero {text-decoration:none;}
.home-hero .images {position:relative; display:grid; grid-template-columns:repeat(var(--image-count), 1fr);}
.home-hero .image {flex:1; position:relative; z-index:1; width:100%;}
.home-hero .image img,
.home-hero .image video {display:block; width:100%;}
.home-hero .image {height:100%; background:top center no-repeat; background-size:cover;}
.home-hero .image img {opacity:0;}

.home-hero.style-box .text {transition:opacity 1s ease-in-out; position:absolute; z-index:2; bottom:40px; left:100px; max-width:600px; padding:30px 40px; background:#444; color:white; background:var(--brandbg); color:rgba( var(--brandfg), 1 );}
.home-hero.style-box .text .subtitle {margin:0 0 5px 0; text-transform:uppercase; font-size:12px; color:rgba( 255,255,255, .3 );}
.home-hero.style-box .text .title {margin:0 0 5px 0; font-weight:bold; font-size:24px; line-height:1.2em;}
.home-hero.style-box .text .snip {font-size:18px; line-height:1.2em;}

.home-hero.style-text .text {position:absolute; left:80px; right:80px; bottom:80px; z-index:2; display:flex; flex-direction:row; align-items:flex-end; justify-content:space-between; gap:20px;}
.home-hero.style-text .text .title {flex:1; max-width:400px; --title-color:white; color:var(--title-color); font-family:var(--heading-font-family); font-size:45px; line-height:120%;}
.home-hero.style-text .text .subtitle {margin:10px 0 0 0; font-size:20px; line-height:120%; --subtitle-color:rgba( 255,255,255, .6 ); color:var(--subtitle-color);}
.home-hero.style-text > .caption {position:absolute; z-index:2; right:20px; bottom:20px; padding-left:20px;}
.home-hero.style-text .caption {color:white; font-size:11px; line-height:120%;}

section.home-carousel {margin:0 0 40px 0;}
section.home-carousel .container {max-width:100%; position:relative;}

section.home-carousel .slick-track {display:flex; align-items:center;}

section.home-carousel .home-hero {/* margin:0 20px; */ height:calc( 100vh - var(--header-height) /* - 40px */ );}

section.home-carousel .prev-arrow,
section.home-carousel .next-arrow {opacity:0; position:absolute; z-index:3; top:50%; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; width:50px; aspect-ratio:1; background:#444; border-radius:50%; font-size:14px; color:white;}
section.home-carousel .prev-arrow,
section.home-carousel .next-arrow {top:0; width:100px; height:100%; transform:none; cursor:pointer;}
section.home-carousel .prev-arrow,
section.home-carousel .next-arrow {transition:opacity .1s; opacity:.5; background:none; font-size:50px; text-shadow:1px 1px 1px rgba( 0,0,0, .2 );}
section.home-carousel .prev-arrow:hover,
section.home-carousel .next-arrow:hover {opacity:1;}
section.home-carousel .prev-arrow {left:15px; left:0;}
section.home-carousel .next-arrow {right:15px; right:0;}

@media (min-width:901px){
  section.home-carousel {/*margin-top:10px;*/}
  section.home-carousel .home-hero {transition:opacity .2s; opacity:.2;}
  section.home-carousel .home-hero.slick-center {opacity:1;}
  section.home-carousel .home-hero:not(.slick-center) .caption {opacity:0;}

  .home-hero.style-text .images .caption {display:none;}
  .home-hero.style-text .text .caption {position:absolute; right:10px; bottom:10px;}
}

@media (max-width:900px){
  
  .home-hero.style-box .text {position:relative; bottom:auto; left:auto; width:100%; max-width:100%;}
  
  .home-hero.style-text {background:rgba( 0,0,0, .05 );}
  .home-hero.style-text .text {position:relative; left:auto; right:auto; bottom:auto; max-width:100%; padding:30px; word-break:break-word;}
  .home-hero.style-text .text .title {color:black;}
  .home-hero.style-text .text .subtitle {color:rgba( 0,0,0, .6 );}
  .home-hero.style-text > .caption {display:none;}
  .home-hero.style-text .images .caption {position:absolute; bottom:10px; right:20px; padding-left:20px; z-index:2; font-size:11px;}

  section.home-carousel .container {padding:0;}
  section.home-carousel .slick-track {align-items:flex-start;}
  section.home-carousel .home-hero {margin:0;}
  
  section.home-carousel .slick-track {align-items:stretch;}
  section.home-carousel .home-hero {display:flex; flex-direction:column; height:auto;}
  section.home-carousel .home-hero .caption {flex:1;}

  section.home-carousel .prev-arrow,
  section.home-carousel .next-arrow {opacity:0; pointer-events:none;}

}

@media (max-width:480px){
  .home-hero .text {padding:20px;}
}

.sitemap a:link,
.sitemap .m-nav .nav-inner ul li a:hover,
.m-nav .nav-inner ul li .sitemap a:hover,
.sitemap a:visited {float:left; clear:left; width:auto; min-width:150px; padding:0 8px; background:url('/images/sitemap-tree.gif') top left repeat-y; line-height:1em;}

.sitemap a span {display:block; float:left; width:100%; height:100%; padding:0 5px; background:#fff; line-height:22px;}

.sitemap a.root {font-weight:bold;}

.sitemap a:hover span {text-decoration:underline;}


section.cats:not(:first-child) {margin-top:20px;}
section.cats .articleyears {margin:10px 20px 20px 20px; text-align:center; line-height:2.5em; font-size:13px; font-family: 'Muli', Arial, Helvetica, sans-serif;}
section.cats .articleyears a {border-radius:3px; font-size:12px; padding:6px 12px; margin:0 3px; background:#f60; text-decoration: none; color:#fff;}
section.cats .articleyears a:hover {}
section.cats .articleyears a.selected {background:#fff; color:#333; border:1px solid #eee; font-weight:bold;}
section.cats .articleyears a.selected i {display:none;}

.content.reviews,
.content.book-reviews {padding-bottom:0;}

section.reviews {background:#383b40; border-top:10px solid #23272a; padding:80px 40px 80px 40px;}
section.reviews .container {display:grid; grid-template-columns:1fr 4fr; gap:30px;}

section.reviews .card {background:none; color:white;}
section.reviews .card .author {color:rgba( 255,255,255, .5 );}
section.reviews .card .type {display:none;}

section.reviews .title {grid-column:2; color:white; font-weight:700; font-size:28px; line-height:1em;}
section.reviews .nav {display:flex; flex-direction:column; align-items:flex-end;}

section.reviews .grid {width:100%; background:#383b40;}
section.reviews .grid .cards {grid-template-columns:repeat( 3, 1fr );}

section.reviews .reviewtype {display:flex; flex-direction:column; width:100%; padding:10px 0; text-align:right; color:white; font-size:16px; line-height:1.2em;}
section.reviews .reviewtype a {width:100%; padding:10px; color:white; white-space:nowrap; text-decoration:none;}
section.reviews .reviewtype a.active {background:rgba( 0,0,0, .4 ); font-weight:bold;}
section.reviews .reviewtype a:hover {background:rgba( 255,255,255, .1 );}

section.reviews .articleyears {display:flex; flex-direction:column; gap:2px; width:100%; margin:0; text-align:right;}
section.reviews .articleyears a {padding:8px 10px; background:rgba( 255,255,255, 0 ); line-height:1em; color:rgba( 255,255,255, 1 );}
section.reviews .articleyears a.selected {background:rgba( 0,0,0, .2 ); color:white; border:0;}
section.reviews .articleyears a:not(.selected):hover {opacity:1; background:rgba( 0,0,0, .1 );}

section.reviews .articleyears-mobile {padding:10px; border:0; outline:none; background:none; color:white;}

@media ( max-width:800px ){
  section.reviews {padding:30px 0;}
  section.reviews .grid .cards {grid-template-columns:repeat( 2, 1fr );}
}

@media ( min-width:701px ){
  .articleyears-mobile {display:none;}
}

@media ( max-width:700px ){
  section.reviews .container {grid-template-columns:1fr;}
  section.reviews .title {grid-column:1;}
  section.reviews .nav {align-items:center; text-align:center;}
  section.reviews .reviewtype {text-align:center;}
  section.reviews .articleyears {display:none; text-align:center;}
  section.reviews .grid .cards {grid-template-columns:repeat( 1, 1fr );}
}

.contributors section.group {display:flex; flex-direction:column; gap:30px; margin:30px 0;}
.contributors section.group:not(.active) {display:none;}
.contributors section.group .letter {font-size:28px; line-height:140%; text-transform:uppercase;}
.contributors section.group .names {flex:4; columns:4; column-gap:80px; padding:10px 0; font-size:14px; line-height:1.4em;}
.contributors section.group .names a {display:block; margin-bottom:10px; text-decoration:none;}
.contributors section.group .names a:hover {text-decoration:underline;}
.contributors section.group .names a.hide {display:none;}

.contributors p.no-results:not(.visible) {display:none;}

.contributors label.search {display:block; margin:0 0 20px 0; padding:20px; background:rgba( 0,0,0, .05 );}
.contributors label.search input {width:100%; background:none; border:0; outline:none;}

.letter-filters {display:flex; gap:20px;}
.letter-filters .letter {padding:5px 12px; background:rgba( 0,0,0, .05 ); cursor:pointer; text-transform:uppercase; font-size:14px; line-height:120%;}
.letter-filters .letter:hover {background:rgba( 0,0,0, .2 );}
.letter-filters .letter.active {background:rgba( 0,0,0, 1 ); color:white;}
.letter-filters.disabled {display:none;}
.letter-filters.disabled .letter {opacity:.5; pointer-events:none; cursor:default;}

@media (max-width:1100px){
  .contributors section.group .names {columns:3;}
}

@media (max-width:800px){
  .contributors section.group .names {columns:2;}
  .letter-filters {flex-wrap:wrap; justify-content:center;}
  .letter-filters .letter {flex:1; max-width:80px; white-space:nowrap; text-align:center;}
}

@media (max-width:600px){
  .contributors section.group {flex-direction:column;}
  .contributors section.group .letter {width:100%;}
  .contributors section.group .names {columns:2;}
}

@media (max-width:480px){
  .contributors section.group .names {columns:1;}
}

/*
.contributors section.group {display:flex; align-items:flex-start; gap:30px;}
.contributors section.group:not(:last-child) {padding-bottom:30px; border-bottom:1px solid rgba( 0,0,0, .1 );}
.contributors section.group:not(:first-child) {padding-top:30px;}
.contributors section.group .letter {flex:1; padding:10px 15px; background:rgba( 0,0,0, .8 ); color:white; text-align:right;}
.contributors section.group .names {flex:4; columns:3; column-gap:80px; padding:10px 0; font-size:14px; line-height:1.4em;}
.contributors section.group .names a {display:block; margin-bottom:10px; font-weight:bold; text-decoration:none;}
.contributors section.group .names a:hover {text-decoration:underline;}

@media (max-width:800px){
  .contributors section .names {columns:2;}
}

@media (max-width:600px){
  .contributors section {flex-direction:column;}
  .contributors section .letter {width:100%;}
  .contributors section .names {columns:2;}
}

@media (max-width:480px){
  .contributors section .names {columns:1;}
}
*/



.stockist-states {display:flex; flex-wrap:wrap; width:100%;}
.stockist-states a:link,
.stockist-states a:visited {display:inline-block; margin:5px; padding:8px 12px; background:rgba( 0,0,0, .1 ); border-radius:3px; color:#000; text-decoration:none; font-size:18px; line-height:1em;}
.stockist-states a:hover {background:rgba( 0,0,0, .15 );}


.container.login,
.container.subscriptions,
.container.account {margin-top:50px;}

.container.login .content .subnav,
.container.account .content .subnav,
.container.subscriptions .content .subnav {flex:1;}
.container.login .content .pagecontent,
.container.account .content .pagecontent,
.container.subscriptions .content .pagecontent {flex:4;}
.container.login .content .pagecontent h2,
.container.account .content .pagecontent h2,
.container.subscriptions .content .pagecontent h2 {}

.container.login label,
.container.account label {margin:0 0 5px 0; font-size:.8em; line-height:1.4em;}

.container.login input[type="text"],
.container.login input[type="password"],
.container.account input[type="text"],
.container.account input[type="password"],
.container.login input[type="email"],
.container.login input[type="password"],
.container.account input[type="email"],
.container.account input[type="password"] {font-size:.8em; line-height:1.4em;}

.subnav strong {display:inline-flex; margin:0 0 10px 0; font-size:14px; line-height:120%;}
.subnav ul {list-style:none; display:flex; flex-direction:column; margin:0; font-size:.8em; line-height:1.4em;}
.subnav ul li {}
.subnav ul a {display:inline-flex; padding:10px 0; text-decoration:none;}
.subnav ul a:hover {text-decoration:underline;}
.subnav ul li:not(:last-child) a {}

section.login {margin:30px 0;}
section.login .container {padding-top:30px; border-top:1px solid rgba( 0,0,0, .1 );}
section.login .columns {display:flex; gap:60px;}
section.login .columns .column {flex:1;}

@media (max-width:900px){
  section.login {margin:0;}
  section.login .columns {flex-direction:column;}
}

.account h3 {margin:30px 0 20px 0; font-size:24px; line-height:140%;}
.account h3:first-child {margin-bottom:10px;}
.account .field,
.login .field {display:flex; flex-direction:column; gap:10px; margin:0 0 20px 0;}
.login .buttons {display:flex; align-items:center; gap:30px;}
.login .buttons a {text-decoration:none;}
.login .buttons a:hover {text-decoration:underline;}

.login .create-account {padding:30px; background:rgba( 0,0,0, .025 );}

.login input[type="text"],
.login input[type="email"] {padding:8px 14px;}

.account table.list th {color:rgba( 0,0,0, .5 ); font-size:.8em; line-height:1.4em;}
.account table.list th,
.account table.list td {padding:10px 20px 10px 0;}
.account table.list input[type="text"] {width:120px;}
.account table.list input[type="email"] {width:200px;}

.subscriptions .cards .card {justify-content:flex-start; position:relative; border:0;}
.subscriptions .cards .card .details {padding:10px 0;}
.subscriptions .cards .card .name {font-weight:bold;}
.subscriptions .cards .card .issue {margin-top:5px; font-size:.8em; line-height:1.4em; color:rgba( 0,0,0, .5 );}
.subscriptions .cards .card .pdf {position:absolute; z-index:2; left:3px; top:3px; padding:5px; background:#c00; color:#fff; font-size:.5em; line-height:1em; font-weight:bold;}

@media ( min-width:1025px ){  
  .container.login .content,
  .container.account .content,
  .container.subscriptions .content {flex-direction:row;}

  .container.login .content .subnav,
  .container.account .content .subnav,
  .container.subscriptions .content .subnav {margin-right:60px;}
}

@media ( max-width:1024px ){  
  .container.login .content .subnav,
  .container.account .content .subnav,
  .container.subscriptions .content .subnav {order:2;}

  .account table.list {--rows:6; display:flex; width:100%; overflow:auto;}
  .account table.list tbody {display:grid; grid-auto-flow:column; grid-template-rows:repeat( var(--rows), 1fr );}
  .account table.list thead {display:grid; grid-auto-flow:column; grid-template-rows:repeat( var(--rows), 1fr );}
  .account table.list thead th {border:0;}
  .account table.list tr {display:contents;}
  .account table.list input[type="text"],
  .account table.list input[type="email"] {width:100%; min-width:100px;}
  .account table.list th {min-width:120px;}
  .account table.list th,
  .account table.list td {padding:5px 20px 5px 0;}

}

@media ( max-width:600px ){
  .subscriptions .cards {grid-template-columns:1fr 1fr; grid-gap:20px;}
}

@media ( max-width:380px ){
  .subscriptions .cards {grid-template-columns:1fr;}
}




.splash-modal {position:fixed; z-index:10000; left:0; top:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; padding:30px; background:rgba( 0,0,0, .4 ); transition:all .2s;}
.splash-modal.hide {opacity:0; pointer-events:none;}
.splash-modal .inner {max-width:100%; width:800px; display:flex; flex-direction:column; align-items:flex-end; padding:60px; background:var(--brandbg); box-shadow:0px 15px 15px 5px rgba( 0,0,0, .2 ); border-radius:5px; color:#fff; font-size:24px; line-height:160%;}
.splash-modal .inner a.banner {display:inline-block; max-width:100%; width:60vw; height:0; padding-bottom:39.8%; background:url('/images/40-plus-1_footer.png') left top no-repeat; background-size:cover; box-shadow:0px 15px 15px 5px rgba( 0,0,0, .2 );}
.splash-modal .inner a.banner:hover {background-image:url('/images/40-plus-1_footer_hover.png');}

.splash-modal .inner .acknowledgement {width:100%; }
.splash-modal .inner .acknowledgement h2 {margin:0 0 60px 0;}
.splash-modal .inner .acknowledgement p {margin:0 0 1em 0; font-family:var(--heading-font-family); font-size:26px; line-height:140%;}
.splash-modal .inner .acknowledgement p:last-child {margin-bottom:0;}
.splash-modal .inner .acknowledgement a:link,
.splash-modal .inner .acknowledgement a:visited {color:#fff;}
.splash-modal .inner .acknowledgement a.button {display:inline-block; padding:10px 20px; background:#fff; color:#000; text-decoration:none; line-height:1em;}

.splash-modal .inner .subscribe {width:100%;}
.splash-modal .inner .subscribe input[type="email"] {width:100%; max-width:500px; padding:8px 12px; border:0; border-radius:2px; background:white;}
.splash-modal .inner .subscribe input[type="email"]::placeholder {color:rgba( 0,0,0, .4 );}
.splash-modal .inner .subscribe .button {}
.splash-modal .inner .subscribe .logo {margin-bottom:-20px; text-align:right;}
.splash-modal .inner .subscribe .logo img {max-height:40px;}

.splash-modal .inner .close-button {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:15px; margin:-20px -20px 0 0; text-decoration:none; color:white; cursor:pointer; font-size:14px; line-height:120%;}
.splash-modal .inner .close-button svg {width:38px; height:38px;}
.splash-modal .inner .close-button svg path {stroke:white;}

@media ( max-width:700px ){

  .splash-modal .inner {padding:30px;}
  .splash-modal .inner .close-button {margin:0;}
  .splash-modal .inner a.banner {width:95vw; padding-bottom:146.6%; background-image:url('/images/40-plus-1_splash_small.png');}
  .splash-modal .inner a.banner:hover,
  .splash-modal .inner a.banner:active {background-image:url('/images/40-plus-1_splash_small_hover.png');}
  
  .splash-modal .inner .acknowledgement {/* width:95vw; */ padding:20px;}
  
}

@media ( max-width:420px ){

  .splash-modal .inner .acknowledgement {font-size:18px; line-height:1.6em;}
  
}

 /*
 *  Shop
*/

section.shop-header .container {display:flex; justify-content:center; gap:40px; padding:20px 0; border:solid rgba( 0,0,0, 1 ); border-width:1px 0;}
section.shop-header a {display:inline-flex; align-items:center; gap:10px; text-decoration:none;}
section.shop-header a:hover {color:rgba( 0,0,0, .5 );}

@media (max-width:900px){
  section.shop-header .container {flex-direction:column; align-items:center; gap:0; padding:0;}
  section.shop-header a {padding:15px 15px;}
}

section.shop {padding:30px 0;}
section.shop .grid {display:grid; gap:30px;}
section.shop .grid .item {display:flex; flex-direction:column; align-items:center; gap:10px;}
section.shop .grid a.item {text-decoration:none;}
section.shop .grid .item .no-image {aspect-ratio:200/261; width:100%; background:rgba( 0,0,0, .1 );}
section.shop .grid .item .name {font-size:14px; line-height:140%; word-break:break-all;}
section.shop .grid.collections {grid-template-columns:repeat( 3, 1fr );}
section.shop .grid.products {grid-template-columns:repeat( 5, 1fr );}

@media (max-width:1200px){
  section.shop .grid.products {grid-template-columns:repeat( 4, 1fr );}
}

@media (max-width:900px){
  section.shop .grid.products {grid-template-columns:repeat( 3, 1fr );}
}

@media (max-width:600px){
  section.shop .grid.products {grid-template-columns:repeat( 2, 1fr );}
}

@media (max-width:380px){
  section.shop .grid.products {grid-template-columns:1fr;}
}



section.product {padding:40px 0; }
section.product .container {display:flex; gap:60px;}
section.product .image {flex:1;}
section.product .info {flex:1; display:flex; flex-direction:column; align-items:flex-start; gap:20px;}
section.product .info .price {font-size:20px; line-height:120%; font-weight:bold; color:rgba( 0,0,0, .6 );}
section.product .info .field {display:flex; flex-direction:column; align-items:flex-start; gap:5px;}
section.product .info .name {margin:0 0 20px 0;}
section.product .info .description {margin:0 0 20px 0; font-size:18px; line-height:120%;}
section.product .info h4 {margin:0 0 15px 0; font-size:18px; line-height:120%; font-weight:bold;}

@media (max-width:900px){
  section.product .container {flex-direction:column; gap:30px;}
}

section.cart {padding:40px 0;}
section.cart table {width:100%;}
section.cart table th {font-weight:bold;}
section.cart table th,
section.cart table td {padding:20px 20px 20px 0;border-bottom:1px solid rgba( 0,0,0, .3 );}
section.cart table td {min-width:150px; padding:20px 20px 20px 0;}
section.cart table tr.subtotal td {border-bottom:0;}
section.cart table tr.subtotal strong {margin-left:10px;}
section.cart table .text-right {text-align:right;}
section.cart table a {text-decoration:none;}
section.cart table a:hover {text-decoration:underline;}
section.cart table .image {max-width:120px;}
section.cart table .image img {width:100%;}
section.cart table .product-parts {display:flex; align-items:center; gap:30px;}
section.cart table .product-parts .info {display:flex; flex-direction:column; align-items:flex-start; gap:5px;}
section.cart table .product-parts .remove {font-size:12px; line-height:120%; color:rgba( 0,0,0, .5 );}
section.cart table input[type="number"] {width:100px;}

section.cart .buttons {display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:30px;}


.has-active-subscription {margin:20px 0;}
.has-active-subscription .container {display:flex; align-items:center; gap:30px; padding:20px; background:rgba( 0,0,0, .05 );}
.has-active-subscription p {margin:0;}
.has-active-subscription .button {padding:8px 16px; font-size:14px; line-height:120%;}




section.ads {padding:30px 0;}
section.ads .container {display:grid; grid-template-columns:repeat( 5, 1fr ); gap:30px;}
section.ads.fill-width .container {grid-template-columns:repeat( var(--columns), 1fr );}
section.ads:not(.fill-width) .container {display:flex; flex-wrap:wrap;}
section.ads:not(.fill-width) a {flex:1; min-width:195px; max-width:195px;}
section.ads img {width:100%;}

@media ( max-width: 900px ){
  section.ads.fill-width .container {grid-template-columns:repeat( 2, 1fr );}
}

@media ( max-width:600px ){
  section.ads .container,
  section.ads.fill-width .container {grid-template-columns:repeat( 1, 1fr );}
  section.ads:not(.fill-width) .container {display:grid;}
  section.ads:not(.fill-width) a {min-width:auto; max-width:none;}
}




#stockists-text a[name] {scroll-margin-top:calc( var(--header-height) );}



.pagenumbers {display:flex; gap:30px; margin-top:30px;}
.pagenumbers .pages {display:flex; gap:5px;}
.pagenumbers a {display:inline-flex; gap:10px; padding:10px 15px; background:black; color:white; text-decoration:none; font-size:14px; line-height:100%;}
.pagenumbers a:hover {background:var(--brandbg);}
.pagenumbers a.disabled {background:#ccc; cursor:default;}
.pagenumbers a.active {background:var(--brandbg);}
.pagenumbers .dots {padding:0 15px; align-self:flex-end;}

@media (max-width:1024px){
  .pagenumbers .pages {flex-wrap:wrap;}
}


#mc_embed_signup {}
#mc_embed_signup fieldset {display:flex; flex-direction:column; align-items:flex-start; gap:20px; /* padding:30px; border:1px solid rgba( 0,0,0, .1 ); */}
#mc_embed_signup fieldset legend {display:none; margin-left:0px; padding:.5em 1em; background:white; font-weight:bold;}
#mc_embed_signup .indicate-required {color:rgba( 0,0,0, .6 ); font-style:italic; font-size:.8em; line-height:1.4em;}
#mc_embed_signup .flex-fields {display:flex; gap:20px; width:100%;}
#mc_embed_signup .mc-field-group {display:flex; flex-direction:column; width:100%;}
#mc_embed_signup .mc-field-group label {width:150px; font-size:.8em; line-height:1.4em;}

@media (max-width:900px){
  #mc_embed_signup .flex-fields {flex-direction:column;}
  #mc_embed_signup .flex-fields > div {flex:1;}
}

@media (max-width:600px){
  #mc_embed_signup fieldset legend {text-align:center;}
}