:root {
  --argonne-blue: #0d5eaf;
  --argonne-dark-blue: #003c71;
  --argonne-light-blue: #eaf2fb;
  --argonne-accent: #00a3e0;
  --argonne-border: #c9dcef;
  --argonne-text: #1f2d3d;
}

/* Base links */
a {
  color: var(--argonne-blue);
}

a:hover,
a:focus {
  color: var(--argonne-dark-blue);
}

/* Buttons */
.btn-primary,
.btn.btn-primary,
.user-button.btn-primary {
  background-color: var(--argonne-blue) !important;
  border-color: var(--argonne-blue) !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.user-button.btn-primary:hover,
.user-button.btn-primary:focus {
  background-color: var(--argonne-dark-blue) !important;
  border-color: var(--argonne-dark-blue) !important;
  color: #ffffff !important;
}

/* Dropdown menus */
.dropdown-menu {
  border-color: var(--argonne-border);
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: var(--argonne-light-blue);
  color: var(--argonne-dark-blue);
}

/* Shared logo sizing */
.argonne-site-logo {
  display: inline-block;
  vertical-align: middle;
  width: auto;
  max-width: 220px;
  max-height: 40px;
}

/* Postorius top navbar */
header.navbar,
header.navbar nav,
header.navbar .navbar-header,
header.navbar .navbar-brand,
header.navbar .navbar-collapse,
header.navbar ul.navbar-nav,
header.navbar ul.navbar-nav li,
header.navbar ul.navbar-nav li a {
  background-color: var(--argonne-blue) !important;
  border-color: var(--argonne-blue) !important;
  color: #ffffff !important;
}

/* Postorius secondary header */
header.page-header {
  background-color: var(--argonne-blue) !important;
  border-color: var(--argonne-blue) !important;
  color: #ffffff !important;
}

header.page-header.cels-page-header {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #000000 !important;
  margin: 0 !important;
  padding: 14px 20px !important;
  min-height: 59px !important;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

/* HyperKitty navbar logo sizing */
#navbar-main .navbar-brand {
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 220px !important;
  padding: 0 !important;
}

#navbar-main .navbar-brand img.argonne-site-logo {
  display: block !important;
  height: 35px !important;
  max-height: 35px !important;
  width: auto !important;
  max-width: 220px !important;
}

/* Footer / section accents */
.footer,
.panel-heading,
.card-header,
.page-header {
  border-color: var(--argonne-border);
}

.panel-heading,
.card-header {
  background-color: var(--argonne-light-blue);
  color: var(--argonne-dark-blue);
}