body {
    padding-top: 58px;
    /* This is to prevent content from being hidden under the navbar */
}

#check-icon-modal{
    color: seagreen;
    font-size: 50px;
}

#remove-icon-modal{
    color: red;
    font-size: 50px;
}

#check-icon-alert{
    color: seagreen;
}

.navbar {
  background-color: #000 !important;
  color: #fff;
}

.navbar a,
.navbar .dropdown-menu a {
  color: #fff;
}

.navbar .dropdown-menu {
  background-color: #333;
  color: #fff;
}

.navbar a:hover,
.navbar .dropdown-menu a:hover {
  color: #333;
  background-color: #fff;
}

.navbar .dropdown-toggle {
  color: #fff;
}

.navbar-toggler {
  color: #fff !important;
}

.navbar-toggler:hover,
.navbar-toggler:active {
  color: #333;
}

.navbar-toggler::before,
.navbar-toggler::after {
  background-color: #fff;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.dropdown-item {
  padding-left: 1rem;
}

.nav-link {
  padding-left: 1rem;
}

.navbar .nav-link:hover {
  border-radius: 0.25rem;
}

.dropdown-menu {
  right: 0;
  left: auto;
}

.dropdown-menu {
    padding: 0.5rem 0;
  margin: 0;
    border: none;
}


/* to make the phone number input fill the column */

.iti {
  width: 100%;
  display: block;
}