/*
Put your custom overlay styles in here
You can use your northpass color palette in this file

{{ color_palette.button_font_color }}
{{ color_palette.button_color }}
{{ color_palette.button_hover_color }}
{{ color_palette.header_font_color }}
{{ color_palette.header_font_hover_color }}
{{ color_palette.header_color }}
*/

/* Import Roboto font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');

/* Set Roboto as default font */
body, html {
  font-family: 'Roboto', sans-serif !important;
}

/* Set base paragraph size to 14px */
p,
body p,
.fr-view p,
.uikit-lx-v3 p {
  font-size: 14px !important;
}

.np-footer {
  background: #013D28 !important;
}

/* Hide all aside elements */
aside {
  display: none !important;
}

/* Hide anything that comes after footer */
footer ~ * {
  display: none !important;
}

.np-footer ~ * {
  display: none !important;
}

/* Hide all powered-by variations */
.np-powered-by {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

aside.np-powered-by {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

.np-powered-by.show {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

aside.np-powered-by.show {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

/* More specific selectors to override existing styles */
.np-footer + .np-powered-by {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

.np-footer + aside.np-powered-by {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

.np-footer + aside.np-powered-by.show {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  background: #013D28 !important;
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

.np-main .page-title {
  color: #1b3e4f !important;
  font-size: 1.25rem !important;
  font-weight: 900 !important;
  line-height: 1.5rem !important;
  margin-bottom: 12px !important;
  text-align: center !important;
}