@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;400;700;900&display=swap');
@import url("https://api.mapbox.com/mapbox-gl-js/v3.1.2/mapbox-gl.css");

.metro-interactive-2024{
  font-family: 'Inter', sans-serif;
  
  box-sizing: border-box;
  padding:0px 0px;

  --reading-line-height:1.6em;
  --header-line-height:1.2em;
  --header-margin:0px 0px 10px 0px;

  --sticky-element-top-offset:100px;

  --panel-height:calc(100vh);
  --min-graphic-height:20vh;
  --graphic-height:calc(70vh - var(--sticky-element-top-offset));

  line-height:var(--reading-line-height);
}

.metro-interactive-2024 .selected-metro-area{
  font-size:28px;
  font-weight:bold;
  line-height:1.2em;
  margin:18px 0px 18px 0px;
}

.metro-interactive-2024 .small-figure-title{
  font-size:13px;
  margin:0px;
  line-height:1em;
  z-index:10;
}

.metro-interactive-2024 .small-figure-title:after{
  display:block;
  content:"";
  z-index:1;
  width:100%;
  height:6px;
  border-bottom:1px solid #333333;
}


.metro-interactive-2024 .source-notes{
  margin:20px 0px;
  max-width:780px;
}

.metro-interactive-2024 .source-notes p{
  font-size:13px;
  line-height:1.3em;
  margin:10px 0px;
  padding:0px;
}


.metro-interactive-2024.fixed-banner{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  z-index:100;
  height:var(--sticky-element-top-offset);
  width:100%;
  padding:15px;
  background:#003A70;
  color:#ffffff;
}
.metro-interactive-2024.shadow-banner{
  position:relative;
  width:100%;
  height:var(--sticky-element-top-offset);
}

.metro-interactive-2024.scrolly-wrap{
  width:100%;
  max-width:1400px;
  margin:0px auto;
  padding:15px;
}

.metro-interactive-2024.scrolly-wrap div.is-header{
  z-index:100 !important;
  padding:15px 10px 5px 10px;
  margin:2em auto 15px auto;
  background-color:rgba(255,255,255,1);
  border-bottom:0px solid #333333;
}

.metro-interactive-2024.scrolly-wrap div.is-footer{
  z-index:100 !important;
  padding:5px 10px 5px 10px;
  margin:0em auto;
  border-top:1px solid #dddddd;

  position:absolute;
  bottom:0px;
  left:0px;

  background-color:#ffffff;
  transform:translateY(150%);
  box-sizing:border-box;
}

.metro-interactive-2024.scrolly-wrap p.tooltip-text{
  line-height:1.25em;
  margin:0px 0px 10px 0px;
}

.metro-interactive-2024.scrolly-wrap div.is-footer p{
  font-size:14px;
  line-height:1.3em;
  margin:0px 0px 5px 0px;
  text-shadow: 1px 1px 1px #ffffff, 1px 1px 8px #ffffff, 
  0px 0px 15px #ffffff;
  
}

.metro-interactive-2024.scrolly-wrap div.is-text{
  padding:0px 10px;
  height:var(--panel-height);
  font-size:18px;
  text-shadow: 1px 1px 1px #ffffff, 1px 1px 8px #ffffff, 
               0px 0px 15px #ffffff;
  z-index:125 !important;
  position:relative;
  pointer-events: none;

  display:flex;
  flex-direction: column;
  justify-content: center;
  border:0px solid #ffffff;

  transform: translate3d(0px, 0px, 0px);
}

.metro-interactive-2024.scrolly-wrap div.is-text p{
  background-color:rgba(255,255,255,.8);
  box-shadow:1px 1px 12px 6px rgba(0,0,0,0.2);
  padding:1em;
  border-radius:3px;
  font-size:18px;
  position:relative;
  z-index:150;
}

