.policy-matters {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 1250px;
  max-width: 1950px;
  flex-direction: column;
  overflow: hidden;
}

.headers {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  height: 250px;
  width: 100%;
}

.header-item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  position: relative;
  width: 20%;
  background-color: #313131;
  border-left: 1px solid #fff;
  cursor: pointer;
}

.header-item p {
  width: 100%;
  text-align: center;
  position: absolute;
  top: 20px;
}

.header-item p,
.header-item h3 {
  color: #fff;
}

.header-item h3 {
  width: 100%;
  text-align: center;
}

.policy-node-container {
  width: 100%;
  /*height: 700px;*/
  padding-top: 37%;
  /*  min-height: 500px;*/
}

.information {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  z-index: 1;
}

.information-item p {
  text-align: left;
  width: 100%;
}

.information-item {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 30px;
  position: relative;
  flex-direction: column;
  width: 20%;
  background-color: #fff;
  min-height: 300px;
}

.information-item h3 {
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
}

.information-item .info-content {
  display: none;
  font-weight: 300;
}

.information-item.active .info-content {
  display: block;
}

/*Information Colour Schemes*/

.income-security.active {
  background-color: #f26c4f;
}

.income-security {
  border-bottom: 5px solid  #f26c4f;
}

.income-security-info {
  border-top: 5px solid  #f26c4f;
}

.income-security-info h3 {
  color: #f26c4f;
}

.housing-security.active {
  background-color: #605ca8;
  border-bottom: 5px solid  #605ca8;
}

.housing-security {
  border-bottom: 5px solid  #605ca8;
}

.housing-security-info {
  border-top: 5px solid  #605ca8;
}

.housing-security-info h3 {
  color: #605ca8;
}

.custody-access {
  border-bottom: 5px solid  #448ccb;
}

.custody-access.active {
  background-color: #448ccb;
}

.custody-access-info {
  border-top: 5px solid  #448ccb;
}

.custody-access-info h3 {
  color: #448ccb;
}

.access-support.active {
  background-color: #ae4076;
}

.access-support {
  border-bottom: 5px solid #ae4076;
}

.access-support-info {
  border-top: 5px solid #ae4076;
}

.access-support-info h3 {
  color: #ae4076;
}

.drv.active {
  background-color: #2db684;
}

.drv {
  border-bottom: 5px solid  #2db684;
}

.drv-info {
  border-top: 5px solid  #2db684;
}

.drv-info h3 {
  color: #2db684;
}

.policy-node-container {
  position: relative;
}

.connections-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
}

.connector-line {
  width: 4px;
  position: absolute;
  height: 100%;
  display: none;
}

.connector-line.active {
  display: block;
}

.income-security-connector {
  left: 10%;
  background-color: #f26c4f;
  transform-origin: top left;
}

.income-security-to-income-security-info {
  background-color: #f26c4f;
}

.income-security-to-access-support-info {
  height: 250%;
  transform: rotate(-58.2deg);
}

.income-security-to-drv-info {
  height: 250%;
  transform: rotate(-65.2deg);
}

.housing-security-connector {
  left: 30%;
  background-color: #605ca8;
  transform-origin: top left;
}

.custody-access-connector {
  left: 50%;
  background-color:#448ccb;
  transform-origin: top left;
}

.custody-access-to-housing-security-info {
  height: 160%;
  transform: rotate(28.2deg);
}

.access-support-connector {
  left: 70%;
  background-color: #ae4076;
  transform-origin: top left;
}

.drv-connector {
  left: 90%;
  background-color: #2db684;
  transform-origin: top left;
}

.drv-to-access-support-info {
  height: 160%;
  transform: rotate(28.2deg);
}

.drv-to-custody-access-info {
  height: 200%;
  transform: rotate(47.2deg);
}

.drv-to-housing-security-info {
  height: 200%;
  transform: rotate(58.2deg);
}

.drv-to-income-security-info {
  height: 300%;
  transform: rotate(65.2deg);
}

/*Nodes*/

.info-node {
  width: 160px;
  height: 60px;
  border-radius: 30px;
  background-color: #313131;
  color: #fff;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  cursor: pointer;
  position: absolute;
  z-index: 1;
  display: none;
}

.info-node.active {
  display: flex;
}

.info-node.active.show {
  box-shadow: 3px 5px 0 #313131;
}

.info-node p {
  margin: 0;
  text-align: center;
  font-weight: 700;
  font-size: .8em;
  line-height: 1.2;
}



