/* Sticky footer */
html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 3em;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 3em;
  line-height: 1em;
}

/* Nav Bar */
.nav-item:hover {
  background-color: var(--hrw-secondary);
}

.nav-item:hover>a {
  color: white;
}

/* HR Wallingford colours */
:root {
  --hrw-white: #f5f5f5;
  --hrw-dark: #3c3c3b;
  --hrw-silver: #ededed;
  --hrw-muted: #9d9d9c;
  --hrw-primary: #5e9cae;
  --hrw-secondary: #005172;
  --hrw-info: #156570;
  --hrw-success: #879637;
  --hrw-warning: #d47620;
  --hrw-danger: #983222;
  --hrw-primary-1: #6ea6b6;
  --hrw-primary-2: #7eb0be;
  --hrw-primary-3: #8fbac6;
  --hrw-primary-4: #9ec4ce;
  --hrw-primary-5: #aecdd6;
  --hrw-primary-6: #bfd7df;
  --hrw-primary-7: #cee1e7;
  --hrw-primary-8: #dfebef;
  --hrw-primary-9: #eff5f7;
  --hrw-white-1: #f6f6f6;
  --hrw-white-2: #f7f7f7;
  --hrw-white-3: #f8f8f8;
  --hrw-white-4: #f9f9f9;
  --hrw-white-5: #fafafa;
  --hrw-white-6: #fbfbfb;
  --hrw-white-7: #fcfcfc;
  --hrw-white-8: #fdfdfd;
  --hrw-white-9: #fefefe;
  --hrw-dark-1: #50504f;
  --hrw-dark-2: #636362;
  --hrw-dark-3: #777776;
  --hrw-dark-4: #8a8a89;
  --hrw-dark-5: #9d9d9d;
  --hrw-dark-6: #b1b1b1;
  --hrw-dark-7: #c4c4c4;
  --hrw-dark-8: #d8d8d8;
  --hrw-dark-9: #ececec;
  --hrw-silver-1: #efefef;
  --hrw-silver-2: #f1f1f1;
  --hrw-silver-3: #f2f2f2;
  --hrw-silver-4: #f4f4f4;
  --hrw-silver-5: #f6f6f6;
  --hrw-silver-6: #f8f8f8;
  --hrw-silver-7: #fafafa;
  --hrw-silver-8: #fbfbfb;
  --hrw-silver-9: #fdfdfd;
  --hrw-muted-1: #a7a7a6;
  --hrw-muted-2: #b1b1b0;
  --hrw-muted-3: #bbb2ba;
  --hrw-muted-4: #c4c4c4;
  --hrw-muted-5: #cececd;
  --hrw-muted-6: #d8d8d7;
  --hrw-muted-7: #e1e1e1;
  --hrw-muted-8: #ebebeb;
  --hrw-muted-9: #f5f5f5;
  --hrw-secondary-1: #1a6380;
  --hrw-secondary-2: #33748e;
  --hrw-secondary-3: #4d869d;
  --hrw-secondary-4: #6697aa;
  --hrw-secondary-5: #7fa6a4;
  --hrw-secondary-6: #99b9c7;
  --hrw-secondary-7: #b2cad4;
  --hrw-secondary-8: #ccdce3;
  --hrw-secondary-9: #e6eef1;
  --hrw-info-1: #2d757f;
  --hrw-info-2: #44848d;
  --hrw-info-3: #5c949b;
  --hrw-info-4: #73a3a9;
  --hrw-info-5: #8ab2b7;
  --hrw-info-6: #a1c1c6;
  --hrw-info-7: #b8d0d4;
  --hrw-info-8: #d0e0e2;
  --hrw-info-9: #e8f0f1;
  --hrw-success-1: #93a14b;
  --hrw-success-2: #9fab5f;
  --hrw-success-3: #abb673;
  --hrw-success-4: #b7c087;
  --hrw-success-5: #c3ca9b;
  --hrw-success-6: #cfd5af;
  --hrw-success-7: #dbdfc3;
  --hrw-success-8: #e7ead7;
  --hrw-success-9: #f3f5eb;
  --hrw-warning-1: #d88437;
  --hrw-warning-2: #dd914d;
  --hrw-warning-3: #e19f63;
  --hrw-warning-4: #e5ad79;
  --hrw-warning-5: #e9ba8f;
  --hrw-warning-6: #eec8a6;
  --hrw-warning-7: #f2d6bc;
  --hrw-warning-8: #f6e4d2;
  --hrw-warning-9: #fbf2e9;
  --hrw-danger-1: #a34739;
  --hrw-danger-2: #ad5b4e;
  --hrw-danger-3: #b77065;
  --hrw-danger-4: #c1847a;
  --hrw-danger-5: #cb9890;
  --hrw-danger-6: #d6ada7;
  --hrw-danger-7: #e0c1bc;
  --hrw-danger-8: #ead6d3;
  --hrw-danger-9: #f5ebe9;
}

