﻿:root {
  /* Colours: */
  --hpcn-green: #258721;
  --hpcn-turquoise: #00B6F0;
  --hpcn-light-turquoise: #E5F8FE;
  --hpcn-light-yellow: #FEFEE5;
  --hpcn-dark-bg: #16284C;
  --hpcn-rust: #DC5C07;
  --hpcn-pink: #FFF3F3;
  --hpcn-red: #F11B1B;
  --hpcn-light-grey: #F6F6F6;
  --hpcn-pale-grey: #F8F8F8;
  --hpcn-med-grey: #E1E1E1;
  --hpcn-dark-grey: #C0C0C0;
}

@font-face {
  font-family: MontserratBold;
  src: url(../fonts/Montserrat-Bold.ttf);
}
@font-face {
  font-family: MontserratBoldItalic;
  src: url(../fonts/Montserrat-BoldItalic.ttf);
}
@font-face {
  font-family: OpenSansLight;
  src: url(../fonts/OpenSans-Light.ttf);
}
@font-face {
  font-family: OpenSanseBold;
  src: url(../fonts/OpenSans-Bold.ttf);
}
@font-face {
  font-family: FigtreeBold;
  src: url(../fonts/Figtree-Bold.ttf);
}
@font-face {
  font-family: FigtreeRegular;
  src: url(../fonts/Figtree-Regular.ttf);
}
html, body {
  font-family: OpenSansLight, FigtreeRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.8333333333vw;
}

h1:focus {
  outline: none;
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid #e50000;
}

.validation-message {
  color: #e50000;
}

.container {
  max-width: 62.5vw;
  margin: auto;
}

.find-header {
  background-color: black;
  color: white;
  height: 9.1145833333vw;
}

.hpsc-seal-logo {
  height: 5.46875vw;
}

.find-title-container {
  width: 100%;
  max-width: 49.4791666667vw;
  margin: auto;
}

.find-title {
  font-size: 1.5625vw;
  font-weight: bold;
  line-height: 5.46875vw;
}

.howto-search-title {
  font-weight: 700;
  font-size: 1.0416666667vw;
  text-align: center;
  margin-top: 4.0625vw;
}

.accordion-container {
  margin-top: 1.5625vw;
}

.accordion-button {
  font-size: 1.0416666667vw !important;
  font-weight: bold;
  background-color: var(--hpcn-light-turquoise) !important;
}

.accordion-button:not(.collapsed) {
  background-color: white !important;
}

.accordion-body {
  color: rgb(102, 102, 102);
  line-height: 1.3541666667vw;
}

.accordion-item {
  margin-top: 0.78125vw;
}

.search-tool-title {
  font-size: 2.0833333333vw;
  font-weight: bold;
  width: 100%;
  text-align: center;
  margin: 2.6041666667vw;
}

.search-question {
  font-size: 1.5625vw;
  font-weight: bold;
  margin-top: 0.78125vw;
  margin-bottom: 0.2604166667vw;
}

.search-input {
  font-size: 1.5625vw;
  border: 2px solid black;
  padding: 0.2604166667vw;
  width: 100%;
}

.div-why {
  text-align: center;
  line-height: 1.3020833333vw;
  padding: 0 2.6041666667vw !important;
}

.what-is-container {
  margin-top: 2.6041666667vw;
  background-color: var(--hpcn-dark-bg);
  color: white;
  padding: 2.0833333333vw;
}