.metro-interactive-2024.scrolly-wrap div.is.header.is-text{
  height:auto;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section{
  width:100%;
  position:relative;
  margin-bottom:10vh;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div.is-sticky.is-graphic-panel{
  transition: opacity 300ms, transform 300ms;
  transition-delay: 50ms;
  margin-bottom:10vh;
  opacity:0;
  transform: translateY(50px);
  transform: translate3d(0px, 50px, 0px);
  z-index:50;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div.is-sticky.is-graphic-panel.is-active{
  transition: opacity 600ms, transform 600ms;
  opacity:1;
  transform: translateY(0px);
  transform: translate3d(0px, 0px, 0px);
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section > div.is-sticky{
  position:sticky;
  top:var(--sticky-element-top-offset);
  left:0px;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section > div{
  z-index:50;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div.is-graphic{
  min-height:var(--min-graphic-height);
  z-index:25;
  padding:0px;
  transition:background-color 500ms;
  position:relative;
  width:100%;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div#metro-area-map .is-graphic{
  height:var(--graphic-height);
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div.is-graphic > p:first-child{
  text-align:center;
  font-weight:900;
  text-transform:uppercase;
  max-width:100%;
}

.metro-interactive-2024.scrolly-wrap div.scrolly-section div.is-graphic:after{
  content:"";
  color:#ffffff;
  left:50%;
  transform:translateX(-50%);
  top:0px;
  position:absolute;
  line-height:16px;
  font-size:16px;
}

.metro-interactive-2024.scrolly-wrap table{
  margin:0em 10px;
  border-collapse: collapse;
  width:calc(100% - 20px);
  table-layout: fixed;
}
.metro-interactive-2024.scrolly-wrap table thead th:first-child{
  text-align:left;
  width:40%;
}
.metro-interactive-2024.scrolly-wrap table thead th{
  text-align:right;
  font-weight:bold;
  vertical-align:bottom;
  border-bottom:1px solid #aaaaaa;
  line-height:1.3em;
  padding:5px 3px;
  font-size:15px;
}

.metro-interactive-2024.scrolly-wrap table tbody td:first-child{
  text-align:left;
}

.metro-interactive-2024.scrolly-wrap table tbody td{
  text-align:right;
  vertical-align:bottom;
  border-bottom:1px solid #aaaaaa;
  line-height:1.3em;
  padding:5px 3px;
  font-size:15px;
}

.metro-interactive-2024.scrolly-wrap table tbody tr.highlight-row td{
  background-color:#FFDD00;
}
.metro-interactive-2024.scrolly-wrap table tbody tr.highlight-row td:first-child{
  font-weight:bold;
  padding-left:10px;
}

.metro-interactive-2024.scrolly-wrap .condensed .is-header{
  margin:0px;
}

.metro-interactive-2024.scrolly-wrap .condensed table tbody td,
.metro-interactive-2024.scrolly-wrap .condensed table tbody td{
  line-height:1.1em;
  padding:3px 1px 1px 1px;
}

.metro-interactive-2024 h2{
  font-weight:900;
  font-size:22px;
  margin: var(--header-margin);
  line-height:var(--header-line-height);
}

.metro-interactive-2024 h4{
  font-weight:400;
  font-size:18px;
  margin: var(--header-margin);
  line-height:var(--header-line-height);
  line-height:var(--reading-line-height);
}

.mapboxgl-ctrl-attrib-button{
  all:unset !important;
}

.mapboxgl-popup{
  pointer-events: none !important;
  padding:0px !important;
  border:unset !important;
  margin:unset !important
}
.mapboxgl-popup-content{
  pointer-events: none !important;
  padding:10px !important;
  border:unset !important;
  margin:unset !important;
}

.metro-interactive-2024 .outer-mapbox{
  min-height:50vh;
  height:100%;
}

.metro-interactive-2024 .map-overlay{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100px;
  z-index:100;
  pointer-events: none;;
}


g.role-mark path {
  /*animation: dash 1s linear forwards;*/
  transition: stroke-dashoffset 1500ms;
  transition-timing-function: ease;
}

g.role-axis-domain line{
  opacity:0;
}

.block--heading-container{
  margin:60px auto 30px auto;
}

.block--big-inline-image{
  max-width:1010px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  margin-bottom:40px;
  padding:15px 5px !important;
  border-style: solid !important;
  border-color: #000000 !important;
  border-width: 1px 0px 0px 0px !important;
}

.block--big-inline-image h5,
.block--big-inline-image h4{
  line-height:1.25em !important;
  max-width:100% !important;
  margin:0px 0px 5px 0px !important;
  font-weight:bold !important;
}

.block--big-inline-image p{
  line-height:1.25em !important;
  margin:0.5em 0em !important;
}

.block--big-inline-image .wp-block-image,
.block--big-inline-image .wp-block-table{
  max-width:1000px !important;
  margin-bottom:0px !important;
  min-width:640px !important
}

.block--big-inline-image .wp-block-table td{
  display:table-cell !important;
}

/*clearfix*/
.metro-interactive-content .c-fix:after{
  content:""; 
  display:table; 
  clear:both;
}

.metro-interactive-content{
  margin:0px auto;
  position:relative;
  padding-top:0px;
  padding-bottom:50px;
  padding-right:10px;
  padding-left:10px;
}

.metro-interactive-content .magenta-text{
  color:#F26D00;
  font-weight:bold;
}

.metro-interactive-content .hypothetical-text{
  border-bottom:1px dotted #F26D00;
}

.metro-interactive-content span{
  font-size:inherit;
  font-family:inherit;
  font-weight:inherit;
}

.metro-interactive-content text tspan{
  font-family:inherit;
  font-size:inherit;
  fill:inherit;
}

.rm-this{
  display:none !important;
}

.no-viz{
  visibility:hidden;
}

.metro-interactive-content svg{
  overflow:visible;
}

/*use border-box on div containers and p tags*/
.metro-interactive-content div, 
.metro-interactive-content p,
.metro-interactive-content *:before,
.metro-interactive-content *:after{
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
}

.metro-interactive-content p, .metro-interactive-content li, .metro-interactive-content td, .metro-interactive-content button{
  color:#111111;
  line-height:var(--reading-line-height);
  font-family: 'Inter', sans-serif;
  margin:0em 0em 1em 0em;
}

.metro-interactive-content b{
  font-weight:bold;
}

.metro-interactive-content strong, .metro-interactive-content em, .metro-interactive-content b{
  color:inherit;
  font-size:inherit;
}

.metro-interactive-content .main-content{
  max-width:1200px;
  margin:0rem auto;
  padding:1rem 10px;
  position:relative;
  z-index:1;
}

.metro-interactive-content .sticky-footer{
  position:sticky;
  bottom:0px;
  right:10px;
  opacity:0;
  transition: opacity 500ms;
}

.metro-interactive-content .sticky-footer p{
  text-align:right;
  font-size:15px;
}

.metro-interactive-content .sticky-footer p a{
  padding:4px 8px;
  border:2px solid #ffffff;
  background-color:#ffffff;
  border-radius:9px;
  box-shadow:2px 2px 8px 0px rgba(0,0,0,0.2);
}

.metro-interactive-content .rr-section{
  margin:6rem auto;
  padding:5px 0px;
}

.metro-interactive-content .rr-section:first-child{
  margin-top:4rem;
}

.report-link{
  border-radius:0.5em;
  border:none;
  padding:5px 10px;
}

.metro-interactive-content a{
  text-decoration: none !important;
  border:none !important;
  color:inherit;
}

.warm1{background-color: #FF5E1A;border-color: #FF5E1A;}
.warm2{background-color: #ff7a1a;border-color: #ff7a1a;}
.warm3{background-color: #ff911a;border-color: #ff911a;}
.warm4{background-color: #ffa61a;border-color: #ffa61a;}
.warm5{background-color: #ffbb1a;border-color: #ffbb1a;}
.warm6{background-color: #FFCF1A;border-color: #FFCF1A;}

.rr-section > p:first-child{
  border-style:solid; 
  border-width:0px 0px 3px 0px; 
  padding:0px 10px 5px 12px;
  font-size:2rem;
  font-weight:900;
}

.warm-border1 > p:first-child{border-color: #FF5E1A;}
.warm-border2 > p:first-child{border-color: #ff7a1a;}
.warm-border3 > p:first-child{border-color: #ff911a;}
.warm-border4 > p:first-child{border-color: #ffa61a;}
.warm-border5 > p:first-child{border-color: #ffbb1a;}
.warm-border6 > p:first-child{border-color: #FFCF1A;}

.warm-border1 p.report-link{background-color: #FF5E1A;}
.warm-border2 p.report-link{background-color: #ff7a1a;}
.warm-border3 p.report-link{background-color: #ff911a;}
.warm-border4 p.report-link{background-color: #ffa61a;}
.warm-border5 p.report-link{background-color: #ffbb1a;}
.warm-border6 p.report-link{background-color: #FFCF1A;}

p.report-link{
  text-align:right;
  display:inline-block;
}

.custom-col-widths6 td:first-child,
.custom-col-widths6 th:first-child{
  width:calc(2 * (100% / 7)) !important;
}

.custom-col-widths6 td,
.custom-col-widths6 th{
  width:calc((100% / 7)) !important;
}

.metro-interactive-content nav{
  position:sticky;
  top:0px;
  left:0px;
  min-height:10em;
  z-index:10;
}

.scrolly-flex{
  display:flex;
  flex-wrap:wrap;
  flex-direction: row-reverse;
  align-items: flex-start;
}

.scrolly-flex > div{
  width:40%;
}

/*parent of graphics container (#scrolly-graphics) is sticky*/
.scrolly-flex > div:first-child{
  width:60%;
  position:sticky;
  top:140px;
  left:0px;
}

.scrolly-flex > div > div{
  width:100%;
  margin-bottom:1em;
  position:relative;
  padding:5px 15px 5px 0px;
}

.scrolly-flex > div > div#scrolly-graphics{
  width:100%;
}

.scrolly-flex #scrolly-graphics > div{
  width:100%;
  position:absolute;
  top:0px;
  left:0px;
  opacity:0;
  transition:opacity 0ms;
  min-height:0px;
}

.scrolly-flex #scrolly-graphics > div.active-graphic{
  opacity:1;
}

.scrolly-flex #scrolly-text > div p{
  padding:10px 10px 10px 15px;
  text-shadow: 1px 1px 1px #ffffff, 1px 1px 8px #ffffff, 0px 0px 15px #ffffff;
  background-color:rgba(255,255,255,.8);
  box-shadow:1px 1px 12px 6px rgba(0,0,0,0.2);
}

.metro-interactive-2024 .dashboard-flex{
  display:flex;
  flex-direction: row;
  justify-content:space-between;
  align-items: stretch;
  flex-wrap:wrap;
  max-width:1600px;
  gap: 30px 30px;
}

.metro-interactive-2024 .dashboard-flex > div{
  padding:15px;
  flex-basis:50%;
  max-width:calc(50% - 15px);
  flex-grow:1;
  flex-shrink:1;
  box-sizing: border-box;
  border:1px solid #dddddd;
  border-radius:5px;
  box-shadow: 0px 2px 8px -5px #000000;
}

text, path{
  transition:opacity 1000ms;
}

/*flexbox navigation wrapper*/
.metro-interactive-nav{
  display:flex;
  justify-content:space-between;
  align-items: stretch;
  flex-direction:row;

  max-width:1200px;
  margin:0rem auto;
  padding:0px 15px;
}

#top-nav-only{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:auto;
}

#top-nav-only > div{
  margin:0px auto;
}

/*nav buttons, also display:flex for easy alignment of labels*/
.metro-interactive-nav > div{
  flex-basis:12%;

  margin:0px 0px 5px 0px;
  padding:0px 15px;

  display:flex;
  align-items:center;
  justify-content: flex-start;
  border-style:solid;
  border-width:0px 0px 0px 0px;

  position:relative;
  cursor:pointer;

  transition: transform 400ms;

  position:relative;
}

.metro-interactive-nav > div:before{
  content:"";
  position:absolute;
  bottom:0px;
  left:0px;
  height:0px;
  width:100%;
  transition: bottom 500ms, height 500ms, border-width 500ms;
  box-shadow: 0px 5px 8px -5px #000000;
  background-color:inherit;
}

.metro-interactive-nav > div.nav-selected:before{
  bottom:-15px;
  height:15px;
}

.metro-interactive-nav > div.nav-selected{
  cursor:default;
}

.metro-interactive-nav > div:hover{
  border-color:#fafafa;
  transform:translateY(-6px);
}

.metro-interactive-nav > div.nav-selected:hover{
  transform:none;
}

.metro-interactive-nav > div > p{
  user-select:none !important;
  flex-basis:100% !important;
  font-weight:900 !important;
  text-align:center !important;
  margin: 0.5em auto !important;
  padding: 0.5em 0em 0.5em 0em !important;
  line-height:1.25em !important;
}

.metro-interactive-nav > div > p a{
  text-decoration: none !important;
}

.metro-interactive-nav > div > p a:after{
  position:absolute;
  left:0px;
  top:0px;
  width:100%;
  height:calc(100% + 15px);
  content:"";
}

.metro-interactive-nav > div:hover p:after{
  content:"»";
  visibility:visible;
}

.metro-interactive-nav > div p:after{
  content:"»";
  visibility:hidden;
}

.metro-interactive-banner{
  background-attachment: fixed;
  background-image: url('https://c24215cec6c97b637db6-9c0895f07c3474f6636f95b6bf3db172.ssl.cf1.rackcdn.com/interactives/2020/real-estate-reset/assets/img/banner.png');
  background-size: cover;
  min-height:70vh;

  margin:0px;
  padding:5px 25px;
  z-index:0;
  position:relative;

  margin-bottom:5rem;
}
.metro-interactive-banner.alt-banner{
  background-image: url('https://c24215cec6c97b637db6-9c0895f07c3474f6636f95b6bf3db172.ssl.cf1.rackcdn.com/interactives/2020/real-estate-reset/assets/img/altbanner.jpg');
}
.metro-interactive-banner.alt-banner2{
  background-image: url('https://c24215cec6c97b637db6-9c0895f07c3474f6636f95b6bf3db172.ssl.cf1.rackcdn.com/interactives/2020/real-estate-reset/assets/img/altbanner2.jpg');
}

.metro-interactive-banner > div{
  bottom:10rem;
  position:absolute;
  left:50%;
  transform: translateX(-50%);
  padding-bottom:1rem;
}

.metro-interactive-banner > div > p{
  color:#ffffff;
  margin:1rem auto;

  text-align:center;
  line-height:1.25em;
  text-shadow:
      3px 3px 0 #003A70,
    -1px -1px 0 #003A70,  
     1px -1px 0 #003A70,
     -1px 1px 0 #003A70,
      1px 1px 0 #003A70;

  font-size:1.5rem;
}

.metro-interactive-banner > div > p:first-child{
  font-size:4rem;
  font-weight:900;

}

.section-overview{
  display:flex;
  justify-content:space-between;
  align-items: stretch;
  flex-direction: row;

  max-width:1200px;
  margin:0rem auto;
  padding:0px 15px;
}

.section-overview > div{
  flex-basis: 35%;
  padding:0px 0px;
  order:1;
  margin-bottom:2rem;
}

.section-overview > div.overview-figure{
  background:#dddddd;
  min-height:400px;
  flex-basis:60%;
  order:2;
}
.section-overview.reversed > div{
  order:2;
}

.section-overview.reversed > div.overview-figure{
  order:1
}

@media (min-width:0px){
  /*nav buttons*/
  .metro-interactive-nav{
    flex-direction:column;
    flex-direction:row;
    flex-wrap:wrap;
    padding:0px 5px;
  }
  .metro-interactive-nav > div{
    flex-basis:auto;
    flex-basis:50%;
    flex-basis:calc(50% - 2.5px);
    flex-grow:0;
    flex-shrink:0;
  }

  .metro-interactive-content nav{
    position:relative;
    top:0px;
    z-index:1;
  }

  .metro-interactive-nav > div.nav-selected{
    cursor:pointer;
  }

  .metro-interactive-nav > div p{
    min-height:4rem;
  }

  .metro-interactive-nav > div.nav-selected p{
    border-bottom:0px solid #fafafa;
  }

  .metro-interactive-nav > div:before{
    display:none;
  }

  .section-overview{
    flex-direction: column;
  }

  .section-overview.reversed > div{
    order:1;
  }

  .metro-interactive-banner > div{
    bottom: 0rem;
  }

  .metro-interactive-nav > div:hover{
    transform:none;
  }
  

  .metro-interactive-banner{
    margin-bottom:5px;
  }

  #top-nav-only{
    top:0px;
    position:relative;
  } 
  #top-nav-only.topfix60, 
  #top-nav-only.topfix70, 
  #top-nav-only.topfix80,
  #top-nav-only.topfix90{
    top:0px;
    
  }

  #top-nav-only:before{
    content:"Briefs in this series ▼";
    display:block;
    font-weight:900;
    text-align:center;
    margin:10px auto;
  }

  .block--essay-hero{
    margin-bottom:1rem;
  }

  .metro-interactive-content #metro-select-wrap{
    display:flex;
    max-width:480px;
    width:100%;
    margin:15px auto 3rem auto;;
    flex-direction: column;
    flex-wrap:nowrap;
    flex-direction: flex-start;
    align-items: flex-start;
  }

  .metro-interactive-content #metro-select-wrap p{
    white-space: nowrap;
    margin:0px 10px 0px 0px;
  }

  .metro-interactive-content select{
    padding:7px 10px;
    border: 2px solid #F26D00;
    border-radius:5px;
    background-color:#ffffff;
    font-size:16px;
    width:100%;
  }

  .metro-interactive-content p.highlighted-text{
    color:#F26D00;
  }

  /*mobile*/
  .scrolly-flex{
    flex-direction:column;
  }
  .scrolly-flex > div{
    width:100%;
  }
  .scrolly-flex > div:first-child{
    width:100%;
    top:100px;
  }

  .scrolly-flex > div > div{
    min-height:90vh;
  }
}

@media (min-width:550px){
  .metro-interactive-nav > div p{
    min-height:0rem;
  }
}

@media (min-width: 760px){
  .shorter-hero{
    max-height:65vh;
  }
}


@media (min-width:950px){
  .metro-interactive-nav{
    flex-direction:row;
    flex-wrap:nowrap;
  }
  
  /*nav buttons*/
  .metro-interactive-nav > div{
    flex-basis:12%;
    flex-basis:calc((100% - 50px) / 6);
    flex-grow:0;
    flex-shrink:1;
  }

  .metro-interactive-content nav{
    position:sticky;
    padding:0px 15px;
    z-index:10;
    top:135px;
  }

  .metro-interactive-nav > div.nav-selected{
    cursor:default;
  }

  .metro-interactive-nav > div p{
    min-height:0rem;
  }

  .metro-interactive-nav > div.nav-selected p{
    border-bottom:2px solid #fafafa;
  }

  .metro-interactive-nav > div:before{
    display:block;
  }

  .metro-interactive-nav > div:hover{
    transform:translateY(-6px);
  }
  

  .section-overview{
    flex-direction: row;
  }

  .section-overview.reversed > div{
    order:2;
  }

  .metro-interactive-banner{
    margin-bottom:5rem;
  }

  .metro-interactive-banner > div{
    bottom: 10rem;
  }

  #top-nav-only{
    top:50px;
    position:fixed;
  }
  #top-nav-only.topfix50{
    top:60px;
  }
  #top-nav-only.topfix60{
    top:70px;
  }
  #top-nav-only.topfix70{
    top:80px;
  }
  #top-nav-only.topfix80{
    top:90px;
  }
  #top-nav-only.topfix90{
    top:100px;
  }

  #top-nav-only:before{
    content:"";
    display:block;
    font-family: 'Playfair Display', serif !important;
    font-weight:900;
    text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    visibility:hidden;
  }

  .block--essay-hero{
    margin-bottom:3rem;
  }

  .scrolly-flex{
    flex-direction:row-reverse;
  }
  .scrolly-flex > div{
    width:40%;
  }
  .scrolly-flex > div:first-child{
    width:60%;
    top:120px;
  }

  .scrolly-flex > div > div{
    min-height:75vh;
  }

}


.has-drop-cap:not(:focus):first-letter {
  font-weight:300 !important;
}

.block--essay-author__content h5{
  line-height:1.5em !important;
}
.wp-block-group.bp-no-margin .core-block:not(:last-child) *{
  margin-bottom:0px !important;
}

.wp-block-group.bp-no-margin .block--heading-container{
  margin-bottom:0px !important;
}

.wp-block-group.bp-no-margin h6{
  padding:.9375rem;
}

.wp-block-group.bp-no-margin{
  margin:3rem auto;
}

.table-of-contents{
  margin:1em 0px 2em 0px;
  padding:15px;
  background-color:#ffffff;
}

@media screen and (min-width:0px){
  .metro-interactive-2024 .dashboard-flex{
    flex-direction: row;
    justify-content:space-between;
    align-items: stretch;
    flex-wrap:wrap;
    gap: 30px 30px;
  }

.metro-interactive-2024 .dashboard-flex > div{
    flex-basis:100%;
    max-width:100%;
  }
}

@media (min-width:950px) and (min-height:0px){

  .metro-interactive-2024 .dashboard-flex{
    flex-direction: row;
    justify-content:space-between;
    align-items: stretch;
    flex-wrap:wrap;
    gap: 30px 30px;
  }

.metro-interactive-2024 .dashboard-flex > div{
    flex-basis:50%;
    max-width:calc(50% - 15px);
  }

  .shorter-hero .block--essay-hero__title,
  .shorter-hero .block--essay-hero__title h1{
    font-size:2.5rem;
  }

  .shorter-hero .block--essay-hero__sub-title,
  .shorter-hero .block--essay-hero__sub-title > *{
    font-size:1.75rem;
  }

  .table-of-contents{
    margin:4em -100px 20px 20px;
    float:right;
    width:350px;
  }
}

@media (min-width:950px) and (max-height:760px){
  .block--essay-hero.shorter-hero .inner{
    margin-bottom:0px;
  } 
}



@media (min-width:950px) and (min-height:760px){
  .shorter-hero .block--essay-hero__title,
  .shorter-hero .block--essay-hero__title h1{
    font-size:3.5rem;
  }

  .shorter-hero .block--essay-hero__sub-title,
  .shorter-hero .block--essay-hero__sub-title > *{
    font-size:2.25rem;
  }
}

@media (min-width:1200px) and (min-height:0px){

  .table-of-contents{
    margin:4em -200px 20px 20px;
  }
}