body {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 400;
  font-style: normal;
  background: url(/assets/img/gray.png);
  background-size: cover;
}
.card-body{
  background: transparent !important;
}



.nav-link{
  color: rgb(255 255 255 / 65%) !important;
  font-size: 18px !important;
}
.nav-link.active{
  color: white !important;
  background: #ffffff3b !important;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}
.bg-head{
  background-color: #15825f !important;
}
.bg-main {
  background-color: #15825f ; /* fallback for old browsers */
  background: -webkit-linear-gradient(
    180deg,
    #15825f,
    #333333
  ); 
  background: linear-gradient(
    180deg,
    #15825f,
    #333333
  );
  color: #ffffff !important;
}
.card-header,
.card {
  border-radius: 0 !important;
}
.w-10 {
  width: 10%;
  max-width: 5px;
}
.w-20 {
  width: 20%;
}
.w-80 {
  width: 80%;
}
.w-70 {
  width: 70%;
}
.font14 {
  font-size: 14px;
}

.inner-webboard .topic-content {
  padding: 10px;
  background: #fff;
  position: relative;
  margin: 0 0 10px 0;
}
.baruser {
  width: 80%;
  height: 1px;
  margin: 10px auto;
  background: #f2f2f2;
  clear: both;
}
.topic-user .avatar {
  float: left;
  width: 170px;
  margin: 0 10px 0 0;
}

.table-custom {
  .table-danger-custom thead {
    --bs-table-bg: rgb(220, 53, 69);
    --bs-table-color: #fff !important;
  }

  th,
  td {
    border: solid white 1px;
  }
  .table {
    font-size: 14px;
    min-width: 800px;
  }
}

.yellowcard {
  background-color: #fdd668;
  color: #9c6c44;
}
.yellowcard,
.redcard {
  padding: 0 2px;
  border-radius: 2px;
  margin: 0 2px;
  width: 18px !important;
  height: 18px !important;
  font-size: 12px !important;
  border: 1px solid #9c6c44;
}

.redcard {
  background-color: #d64444;
  color: #fff;
}
h1 {
  font-size: 26px !important;
}

h2 {
  font-size: 24px !important;
}

h3 {
  font-size: 22px !important;
}
p {
  font-size: 16px !important;
}

.footer .nav-link:hover {
  color: #20c997;
  text-decoration: underline;
}

.inner-webboard img {
  max-width: 100%;
  height: auto !important;
}
.date-col{
    color: #fff;
    font-size: 12px;
    border-radius: 5px;
    font-weight: bold;
   
}
a{
  text-decoration: none !important;
}

.date-col.active{
  background: rgb(33 37 41) !important;
  /* color: rgb(33 37 41) !important; */
  
}
footer .nav-link{
  font-size: 16px !important;
}

@media (max-width:1024px){
  .container{
    max-width: 100% !important;
    padding-right:0px !important;
    padding-left:0px !important;
  }
  .nav-link{
    font-size: 14px !important;
  }
  
}
@media (max-width:550px){
  .date-day .col {
    padding: 2px !important;
  }
}