/* Project color variables */
:root {
 --dark-green: #4A6A48; /* FF4A6A48 */
 --light-green: #64875E; /* FF64875E */
 --medium-grey: #555555; /* FF555555 */
 --light-grey: #F1F1F1; /* FFF1F1F1 */
 --white: #ffffff;
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

/* Focus / outline styles - use white + light green ring */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0.1rem var(--white), 0 0.25rem var(--light-green);
}

/* Override Bootstrap dark navbar color to use project dark green */
.navbar-dark.bg-dark {
 background-color: var(--dark-green) !important;
}

/* Primary buttons use light green */
.btn-primary {
 color: var(--white);
 background-color: var(--light-green);
 border-color: var(--dark-green);
}
.btn-primary:hover, .btn-primary:focus {
 background-color: var(--dark-green);
 border-color: var(--dark-green);
}

/* Nav pills active color */
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
 color: var(--white);
 background-color: var(--light-green);
 border-color: var(--dark-green);
}

/* Links in the project use medium grey */
a {
 color: var(--medium-grey);
}

/* Borders use light grey */
.border-top {
 border-top: 1px solid var(--light-grey);
}
.border-bottom {
 border-bottom: 1px solid var(--light-grey);
}

.box-shadow {
 box-shadow: 0 .25rem .75rem rgba(0,0,0, .05);
}

button.accept-policy {
 font-size: 1rem;
 line-height: inherit;
}

.footer {
 position: absolute;
 bottom: 0;
 width: 100%;
 white-space: nowrap;
 line-height: 60px;
 color: var(--medium-grey);
 background-color: transparent;
}

html {
 position: relative;
 min-height: 100%;
}

body {
 margin-bottom: 60px;
 background-color: var(--white);
 color: var(--medium-grey);
}