.navbar-brand img {
  width: 188px;
}
.icon-register img {
  width: 91px;
}

ul.headerMenu .navbar-text,
ul.headerMenu .search-box input,
ul.headerMenu .input-group-text,
ul.headerMenu .dropdown-item,
.navbar-toggler {
  font-size: 2.1rem;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

.h4Group {
  font-size: 1.1rem;
}

@media screen and (max-width: 1024px) {
  .container,
  .container-fluid,
  .container-xxl,
  .container-xl,
  .container-lg,
  .container-md,
  .container-sm {
    padding-right: var(--bs-gutter-x, 0.25rem);
    padding-left: var(--bs-gutter-x, 0.25rem);
  }

  body {
    line-height: 1.4rem;
  }
  body,
  ul.headerMenu .navbar-text,
  ul.headerMenu .search-box input,
  ul.headerMenu .input-group-text,
  ul.headerMenu .dropdown-item,
  .navbar-toggler {
    font-size: 0.85rem;
  }
  .navbar-brand {
    margin-right: 0;
  }
  .navbar-brand img {
    width: 100px;
  }
  .nav-link {
    margin-right: 0 !important;
  }
  h2,
  .event-banner h2 {
    font-size: 20px;
  }
  h3 {
    font-size: 17px;
  }
  h4 {
    font-size: 15px;
  }
  h5,
  .h5 {
    font-size: 13px;
  }
  .summary {
    padding-top: 0;
  }
  .event-detail h6 .title {
    font-size: 22px;
  }
  .number-of-people {
    font-size: 1.3em;
  }
  .icon-register img {
    width: 50px;
  }

  .btn {
    font-size: 1.2rem;
  }

  .event-root {
    font-size: 0.8rem;
    line-height: 0.8rem;
  }

  .sticky-nav-tab {
    font-size: 0.9rem;
  }

  .h4Group {
    font-size: 0.9rem;
  }

  .title-m20 {
    margin-top: -20px !important;
  }
}

/* v3-home */
.carousel-item {
  min-height: inherit !important;
}

.img-banner {
  max-height: 200px; /*350px;*/
  width: 100%;
}

h5.card-title {
  font-size: 1.15rem;
}

.text-truncate-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* number of lines to show */
  line-height: 1.5em; /* fallback */
  max-height: 3em; /* fallback */
  height: 3em; /* fallback */
  white-space: normal;
}

.carousel-item-title {
  /* min-height: 215px; */
}

.hero-banner {
  border: 2px solid #000000;
}

.btn-newevent {
  margin-top: 0px !important;
  padding: 5px 8px;
  font-size: 14px;
  border-radius: 10px;
  width: 115px;
  height: 40px;
}

.leftSection {
  margin-top: -30px;
}

.showButtonRegister {
  margin-top: -20px;
}

.table-mobile .btn-newevent {
  width: 130px;
  height: 30px;
}

.btn-green {
  background: rgb(121, 167, 10);
}

.btn-green:hover {
  color: #000;
  background: rgb(178, 254, 2);
}

.btn-yellow {
  background: rgb(203, 173, 4);
}

.btn-yellow:hover {
  color: #000;
  background: rgb(255, 217, 0);
}

.btn-gray {
  background: rgb(154, 154, 154);
}

.btn-gray:hover {
  color: #fff;
  background: rgb(112, 112, 112);
}

