/* Common styles */
html {
  width: 100%;
}

header {
  background: white
}

.btn {
  outline: none;
  color: black;
  background-color: transparent;
  box-shadow: 0 0 0 0;
  margin-right: 3px;
}

.clearfix {
  margin: 15px;
}

.form {
  margin: 0px;
  padding: 5px;
}

.form input,
.form select,
.form textarea {
  border-radius: 5px;
  border: 1px solid #17a2b8;
  outline: none;
  background: none;
  padding: 5px;
  width: 100%;
  margin-top: 20px;
}

/* App styles */
.title {
  text-align: center;
  margin: 10px;
}


ul {
  height: 100%;
  padding: 0px 5px 0px 20px;
}

a {
  color: #17a2b8;
}


.AllTables {
  border-collapse: collapse;
  width: 100%;
  font-size: 15px;
}

.AllTables tbody,
.AllTables thead {
  display: block;
}



.AllTables td,
.AllTables th {
  border: 1px solid black;
  padding: 6px;
}

/*
.AllTables tr:nth-child(even) {
  background-color: #44A1C2;
}

*/


.AllTables tr:hover {
  background-color: rgb(150, 199, 255);
}

.AllTables th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #44A1C2;
  color: white;
  height: 50 px
}


/* ==================== Sortable */
.sortable th:hover::after {
  color: inherit;
  font-size: 1.2em;
  content: '\00a0\025B8';
}

.sortable th::after {
  font-size: 1.2em;
  color: transparent;
  content: '\00a0\025B8';
}

.sortable th.dir-d::after {
  color: inherit;
  content: '\00a0\025BE';
}

.sortable th.dir-u::after {
  color: inherit;
  content: '\00a0\025B4';
}

th.no-sort {
  pointer-events: none;
}

th.no-sort::after {
  content: none;
}

/* ==================== End Sortable */