*{
  box-sizing: border-box;
}

body {
  margin: 0; 
  padding: 0;
  
}


.container {
  width: 80vw; 
  height: 80vh;
  display: grid;
  grid-gap: 20px;
  margin: 20 auto;
  
  grid-template-columns: 1fr 1fr 2fr;
  grid-template-rows: 1fr 1fr 1fr;
  grid-template-areas: 
    "ed_region  gender  map"
    "ed_region  decile  map"
    "year year map";
    
  
}

svg {
  overflow: visible;
}

.chart {
  border: 1px solid #5D6063;
}


#chart__ed_region {
  grid-area: ed_region;
}

#chart__decile {
  grid-area: decile;
}

#chart__map {
  grid-area: map;
}

#chart__year {
  grid-area: year;
}

#chart__gender {
  grid-area: gender;
}