.hrw-white {
  background-color: var(--hrw-white);
  color: black;
}

.hrw-white-border {
  border-color: var(--hrw-white);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark {
  background-color: var(--hrw-dark);
  color: white;
}

.hrw-dark-border {
  border-color: var(--hrw-dark);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver {
  background-color: var(--hrw-silver);
  color: black;
}

.hrw-silver-border {
  border-color: var(--hrw-silver);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted {
  background-color: var(--hrw-muted);
  color: white;
}

.hrw-muted-border {
  border-color: var(--hrw-muted);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary {
  background-color: var(--hrw-primary);
  color: white;
}

.hrw-primary-border {
  border-color: var(--hrw-primary);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary {
  background-color: var(--hrw-secondary);
  color: white;
}

.hrw-secondary-border {
  border-color: var(--hrw-secondary);
  border-style: solid;
  border-width: 1px;
}

.hrw-info {
  background-color: var(--hrw-info);
  color: white;
}

.hrw-info-border {
  border-color: var(--hrw-info);
  border-style: solid;
  border-width: 1px;
}

.hrw-success {
  background-color: var(--hrw-success);
  color: white;
}

.hrw-success-border {
  border-color: var(--hrw-success);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning {
  background-color: var(--hrw-warning);
  color: white;
}

.hrw-warning-border {
  border-color: var(--hrw-warning);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger {
  background-color: var(--hrw-danger);
  color: white;
}

.hrw-danger-border {
  border-color: var(--hrw-danger);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-1 {
  background-color: var(--hrw-primary-1);
  color: white;
}

.hrw-primary-1-border {
  border-color: var(--hrw-primary-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-2 {
  background-color: var(--hrw-primary-2);
  color: white;
}

.hrw-primary-2-border {
  border-color: var(--hrw-primary-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-3 {
  background-color: var(--hrw-primary-3);
  color: black;
}

.hrw-primary-3-border {
  border-color: var(--hrw-primary-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-4 {
  background-color: var(--hrw-primary-4);
  color: black;
}

.hrw-primary-4-border {
  border-color: var(--hrw-primary-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-5 {
  background-color: var(--hrw-primary-5);
  color: black;
}

.hrw-primary-5-border {
  border-color: var(--hrw-primary-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-6 {
  background-color: var(--hrw-primary-6);
  color: black;
}

.hrw-primary-6-border {
  border-color: var(--hrw-primary-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-7 {
  background-color: var(--hrw-primary-7);
  color: black;
}

.hrw-primary-7-border {
  border-color: var(--hrw-primary-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-8 {
  background-color: var(--hrw-primary-8);
  color: black;
}

.hrw-primary-8-border {
  border-color: var(--hrw-primary-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-primary-9 {
  background-color: var(--hrw-primary-9);
  color: black;
}

.hrw-primary-9-border {
  border-color: var(--hrw-primary-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-1 {
  background-color: var(--hrw-white-1);
  color: black;
}

.hrw-white-1-border {
  border-color: var(--hrw-white-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-2 {
  background-color: var(--hrw-white-2);
  color: black;
}

.hrw-white-2-border {
  border-color: var(--hrw-white-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-3 {
  background-color: var(--hrw-white-3);
  color: black;
}

.hrw-white-3-border {
  border-color: var(--hrw-white-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-4 {
  background-color: var(--hrw-white-4);
  color: black;
}

.hrw-white-4-border {
  border-color: var(--hrw-white-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-5 {
  background-color: var(--hrw-white-5);
  color: black;
}

.hrw-white-5-border {
  border-color: var(--hrw-white-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-6 {
  background-color: var(--hrw-white-6);
  color: black;
}

.hrw-white-6-border {
  border-color: var(--hrw-white-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-7 {
  background-color: var(--hrw-white-7);
  color: black;
}

.hrw-white-7-border {
  border-color: var(--hrw-white-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-8 {
  background-color: var(--hrw-white-8);
  color: black;
}

.hrw-white-8-border {
  border-color: var(--hrw-white-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-white-9 {
  background-color: var(--hrw-white-9);
  color: black;
}

.hrw-white-9-border {
  border-color: var(--hrw-white-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-1 {
  background-color: var(--hrw-dark-1);
  color: white;
}

.hrw-dark-1-border {
  border-color: var(--hrw-dark-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-2 {
  background-color: var(--hrw-dark-2);
  color: white;
}

.hrw-dark-2-border {
  border-color: var(--hrw-dark-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-3 {
  background-color: var(--hrw-dark-3);
  color: white;
}

.hrw-dark-3-border {
  border-color: var(--hrw-dark-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-4 {
  background-color: var(--hrw-dark-4);
  color: white;
}

.hrw-dark-4-border {
  border-color: var(--hrw-dark-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-5 {
  background-color: var(--hrw-dark-5);
  color: white;
}

.hrw-dark-5-border {
  border-color: var(--hrw-dark-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-6 {
  background-color: var(--hrw-dark-6);
  color: white;
}

.hrw-dark-6-border {
  border-color: var(--hrw-dark-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-7 {
  background-color: var(--hrw-dark-7);
  color: white;
}

.hrw-dark-7-border {
  border-color: var(--hrw-dark-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-8 {
  background-color: var(--hrw-dark-8);
  color: black;
}

.hrw-dark-8-border {
  border-color: var(--hrw-dark-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-dark-9 {
  background-color: var(--hrw-dark-9);
  color: black;
}

.hrw-dark-9-border {
  border-color: var(--hrw-dark-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-1 {
  background-color: var(--hrw-silver-1);
  color: black;
}

.hrw-silver-1-border {
  border-color: var(--hrw-silver-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-2 {
  background-color: var(--hrw-silver-2);
  color: black;
}

.hrw-silver-2-border {
  border-color: var(--hrw-silver-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-3 {
  background-color: var(--hrw-silver-3);
  color: black;
}

.hrw-silver-3-border {
  border-color: var(--hrw-silver-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-4 {
  background-color: var(--hrw-silver-4);
  color: black;
}

.hrw-silver-4-border {
  border-color: var(--hrw-silver-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-5 {
  background-color: var(--hrw-silver-5);
  color: black;
}

.hrw-silver-5-border {
  border-color: var(--hrw-silver-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-6 {
  background-color: var(--hrw-silver-6);
  color: black;
}

.hrw-silver-6-border {
  border-color: var(--hrw-silver-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-7 {
  background-color: var(--hrw-silver-7);
  color: black;
}

.hrw-silver-7-border {
  border-color: var(--hrw-silver-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-8 {
  background-color: var(--hrw-silver-8);
  color: black;
}

.hrw-silver-8-border {
  border-color: var(--hrw-silver-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-silver-9 {
  background-color: var(--hrw-silver-9);
  color: black;
}

.hrw-silver-9-border {
  border-color: var(--hrw-silver-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-1 {
  background-color: var(--hrw-muted-1);
  color: black;
}

.hrw-muted-1-border {
  border-color: var(--hrw-muted-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-2 {
  background-color: var(--hrw-muted-2);
  color: black;
}

.hrw-muted-2-border {
  border-color: var(--hrw-muted-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-3 {
  background-color: var(--hrw-muted-3);
  color: black;
}

.hrw-muted-3-border {
  border-color: var(--hrw-muted-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-4 {
  background-color: var(--hrw-muted-4);
  color: black;
}

.hrw-muted-4-border {
  border-color: var(--hrw-muted-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-5 {
  background-color: var(--hrw-muted-5);
  color: black;
}

.hrw-muted-5-border {
  border-color: var(--hrw-muted-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-6 {
  background-color: var(--hrw-muted-6);
  color: black;
}

.hrw-muted-6-border {
  border-color: var(--hrw-muted-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-7 {
  background-color: var(--hrw-muted-7);
  color: black;
}

.hrw-muted-7-border {
  border-color: var(--hrw-muted-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-8 {
  background-color: var(--hrw-muted-8);
  color: black;
}

.hrw-muted-8-border {
  border-color: var(--hrw-muted-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-muted-9 {
  background-color: var(--hrw-muted-9);
  color: black;
}

.hrw-muted-9-border {
  border-color: var(--hrw-muted-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-1 {
  background-color: var(--hrw-secondary-1);
  color: white;
}

.hrw-secondary-1-border {
  border-color: var(--hrw-secondary-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-2 {
  background-color: var(--hrw-secondary-2);
  color: white;
}

.hrw-secondary-2-border {
  border-color: var(--hrw-secondary-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-3 {
  background-color: var(--hrw-secondary-3);
  color: white;
}

.hrw-secondary-3-border {
  border-color: var(--hrw-secondary-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-4 {
  background-color: var(--hrw-secondary-4);
  color: white;
}

.hrw-secondary-4-border {
  border-color: var(--hrw-secondary-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-5 {
  background-color: var(--hrw-secondary-5);
  color: white;
}

.hrw-secondary-5-border {
  border-color: var(--hrw-secondary-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-6 {
  background-color: var(--hrw-secondary-6);
  color: white;
}

.hrw-secondary-6-border {
  border-color: var(--hrw-secondary-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-7 {
  background-color: var(--hrw-secondary-7);
  color: white;
}

.hrw-secondary-7-border {
  border-color: var(--hrw-secondary-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-8 {
  background-color: var(--hrw-secondary-8);
  color: black;
}

.hrw-secondary-8-border {
  border-color: var(--hrw-secondary-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-secondary-9 {
  background-color: var(--hrw-secondary-9);
  color: black;
}

.hrw-secondary-9-border {
  border-color: var(--hrw-secondary-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-1 {
  background-color: var(--hrw-info-1);
  color: white;
}

.hrw-info-1-border {
  border-color: var(--hrw-info-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-2 {
  background-color: var(--hrw-info-2);
  color: white;
}

.hrw-info-2-border {
  border-color: var(--hrw-info-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-3 {
  background-color: var(--hrw-info-3);
  color: white;
}

.hrw-info-3-border {
  border-color: var(--hrw-info-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-4 {
  background-color: var(--hrw-info-4);
  color: white;
}

.hrw-info-4-border {
  border-color: var(--hrw-info-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-5 {
  background-color: var(--hrw-info-5);
  color: white;
}

.hrw-info-5-border {
  border-color: var(--hrw-info-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-6 {
  background-color: var(--hrw-info-6);
  color: black;
}

.hrw-info-6-border {
  border-color: var(--hrw-info-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-7 {
  background-color: var(--hrw-info-7);
  color: black;
}

.hrw-info-7-border {
  border-color: var(--hrw-info-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-8 {
  background-color: var(--hrw-info-8);
  color: black;
}

.hrw-info-8-border {
  border-color: var(--hrw-info-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-info-9 {
  background-color: var(--hrw-info-9);
  color: black;
}

.hrw-info-9-border {
  border-color: var(--hrw-info-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-1 {
  background-color: var(--hrw-success-1);
  color: white;
}

.hrw-success-1-border {
  border-color: var(--hrw-success-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-2 {
  background-color: var(--hrw-success-2);
  color: white;
}

.hrw-success-2-border {
  border-color: var(--hrw-success-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-3 {
  background-color: var(--hrw-success-3);
  color: white;
}

.hrw-success-3-border {
  border-color: var(--hrw-success-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-4 {
  background-color: var(--hrw-success-4);
  color: black;
}

.hrw-success-4-border {
  border-color: var(--hrw-success-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-5 {
  background-color: var(--hrw-success-5);
  color: black;
}

.hrw-success-5-border {
  border-color: var(--hrw-success-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-6 {
  background-color: var(--hrw-success-6);
  color: black;
}

.hrw-success-6-border {
  border-color: var(--hrw-success-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-7 {
  background-color: var(--hrw-success-7);
  color: black;
}

.hrw-success-7-border {
  border-color: var(--hrw-success-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-8 {
  background-color: var(--hrw-success-8);
  color: black;
}

.hrw-success-8-border {
  border-color: var(--hrw-success-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-success-9 {
  background-color: var(--hrw-success-9);
  color: black;
}

.hrw-success-9-border {
  border-color: var(--hrw-success-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-1 {
  background-color: var(--hrw-warning-1);
  color: white;
}

.hrw-warning-1-border {
  border-color: var(--hrw-warning-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-2 {
  background-color: var(--hrw-warning-2);
  color: white;
}

.hrw-warning-2-border {
  border-color: var(--hrw-warning-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-3 {
  background-color: var(--hrw-warning-3);
  color: white;
}

.hrw-warning-3-border {
  border-color: var(--hrw-warning-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-4 {
  background-color: var(--hrw-warning-4);
  color: black;
}

.hrw-warning-4-border {
  border-color: var(--hrw-warning-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-5 {
  background-color: var(--hrw-warning-5);
  color: black;
}

.hrw-warning-5-border {
  border-color: var(--hrw-warning-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-6 {
  background-color: var(--hrw-warning-6);
  color: black;
}

.hrw-warning-6-border {
  border-color: var(--hrw-warning-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-7 {
  background-color: var(--hrw-warning-7);
  color: black;
}

.hrw-warning-7-border {
  border-color: var(--hrw-warning-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-8 {
  background-color: var(--hrw-warning-8);
  color: black;
}

.hrw-warning-8-border {
  border-color: var(--hrw-warning-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-warning-9 {
  background-color: var(--hrw-warning-9);
  color: black;
}

.hrw-warning-9-border {
  border-color: var(--hrw-warning-9);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-1 {
  background-color: var(--hrw-danger-1);
  color: white;
}

.hrw-danger-1-border {
  border-color: var(--hrw-danger-1);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-2 {
  background-color: var(--hrw-danger-2);
  color: white;
}

.hrw-danger-2-border {
  border-color: var(--hrw-danger-2);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-3 {
  background-color: var(--hrw-danger-3);
  color: white;
}

.hrw-danger-3-border {
  border-color: var(--hrw-danger-3);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-4 {
  background-color: var(--hrw-danger-4);
  color: white;
}

.hrw-danger-4-border {
  border-color: var(--hrw-danger-4);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-5 {
  background-color: var(--hrw-danger-5);
  color: white;
}

.hrw-danger-5-border {
  border-color: var(--hrw-danger-5);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-6 {
  background-color: var(--hrw-danger-6);
  color: black;
}

.hrw-danger-6-border {
  border-color: var(--hrw-danger-6);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-7 {
  background-color: var(--hrw-danger-7);
  color: black;
}

.hrw-danger-7-border {
  border-color: var(--hrw-danger-7);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-8 {
  background-color: var(--hrw-danger-8);
  color: black;
}

.hrw-danger-8-border {
  border-color: var(--hrw-danger-8);
  border-style: solid;
  border-width: 1px;
}

.hrw-danger-9 {
  background-color: var(--hrw-danger-9);
  color: black;
}

.hrw-danger-9-border {
  border-color: var(--hrw-danger-9);
  border-style: solid;
  border-width: 1px;
}


/* == Loading spinner =============================================================== */
#mask {
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  margin: auto;
  position: fixed;
  display: block;
  z-index: 10000;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 250ms, visibility 250ms;
  user-select: none;
}

#mask-centre-block {
  top: 50%;
  left: 50%;
  position: absolute;
  text-align: center;
  height: 20%;
  margin-top: -10%;
  width: 20%;
  margin-left: -10%;
}

#mask-spinner {
  color: #003f5a;
  width: 10vw;
  height: 10vw;
}


/* == Map sidebar =================================================================== */
.sidebar-header {
  background-color: #003f5a;
}

.sidebar-tabs>li.active,
.sidebar-tabs>ul>li.active {
  background-color: #003f5a;
}

.sidebar-content {
  background-color: rgba(253, 253, 253, 0.9);
}

.sidebar-tabs {
  background-color: #fdfdfd;
}

/* -- Legend ------------------------------------------------------------------------ */
.layer-group {
  margin-left: 0.5em;
  padding-left: 0.5em;
}

.group-title {
  cursor: pointer;
  user-select: none;
}

.group-title input {
  cursor: pointer;
  user-select: none;
}

.layer-title {
  cursor: pointer;
  user-select: none;
}

.legend-title input {
  margin: 3px;
  cursor: pointer;
  user-select: none;
}

.legend-entry.inactive .legend-title {
  color: #a2a2a2;
}

.layer-group.inactive .layer-title {
  color: #a2a2a2;
}

.legend-entry.inactive .legend-symbol {
  display: none;
}

.legend-polygon {
  float: left;
  height: 20px;
  width: 20px;
  border: 1px solid #525252;
}

.legend-polyline {
  float: left;
  width: 20px;
  margin-top: 11px;
  border: 1px solid #525252;
}

.legend-point {
  float: left;
  border-radius: 50%;
  margin-top: 11px;
  width: 20px;
}


.legend-checkbox {
  width: 15px;
}

.btn-group-xs > .btn, .btn-xs {
  padding: .2rem .2rem;
  font-size: .875rem;
  line-height: .5;
  border-radius: .2rem;
}

.hrwlogo {
  background: #ffffff80;
  padding: 10px;
  border-radius: 5px;
}

.timeseries-plot {
  background: #ffffff80;
  /* margin-right: 300px; */
}

.mapfooter {
  background: #ffffff80;
  margin:0;
  font-weight: "bold";

}

.leaflet-control-scale{
    padding-left: 5px;
}

