:root {
  --color-black: #000;
  --color-white: #fff;
  --color-bg-trans-white: rgba(255,255,255,0.7);
  --color-bg-trans-blue: rgba(5,62,106,0.8);
  --color-bg-trans-green: rgba(5,25,16,0.7);
  --color-pastel-green-light: #d0d4a6;
  --color-pastel-green-dark: #85a798;
  --color-grey: #8a9194;
  --color-grey-dark: #7b7e7f;
  --color-grey-darker: #333;
  --color-grey-light: #dadcdd;
  --color-grey-lighter: #e6e6e8;
  --color-grey-very-light: #f8f8f8;
  --color-green: #015d3b;
  --color-green-dark: #024731;
  --color-green-mid-light: #22785a;
  --color-green-light: #78b800;
  --color-green-light2: #85a798;
  --color-green-very-light: #85a798;
  --color-green-darker: rgba(2,71,49,0.7);
  --color-blue: #053e6a;
  --color-red: #dc8294;
  --color-overlay: rgba(255,255,255,0.5);
  --app-width: 1366px;
  --app-height: 959px;
  --page-height: 894px;
  --page-height: 869px;
}
@font-face {
  font-family: DefaultFont;
  src: url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.eot?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.eot");
  src: url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.eot?#iefix?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.eot?#iefix") format('embedded-opentype'), url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.svg#lloyds_bank_jackregular?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.svg#lloyds_bank_jackregular") format('svg'), url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.woff2?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.woff2") format('woff2'), url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.woff?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.woff") format('woff'), url("assets/fonts/regular/lloyds_bank_jack-regular-webfont.ttf?fallback=/assets/fonts/regular/lloyds_bank_jack-regular-webfont.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: LightFont;
  src: url("assets/fonts/light/lloyds_bank_jack-light-webfont.eot?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.eot");
  src: url("assets/fonts/light/lloyds_bank_jack-light-webfont.eot?#iefix?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.eot?#iefix") format('embedded-opentype'), url("assets/fonts/light/lloyds_bank_jack-light-webfont.svg#lloyds_bank_jacklight?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.svg#lloyds_bank_jacklight") format('svg'), url("assets/fonts/light/lloyds_bank_jack-light-webfont.woff2?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.woff2") format('woff2'), url("assets/fonts/light/lloyds_bank_jack-light-webfont.woff?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.woff") format('woff'), url("assets/fonts/light/lloyds_bank_jack-light-webfont.ttf?fallback=/assets/fonts/light/lloyds_bank_jack-light-webfont.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: MediumFont;
  src: url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.eot?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.eot");
  src: url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.eot?#iefix?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.eot?#iefix") format('embedded-opentype'), url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.svg#lloyds_bank_jackmedium?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.svg#lloyds_bank_jackmedium") format('svg'), url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.woff2?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.woff2") format('woff2'), url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.woff?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.woff") format('woff'), url("assets/fonts/medium/lloyds_bank_jack-medium-webfont.ttf?fallback=/assets/fonts/medium/lloyds_bank_jack-medium-webfont.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: BoldFont;
  src: url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.eot?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.eot");
  src: url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.eot?#iefix?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.eot?#iefix") format('embedded-opentype'), url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.svg#lloyds_bank_jackbold?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.svg#lloyds_bank_jackbold") format('svg'), url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.woff2?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.woff2") format('woff2'), url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.woff?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.woff") format('woff'), url("assets/fonts/bold/lloyds_bank_jack-bold-webfont.ttf?fallback=/assets/fonts/bold/lloyds_bank_jack-bold-webfont.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
}
* {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
* {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
*:focus {
  outline: 0;
}
body {
  margin: 0px;
  padding: 0px;
  font-family: DefaultFont;
  position: relative;
  width: var(--app-width);
  height: var(--page-height);
}
body .pull-right {
  float: right;
}
body .pull-left {
  float: right;
}
body .clearfix::after {
  content: "";
  display: block;
  clear: both;
}
body p,
body li,
body a {
  color: var(--color-grey-darker);
}
body ul {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  list-style: none;
}
body ul >li {
  margin: 0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  position: relative;
}
body ul >li::before {
  position: absolute;
  top: 8px;
  left: -18px;
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background-color: var(--color-green-dark);
}
body a.arrow-right,
body a.arrow-left {
  padding: 0px 60px 0px 0px;
  position: relative;
  font-size: 1.2rem;
}
body a.arrow-right::after,
body a.arrow-left::after {
  position: absolute;
  top: -10px;
  right: 0px;
  content: "";
  display: block;
  width: 45px;
  height: 45px;
  border-radius: 45px;
  background-color: var(--color-pastel-green-dark);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
body a.arrow-right {
  float: right;
}
body a.arrow-right::after {
  background-image: url("assets/images/arrow-white.png?fallback=/assets/images/arrow-white.png");
}
body #root >* >.page .searchbar {
  width: 100%;
  height: 70px;
  background-color: var(--color-white);
  border-bottom: 5px solid var(--color-green-light);
  position: relative;
  padding: 15px 20px 15px 160px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
}
body #root >* >.page .searchbar button {
  background: none;
  font-size: 1.1rem;
  color: var(--color-grey-darker);
  text-align: right;
  border: 0px;
  position: relative;
  display: block;
  height: 32px;
  padding: 0px 0px 0px 45px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body #root >* >.page .searchbar button::before {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 32px;
  height: 32px;
  background-color: var(--color-grey);
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
body #root >* >.page .searchbar button.btn-home {
  float: left;
}
body #root >* >.page .searchbar button.btn-home::before {
  background-color: var(--color-pastel-green-dark);
  background-image: url("assets/images/icon-home.png?fallback=/assets/images/icon-home.png");
}
body #root >* >.page .searchbar button.btn-previous {
  float: left;
  margin-right: 15px;
}
body #root >* >.page .searchbar button.btn-previous::before {
  background-color: var(--color-pastel-green-light);
  background-image: url("assets/images/icon-previous.png?fallback=/assets/images/icon-previous.png");
}
body #root >* >.page .searchbar button.btn-search {
  float: right;
}
body #root >* >.page .searchbar button.btn-search::before {
  background-image: url("assets/images/icon-search.png?fallback=/assets/images/icon-search.png");
}
body #root >* >.page >.footer {
  position: absolute;
  bottom: 0px;
  left: 0px;
  background-color: var(--color-green);
  background-position: 25px 50%;
  background-repeat: no-repeat;
  width: 100%;
  height: 25px;
  padding: 0px 20px 0px 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body #root >* >.page >.footer >a[data-link] {
  color: var(--color-white);
  position: relative;
  display: block;
  float: right;
  font-size: 2.37rem;
  padding: 0px 25px 0px 0px;
  margin: 15px 0px 0px 0px;
}
body #root >* >.page >.footer >a[data-link]::after {
  content: "";
  display: block;
  position: absolute;
  top: 0px;
  right: 0px;
  background-image: url("assets/images/arrow-white.png?fallback=/assets/images/arrow-white.png");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  width: 4%;
  height: 100%;
}
