nav .navbar-brand
{
    /* size for brand */
    font-size: xx-large;
}

/* colors for brand */
nav .navbar-brand .blue
{
    color: #537fbe;
}
nav .navbar-brand .red
{
    color: #ea433b;
}
nav .navbar-brand .yellow
{
    color: #f5b82e;
}
nav .navbar-brand .green
{
    color: #2e944b;
}

main .form-control
{
    /* center form controls */
    display: inline-block;

    /* override Bootstrap's 100% width for form controls
    width: auto; */
}

main
{
    /* scroll horizontally as needed */
    overflow-x: auto;

    /* center contents */
    text-align: center;
}

main img
{
    /* constrain images on small screens */
    max-width: 100%;
}

th
{
    text-align: left;
}

td
{
    text-align: left;
}

#history
{
    font-size: smaller;
}



/* The popup form - hidden by default */
.form-popup {
  display: none;
  border: none;
  /*z-index: 1;*/
}

/* Add styles to the form container*/
.form-container {
  max-width: 170px;
  background-color: white;
  opacity: 1;
}

/* Set a style for the buy and sell buttons */
.form-container .btn {
  font-size: 12px;
  color: white;
  border: none;
  cursor: pointer;
  margin-top:10px;
  margin-right:3px;
  margin-bottom:10px;
  opacity: 0.8;
}

/* close button */
.form-container .cancel {
  background-color: gray;
}


/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}

.col-form-label{
    font-weight: bold;
}

.counter.counter-lg {
    top: -24px !important;
}

.fa-sign-out:hover{
    color: tomato !important;
}

.dot {
    height: 10px;
    width: 10px;
    background-color: red;
    border-radius: 50%;
    position: absolute; /* Position the badge within the relatively positioned button */
    top: -5;
    right: 5;
    display: inline-block;
  }

  .blue {
    display: inline-block !important; /* Inline elements with width and height. TL;DR they make the icon buttons stack from left-to-right instead of top-to-bottom */
    position: relative !important; /* All 'absolute'ly positioned elements are relative to this one */
    /*padding: 2px 5px !important; /* Add some padding so it looks nice */
  }
