  body {
        font-family: oswald !important;
        background: #d3d9e1 !important;
    } 
 .text-center {
      text-align: center !important;


      padding: 5px;

   }
  .nav-img {
        float: right;
        font-size: x-large;
        color: white;
        margin-top: 10px;
        margin: 10px;
    }
    .prev:hover,
    .next:hover {
        background-color: rgba(0, 0, 0, 0.8);
    }
    img {
        margin-bottom: -4px;
    }

    .demo {
        opacity: 0.6;
    }

    .active,
    .demo:hover {
        opacity: 1;
    }
    img.hover-shadow {
        transition: 0.3s;
    }
    .hover-shadow:hover {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }
    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 34px;
    }

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }
    .inactive {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .4s;
        transition: .4s;
    }
    .inactive:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }
    .active:checked+.inactive {
        background-color: #2196F3;

    }
    input:focus+.inactive {
        box-shadow: 0 0 1px #2196F3;
    }
    input:checked+.inactive:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }
    /* Rounded sliders */
    .inactive.round {
        border-radius: 34px;
    }

    .inactive.round:before {
        border-radius: 50%;
    }
.active, .flow-button:hover {
  background-color:white !important;
  color: white;
}
.hover_button:hover{
    background-color: white;
}
   .row {
      --bs-gutter-x: 0.5rem !important;
      --bs-gutter-y: 0;
      display: flex;
      flex-wrap: wrap;
      margin-top: calc(-1 * var(--bs-gutter-y));
      margin-right: calc(-.5 * var(--bs-gutter-x));
      margin-left: calc(-.5 * var(--bs-gutter-x));
   }

.table>:not(caption)>*>* {
    padding: 0.5rem 0.5rem;
    background-color: var(--bs-table-bg);
    border-right-width: 1px !important;
    border-bottom-width: 0px !important;
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}
   a {
      color: #212529;
      text-decoration: none;
   }
   
   .pagination a {
      color: black;
      float: left;
      padding: 8px 16px;
      text-decoration: none;
      transition: background-color .3s;
   }
   .pagination a.active {
      background-color: dodgerblue;
      color: white;
   }

   .pagination a:hover:not(.active) {
      background-color: #ddd;
   }

  .updated-my-button {
      font-size: 18px;
      background-color: #336699;
      color: #fff;
      text-align: center;
      font-weight: 300;
      padding: 8px 16px !important;
      transition: 0.3s;
      margin-bottom: 30px !important;
      position: relative;
      text-transform: uppercase;
      border-radius: 6px;
      cursor: pointer;
   }

   .updated-form-title {
      background: #337ab7 !important;
      color: white;
      padding: 0px 10px 15px !important;
      text-transform: uppercase;
   }
   .card-image {
      height: px;
      border-radius: 4px;
      width: 100%;
   }

    .table>:not(caption)>*>* {
        padding: 0.5rem 0.5rem;
        background-color: var(--bs-table-bg);
        border-right-width: 1px !important;
        border-bottom-width: 0px !important;
        box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
    }
    .card-body {
        flex: 1 1 auto;
        padding: 5px 5px 0px 5px;
    }
    /* MODAL FADE LEFT RIGHT BOTTOM */
    .modal.right .modal-dialog {
        position: absolute;
        top: 0;
        right: 0;
        margin: 10px;
    }
    .modal.left .modal-content,
    .modal.right .modal-content {
        min-height: 65vh;
        border: 0;
    }