body {
   margin: 0;
   padding: 0;
   outline: none;
   box-sizing: border-box;
   color: white;
}

main {
   min-height: 100%;
   background: transparent;
}

.view {
   padding: 1rem;
}

.view.no-content {
   display: flex;
   align-items: center;
   justify-content: center;
   position: absolute;
   height: 100vh;
   width: 100vw;
   padding: 0;
   background-color: #272A3F;
}

.quote-clip {
   color: #90c5f4;
   text-decoration: none;
}

.quote-clip:hover {
   color: #60acee;
}

.no-quotes {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 400px;
   height: auto;
   background-color: #1D203C;
   color: white;
   padding: 2rem 3rem;
   text-align: center;
   font-size: 1rem;
   font-weight: bold;
   box-shadow: 0 0 9px 0 rgb(0 0 0 / 30%);
}

.cards {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   grid-gap: 2rem;
   margin-top: 1rem;
}

.card-single {
   display: flex;
   justify-content: space-between;
   background: #414566;
   padding: 2rem;
   border-radius: 2px;
}

.card-single div:last-child span {
   font-size: 3rem;
   color: #bcc3ff;
}

.card-single div:first-child span {
   color: #fff;
}

.table-quotes {
   --mdb-table-bg: #2b3057;
   --mdb-table-striped-bg: #414566;
   --mdb-table-striped-color: #fff;
   --mdb-table-active-bg: #2b3057;
   --mdb-table-active-color: #fff;
   --mdb-table-hover-bg: #2b3057;
   --mdb-table-hover-color: #fff;
   color: #fff;
   border-color: #72737a;
}

.page-item.disabled .page-link {
   color: white;
   background-color: #414566;
   border-color: #2b3057;
}

.page-item.disabled {
   cursor: not-allowed;
}

.page-item {
   padding-right: 4px;
}

.page-link {
   background-color: #414566;
   color: white;
}

.page-link:hover {
   background-color: #585858;
   color: white;
}

.page-item.active .page-link {
   background-color: #60679a !important;
}

.page-item.active .page-link {
   background-color: #7b83c1 !important;
}

.empty-row {
   text-align: center;
   font-size: 1rem;
   font-weight: bold;
}

.last {
   padding-right: 0;
}

.custom-select,
.paginate_button {
   cursor: pointer;
}

.form-control {
   color: #ffffff;
   background-color: #414566;
   border: 1px solid #2b3057;
}

.form-control:focus {
   color: #ffffff;
   background-color: #414566;
   border: 1px solid #535eb3;
}

table.dataTable thead th {
   min-width: 180px;
}

#tableRow {
   vertical-align: middle;
}

.dataTables_wrapper {
   margin-top: calc(100px - 1rem);
}

.dataTables_wrapper .row:first-child {
   background: #272a3f;
   position: fixed;
   top: 50px;
   left: 1rem;
   right: 0;
   width: 100%;
   z-index: 1;
   padding-right: 8px;
   height: 50px;
   align-items: center;
}

.table-counter {
   display: flex;
   align-items: center;
   justify-content: center;
   position: fixed;
   width: 100%;
   height: 50px;
   background: #272A3F;
   top: 0;
   right: 0;
   left: 0;
   z-index: 1;
}

@media only screen and (max-width: 960px) {
   .cards {
      grid-template-columns: repeat(3, 1fr);
   }
}

@media only screen and (max-width: 767px) {
   .cards {
      grid-template-columns: repeat(2, 1fr);
   }

   .dataTables_wrapper {
      margin-top: calc(150px - 1rem);
   }
   
   .dataTables_wrapper .row:first-child {
      height: 100px;
   }
}

@media only screen and (max-width: 560px) {
   .cards {
      grid-template-columns: 100%;
   }

   .dataTables_wrapper {
      margin-top: calc(150px - 1rem);
   }
   
   .dataTables_wrapper .row:first-child {
      height: 100px;
   }
}