.btn-newevent.red {
  background: rgb(244, 8, 29);
  background: -webkit-linear-gradient(
    left,
    rgba(244, 8, 29, 1) 0%,
    rgba(143, 8, 8, 1) 48%,
    rgba(104, 34, 33, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(244, 8, 29, 1) 0%,
    rgba(143, 8, 8, 1) 48%,
    rgba(104, 34, 33, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(244, 8, 29, 1) 0%,
    rgba(143, 8, 8, 1) 48%,
    rgba(104, 34, 33, 1) 100%
  );
}

.btn-newevent.yellow {
  background: rgb(203, 173, 4);
  background: -webkit-linear-gradient(
    left,
    rgb(203, 173, 4, 1) 0%,
    rgba(255, 144, 5, 1) 48%,
    rgba(249, 83, 11, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(203, 173, 4, 1) 0%,
    rgba(255, 144, 5, 1) 48%,
    rgba(249, 83, 11, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(203, 173, 4, 1) 0%,
    rgba(255, 144, 5, 1) 48%,
    rgba(249, 83, 11, 1) 100%
  );
}

.btn-newevent.green {
  background: rgb(155, 201, 13);
  background: -webkit-linear-gradient(
    left,
    rgba(155, 201, 13, 1) 0%,
    rgba(121, 167, 10, 1) 48%,
    rgba(89, 125, 5, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(155, 201, 13, 1) 0%,
    rgba(121, 167, 10, 1) 48%,
    rgba(89, 125, 5, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(155, 201, 13, 1) 0%,
    rgba(121, 167, 10, 1) 48%,
    rgba(89, 125, 5, 1) 100%
  );
}

.btn-newevent.blue {
  background: rgb(41, 137, 216);
  background: -webkit-linear-gradient(
    left,
    rgba(41, 137, 216, 1) 0%,
    rgba(30, 87, 153, 1) 48%,
    rgba(14, 61, 114, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(41, 137, 216, 1) 0%,
    rgba(30, 87, 153, 1) 48%,
    rgba(14, 61, 114, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(41, 137, 216, 1) 0%,
    rgba(30, 87, 153, 1) 48%,
    rgba(14, 61, 114, 1) 100%
  );
}

.btn-newevent.gray {
  background: rgb(154, 154, 154);
  background: -webkit-linear-gradient(
    left,
    rgba(154, 154, 154, 1) 0%,
    rgba(112, 112, 112, 1) 48%,
    rgba(69, 69, 69, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(154, 154, 154, 1) 0%,
    rgba(112, 112, 112, 1) 48%,
    rgba(69, 69, 69, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(154, 154, 154, 1) 0%,
    rgba(112, 112, 112, 1) 48%,
    rgba(69, 69, 69, 1) 100%
  );
}

.btn-newevent.sky {
  background: rgb(5, 239, 247);
  background: -webkit-linear-gradient(
    left,
    rgba(5, 239, 247, 1) 0%,
    rgba(8, 127, 143, 1) 48%,
    rgba(1, 64, 72, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(5, 239, 247, 1) 0%,
    rgba(8, 127, 143, 1) 48%,
    rgba(1, 64, 72, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(5, 239, 247, 1) 0%,
    rgba(8, 127, 143, 1) 48%,
    rgba(11, 64, 72, 1) 100%
  );
}

.btn-newevent.orange {
  background: rgb(247, 158, 5);
  background: -webkit-linear-gradient(
    left,
    rgba(247, 158, 5, 1) 0%,
    rgba(143, 84, 8, 1) 48%,
    rgba(100, 58, 2, 1) 100%
  );
  background: -o-linear-gradient(
    left,
    rgba(247, 158, 5, 1) 0%,
    rgba(143, 84, 8, 1) 48%,
    rgba(100, 58, 2, 1) 100%
  );
  background: linear-gradient(
    to right,
    rgba(247, 158, 5, 1) 0%,
    rgba(143, 84, 8, 1) 48%,
    rgba(100, 58, 2, 1) 100%
  );
}

.showMessage {
  min-height: 50px;
  font-size: 1rem;
  margin-top: 5px;
  margin-right: 5px;
}

.showMessage .alert {
  padding: 0.25rem;
}

h3.opened,
.mt-10 {
  margin-top: 10px;
}

.mb-10 {
  margin-bottom: 10px;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 60px;
  width: 60px;
  outline: black;
  background-size: 100%, 100%;
  /* border-radius: 50%; */
  border: 3px solid black;
  background-image: none;
  background-color: white;
}

.carousel-control-next-icon:after {
  content: ">";
  font-size: 60px;
  color: red;
  display: inline-block;
  margin-top: 8px;
}

.carousel-control-prev-icon:after {
  content: "<";
  font-size: 60px;
  color: red;
  display: inline-block;
  margin-top: 8px;
}

.showMessage1 {
  margin: -1rem 10px;
  padding: 0;
  line-height: 1.4;
}
.minHeightAllEvent {
  min-height: 240px;
}

.hidden {
  display: none !important;
}

.lineEvent {
  line-height: 1.4;
  margin-bottom: 0;
}

a.linkTitle {
  text-decoration: none;
  color: #050931;
}

a.linkTitle:hover {
  color: darkblue;
}

a.linkBannerTitle,
.event-promote button a {
  text-decoration: none;
  color: #fff;
}

a.linkBannerTitle:hover,
.event-promote button a:hover {
  color: pink;
}

.card-body1 {
  padding: 0.5rem 1rem;
}
.fixHeight {
  max-height: 105px;
  width: 100%;
}

table.table {
  font-size: 14px;
}
table.table tr.table-active {
  font-size: 16px;
  font-weight: 500;
}

.eventNameLine15 {
  line-height: 1.5;
}

table .btn-newevent {
  font-size: 14px;
}

.dayBox {
  border: 1px solid rgb(244, 8, 29);
  background-color: rgb(244, 8, 29);
  color: #fff;
  padding: 8px;
  font-size: 18px;
}

.dayBoxGray {
  border: 1px solid #888888;
  background-color: #888888;
}
.blockMobile {
  margin-top: 5px;
  margin-bottom: 5px;
}
.blockTxt {
  position: relative;
}

.blockButton {
  position: absolute;
  right: 10px;
}

.calendarTop {
  margin: 10px 5px -50px 0;
}

.calendarTop button {
  width: 120px;
  height: 30px;
}

#myCarousel button {
  width: 100%;
}

.imgCalendar {
  width: 100%;
  height: 325px;
}

/* .carousel-control-prev-icon,
.carousel-control-next-icon {
  margin-top: -90px;
} */

.carousel-control-prev,
.carousel-control-next {
  height: 80%;
}

@media screen and (max-width: 1024px) {
  .imgCalendar {
    width: 80%;
    height: 80%;
    margin: 20px auto 10px;
    display: block;
  }

  /* .carousel-control-prev-icon,
  .carousel-control-next-icon {
    margin-top: -170px;
  } */

  .carousel-control-prev,
  .carousel-control-next {
    height: 50%;
  }

  .carousel-control-prev-icon:after {
    margin-top: 15px;
  }

  .event-promote {
    margin-top: 0;
  }

  #myCarousel .card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* number of lines to show */
    line-height: 1.5em; /* fallback */
    max-height: 3em; /* fallback */
    height: 3em; /* fallback */
    white-space: normal;
  }

  .img-banner {
    max-height: 105px;
  }
}

.pink {
  color: #ee268a;
}

.event-past .title {
  font-size: 22px;
  margin-left: 15px;
  font-weight: 500;
}
.event-past .sub-title {
  font-size: 18px;
  font-weight: normal;
  line-height: 1.4;
  margin-left: 15px;
}

.event-past .detail {
  font-size: 17px;
  line-height: 1.4;
}

.event-past button {
  width: 140px;
}

.event-past .footerText {
  background-color: gray;
  color: #ffffff;
  margin-top: 12px;
  font-size: 20px;
  text-align: center;
}