.node-overlay {
  position: absolute;
  width: 350px;
  /*height: 260px;*/
  background-color: #313131;
  bottom: calc(100% + 20px);
  padding: 20px;
  display: none;
  z-index: 10;
}

.info-node.show .node-overlay{
  display: block;
}

.node-overlay.income-security-overlay {
  border-top: 5px solid #f26c4f;
}

.node-overlay.housing-security-overlay {
  border-top: 5px solid #605ca8;
}

.node-overlay.custody-access-overlay {
  border-top: 5px solid #448ccb;
}

.node-overlay.access-support-overlay {
  border-top: 5px solid  #ae4076;
}

.node-overlay.drv-overlay {
  border-top: 5px solid #2db684;
}

.node-overlay-content {
 /* max-height: 150px;*/
  overflow-y: auto;
}

.node-overlay:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 20px solid #313131;
  position: absolute;
  top: 99%;
  left: calc(50% - 20px);
}

.node-overlay-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 20px;
}

.node-overlay p {
  margin-bottom: 10px;
  text-align: left;
  font-weight: 400;
}

.no-close {
  width: 30px;
  height: 30px;
  transform: rotate(45deg);
  position: relative;
  align-items: center;
  justify-content: center;
  display: flex;
}

.no-close:before {
  content: "";
  width: 100%;
  height: 2px;
  background-color: #fff;
  position: absolute;
}

.no-close:after {
  content: "";
  width: 100%;
  height: 2px;
  background-color: #fff;
  transform: rotate(90deg);
  position: absolute;
}

.info-node.income-security-node {
  background-color: #f26c4f;
}

.info-node.income-security-node.OWA {
  left:  calc(10% - 80px);
}

.info-node.income-security-node.ODSPA {
  left:  calc(10% - 80px);
}

.info-node.income-security-node.DSA {
  left:  calc(10% - 80px);
}

.info-node.income-security-node.IRPA {
  left:  32%;
}

.info-node.income-security-node.LASA {
  left:  calc(50% - 80px);
}

.info-node.income-security-node.ATCP {
  left:  73%;
}

.info-node.housing-security-node {
  background-color: #605ca8;
}

.info-node.housing-security-node.HSA {
  left:  calc(30% - 80px);
}

.info-node.housing-security-node.AMH {
  left:  calc(30% - 80px);
}

.info-node.custody-access-node {
  background-color: #448ccb;
}

.info-node.custody-access-node.DA {
  left:  calc(50% - 80px);

}

.info-node.custody-access-node.AAH {
  left:  32%;
}

.info-node.access-support-node {
  background-color: #ae4076;
}

.info-node.access-support-node.RE {
  left:  calc(70% - 80px);
}

.info-node.drv-node {
  background-color: #2db684;
}

.info-node.drv-node.IRPA {
  left:  calc(90% - 80px);
}

.info-node.drv-node.FOD {
  left:  calc(90% - 80px);
}

.info-node.drv-node.POV {
  left:  78%;
}

.info-node.drv-node.SUR {
  left:  73%;
}

.info-node.drv-node.IRPA2 {
  left:  73%;
}

.info-node.drv-node.FD {
  left:  58%;
}

.info-node.drv-node.DBL {
  left:  52%;
}

.info-node.drv-node.HFL {
  left:  32%;
}

.info-node.drv-node.OWA {
  left:  18%;
}


/*NODE CSS*/

