/* html.student-container {
  background: url('../image/literature-3033196_1280.jpg') no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#f0f0f0;
} */

html.admin-container {
  /* background: url('../image/pexels-photo-442574.jpeg') no-repeat center center fixed; */
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-color:#f0f0f0;
}

.is-csc {
  background-color: #353678;
}

.btn-icon-control {
  width: 100%;
  cursor: pointer;
}

.is-loading-box {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: .8;
  background: url('../img/cat.gif') 50% 50% no-repeat rgb(249,249,249);
}

.is-loading-gears-box {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  opacity: .8;
  background: url('../img/gears.gif') 50% 50% no-repeat rgb(249, 249, 249);
}

.cursor-pointer {
  cursor: pointer;
}

.big-list {
  padding: 1em !important;
}

.box-border {
  border: 1px solid #ddd;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}

/* create horizontal table */

.flip-scroll {
  display: block;
  width: 100%;
}

.flip-scroll thead {
  display: block;
  float: left;
}

.flip-scroll thead th,
.flip-scroll tbody td {
  /* line-height: 20px; */
  padding: 0.5em 0.2em;
  text-align: left;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #ddd;
}

.flip-scroll thead th:nth-child(1),
.flip-scroll tbody td:nth-child(1) {
  border-top: 1px solid #ddd;
}

.flip-scroll thead th:nth-child(2n+1),
.flip-scroll tbody td:nth-child(2n+1) {
  background-color: #f4f9ff;
}

.flip-scroll thead th {
  display: block;
  border-bottom: 1px solid #ddd;
  border-right: 1px solid #bbb;
  /* background-color: #ebf6ff; */
  color: #2759a4;
  /* กำหนดให้ th เรียงต่อๆ กันในแนวตั้ง */
}

.flip-scroll tbody {
  display: block;
  overflow-x: auto;
  /* กำหนดให้ tbody สามารถ scroll ได้ในแนวนอน*/
  white-space: nowrap;
}

.flip-scroll tbody tr {
  display: inline-block;
  /* กำหนดให้ tr เรียงต่อๆ กันในแนวนอน */
}

.flip-scroll tbody td {
  display: block;
  /* กำหนดให้ td เรียงต่อๆ กันในแนวตั้ง */
}

.flip-scroll tbody tr:hover {
  background-color: #f4f9ff;
}

.flip-scroll .td-header {
  color: #2759a4;
}