h1 {
  color: var(--primary-color);
}
/*  menu */
.navbar-default {
  background-color: var(--navbar-bg-color);
  border-color: var(--navbar-border-color);
  -webkit-box-shadow: 0px 7px 6px -6px rgba(0, 0, 0, 0.28);
  -moz-box-shadow: 0px 7px 6px -6px rgba(0, 0, 0, 0.28);
  box-shadow: 0px 7px 6px -6px rgba(0, 0, 0, 0.28);
}

.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-text {
  color: var(--navbar-menu-text-color);
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: var(--navbar-menu-hover-text-color);
  background-color: var(--navbar-menu-hover-bg-color);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #ffffff;
  background-color: var(--main-color);
}

.navbar-brand {
  display: inline-block;
  width: var(--logo-width);
  height: var(--logo-height);
  background-image: var(--logo-url);
  background-size: contain;
  background-repeat: no-repeat;
  text-indent: -9999px;
}

.navbar > .container .navbar-brand,
.navbar > .container-fluid .navbar-brand {
  margin-left: 0px;
}

/* Force padding top on img logo */
.navbar-header {
  margin-top: 8px !important;
}

/* buttons */
.btn-primary {
  color: #fff;
  background-color: var(--button-primary-background-color);
  border-color: var(--button-primary-border-color);
}

/* links */
a {
  color: var(--main-color);
  text-decoration: none;
}

/* login */
.site-login {
  width: 100%;
  height: 100vh;
  background: linear-gradient(
    180deg,
    var(--login-bg-top-color) 35%,
    var(--login-bg-bottom-color) 100%
  );
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.site-login h1 {
  color: #fff;
}

.site-login-wrapper {
  border: 1px solid gray;
  padding: 20px;
  border-radius: 10px;
  background-color: #fff;
  max-width: 700px;
}

/* grid */
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: var(--main-color);
  border-color: var(--main-color);
}

.pagination > li > a,
.pagination > li > span {
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: var(--main-color);
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
}