.connector_1 {left: 10%;background-color: #f26c4f;transform-origin: top left;}
.connector_2 { left: 30%;background-color: #605ca8;transform-origin: top left;}
.connector_3 { left: 50%;background-color: #448ccb;transform-origin: top left;}
.connector_4 { left: 70%;background-color: #ae4076;transform-origin: top left;}
.connector_5 { left: 90%;background-color: #2db684;transform-origin: top left;}

.connector_minus_1 {height: 160%; transform: rotate(28.2deg);}
.connector_minus_2 {height: 200%; transform: rotate(47.2deg);}
.connector_minus_3 {height: 250%; transform: rotate(58.2deg);}
.connector_minus_4 {height: 250%; transform: rotate(65.2deg);}

.connector_plus_1 {height: 160%; transform: rotate(-28.2deg);}
.connector_plus_2 {height: 200%; transform: rotate(-47.2deg);}
.connector_plus_3 {height: 250%; transform: rotate(-58.2deg);}
.connector_plus_4 {height: 250%; transform: rotate(-65.2deg);}

.info-node.selector-node p {color: #000;}
.info-node.selector-node {background-color: #fff; border:1px solid #000; display: flex}
.info-node.section-1-node {background-color: #f26c4f; border:1px solid #f26c4f;}
.info-node.section-2-node {background-color:#605ca8; border:1px solid #605ca8;}
.info-node.section-3-node {background-color: #448ccb; border:1px solid #448ccb;}
.info-node.section-4-node {background-color: #ae4076; border:1px solid #ae4076;}
.info-node.section-5-node {background-color: #2db684; border:1px solid #2db684;}

.info-node.in-row1 {top: 25%;}
.info-node.in-row2 {top: calc(25% + 100px);}
.info-node.in-row3 {top: calc(25% + 200px);}
.info-node.in-row4 {top: calc(25% + 300px);}
.info-node.in-row5 {top: calc(25% + 400px);}

.info-node.in-col1 {left:  calc(10% - 80px);}
.info-node.in-col2 {left:  12%;}
.info-node.in-col3 {left:  18%;}
.info-node.in-col4 {left:  calc(30% - 80px);}
.info-node.in-col5 {left:  32%;}
.info-node.in-col6 {left:  40%}
.info-node.in-col7 {left:  calc(50% - 80px)}
.info-node.in-col8 {left:  52%;}
.info-node.in-col9 {left:  58%;}
.info-node.in-col10 {left:  calc(70% - 80px)}
.info-node.in-col11 {left:  73%}
.info-node.in-col12 {left:  78%}
.info-node.in-col13 {left:  calc(90% - 80px)}

.node-overlay.section-1-overlay {border-top: 5px solid #f26c4f;}
.node-overlay.section-2-overlay {border-top: 5px solid #605ca8;}
.node-overlay.section-3-overlay {border-top: 5px solid #448ccb;}
.node-overlay.section-4-overlay {border-top: 5px solid  #ae4076;}
.node-overlay.section-5-overlay {border-top: 5px solid #2db684;}



@media all and (max-width: 1800px) {

  .node-overlay {
    transform: scale(1.2);
    transform-origin: bottom center;
  }

  .info-node.in-col1 .node-overlay {
    left: 5%;
  }

  .info-node.in-col1 .node-overlay:after {
    left: 20%;
  }

  .info-node.in-col-last .node-overlay {
    left: unset;
    right: 20%;
  }

  .info-node.in-col-last .node-overlay:after {
    left: unset;
    right: 14%;
  }

  .info-node {
    transform: scale(.85);
  }
  .info-node.in-row1 {
    top: 25%;
  }

  .info-node.in-row2 {
    top: calc(25% + 80px);
  }

  .info-node.in-row3 {
    top: calc(25% + 160px);
  }

  .info-node.in-row4 {
    top: calc(25% + 240px);
  }

  .info-node.in-row5 {
    top: calc(25% + 320px);
  }
}

@media all and (max-width: 1400px) {

  .header-item h3,
  .information-item h3{
    font-size: 1.6em;
  }

  .info-node {
    transform: scale(.75);
  }
  .info-node.in-row1 {
    top: 25%;
  }

  .info-node.in-row2 {
    top: calc(25% + 65px);
  }

  .info-node.in-row3 {
    top: calc(25% + 130px);
  }

  .info-node.in-row4 {
    top: calc(25% + 195px);
  }

  .info-node.in-row5 {
    top: calc(25% + 250px);
  }
}

.policy-node-container {
  background-color: #fff;
}
.policy-matters-popup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background-color: rgba(0,0,0,.8);
  z-index: 20000;
}

.policy-matters-popup-wrapper {
  width: 100%;
  height: 100%;
  overflow: auto;
}

.policy-matters-popup.show {
  display: block;
}

.btn-toggle-pm {
  padding: 10px 20px;
  border: 1px solid #000;
  cursor: pointer;
  display: flex;
  width: 140px;
  margin-bottom: 20px;
  align-items: center;
  justify-content: center;
}

.close-policy-acf {
  position: absolute;
  right: 30px;
  top: 30px;
  width: 50px;
  height: 50px;
  border: 1px solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transform: rotate(45deg);
  transition: .2s;
  cursor: pointer;
  z-index: 5;
}

.close-policy-acf:hover {
  background-color: #000;
}

.close-policy-acf:before,
.close-policy-acf:after{
  content: '';
  width: 70%;
  height: 2px;
  background-color: #000;
  position: absolute;
  transition: .2s;
}

.close-policy-acf:hover:before,
.close-policy-acf:hover:after {
  background-color: #fff;
}

.close-policy-acf:after {
  transform: rotate(90deg);
}