.btn {
  border-radius: 0%;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #000000 !important;
    border-color: #000000 !important;
    color: #FFFFFF;
}


/*
.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #4682A9 !important;
    border-color: #4682A9 !important;
    color: #FFFFFF;
}
*/

.bold-inline-text-color {
  color: #5f5f5f;
}

a {
  color: rgb(95, 95, 95);
  text-decoration: underline;
}

/*
a:hover {
  color: #4682A9;
}

.nav-link:hover {
  color: #4682A9;
}*/

a:hover {
  color: #000000;
}

.nav-link:hover {
  color: #000000;
}


/* Modify the background color */
/* I had bg-white initially*/
.navbar-custom {
  background-color: #F6F4EB;
}

.body-padding {
  padding-top: 0px;
  padding-right: 10px;
  padding-bottom: 0px;
  padding-left: 10px;
}

.center-text {
  text-align: center;
}

.navbar-nav{
  text-align: right;
  padding-right: 5px;
}

/*
 The following workaround is needed to allow the image exceeding the havigation bar vertically. 
 Details are found at: https://stackoverflow.com/questions/18474564/bootstrap-3-navbar-with-logo
 */
 .navbar-brand {
  float: left;
  height: 40px;
  padding: 5px 10px; /* padding: 10px 10px; reduced to 0 so that the icon is more at the top. */
  font-size: 18px;
  line-height: 20px;
  /*background-image: url("img/logo_barn_nordic.png");*/
  background-repeat: no-repeat;
  background-position: left center;
}

/* Viewport XS */
.brand-logo-formatting {
  width: 160px;
  height: 41px;
}

/* Viewport SM */
@media (min-width: 768px) {
  .brand-logo-formatting {
      width: 160px;
      height: 41px;
  }
}
/* Viewport MD */
@media (min-width: 992px) {
  .brand-logo-formatting {
      width: 160px;
      height: 41px;
  }
}
/* Viewport LG */
@media (min-width: 1200px) {
  .brand-logo-formatting {
      width: 160px;
      height: 41px;
  }
}