.elementor-3763 .elementor-element.elementor-element-6e0d52a{--display:grid;--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-3763 .elementor-element.elementor-element-6e0d52a:not(.elementor-motion-effects-element-type-background), .elementor-3763 .elementor-element.elementor-element-6e0d52a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://mpqua.upsi.edu.my/wp-content/uploads/2024/09/Black-and-Orange-Modern-Small-Business-Expo-Outdoor-Banner-5.png");background-size:cover;}.elementor-3763 .elementor-element.elementor-element-b2bed32{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3763 .elementor-element.elementor-element-495930c{--spacer-size:50px;}.elementor-3763 .elementor-element.elementor-element-5eb862a{--display:flex;}.elementor-3763 .elementor-element.elementor-element-fbf4a3a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-3763 .elementor-element.elementor-element-90bc5ce{--spacer-size:100px;}@media(max-width:1024px){.elementor-3763 .elementor-element.elementor-element-6e0d52a{--grid-auto-flow:row;}}@media(max-width:767px){.elementor-3763 .elementor-element.elementor-element-6e0d52a{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for html, class: .elementor-element-8d9ec9b */#month-name{
    font-size: 5em;
    color: white;
}

#month-desc{
    font-size: 2em;
    color: white;
}

.swiper-slide {
    text-align: center; /* Center text */
    padding: 20px; /* Optional: Add some padding */
}

ul, ol, li, h1, h2, h3, h4, h5, h6, body, html, p {
	margin: 0;
	padding: 0;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-7512e98 */#datatable th, #datatable td {
  padding: 0.5rem; /* Reduce padding inside the table cells */
}

#datatable th {
    background-color: #BA191Cff;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: #BA191Cff;
    color: #fff;
    border: 1px solid #BA191Cff;
}

.button-6 {
  align-items: center;
  background-color: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: .25rem;
  box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0;
  box-sizing: border-box;
  color: rgba(0, 0, 0, 0.85);
  cursor: pointer;
  display: inline-flex;
  font-family: system-ui,-apple-system,system-ui,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 600;
  justify-content: center;
  line-height: 1.25;
  min-height: 2rem;
  position: relative;
  text-decoration: none;
  transition: all 250ms;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: baseline;
  width: auto;
}

.button-6:hover,
.button-6:focus {
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.1) 0 4px 12px;
  color: rgba(0, 0, 0, 0.65);
}

.button-6:hover {
  transform: translateY(-1px);
}

.button-6:active {
  background-color: #F0F0F1;
  border-color: rgba(0, 0, 0, 0.15);
  box-shadow: rgba(0, 0, 0, 0.06) 0 2px 4px;
  color: rgba(0, 0, 0, 0.65);
  transform: translateY(0);
}


#datatable {
    width: 100% !important;
    margin: 0 auto;
    font-size: 0.85rem;
}

/* Make the wrapper a flex container */
.dataTables_wrapper {
    display: flex;
    flex-wrap: wrap; /* Allows items to wrap if they overflow */
    align-items: center; /* Vertically center items */
    justify-content: space-between; /* Space between items */
}

/* Style the length dropdown */
input[type="text"], input[type="file"], input[type="password"], input[type="number"], input[type="search"], input[type="email"], input[type="url"], textarea, select {
    background-color: #f2f2f2;
    border: 1px solid #e6e6e6;
    color: #333333;
    line-height: normal;
    padding: 5px;
    width: 50%;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 8px;
    font-size: 14px;
    width: auto;
    box-sizing: border-box;
    
}

.dataTables_length {
    width:200px;
    margin-right: 20px;
    padding: 5px; /* Padding inside the search box */
    /* Space between the length dropdown and search box */
    
}

/* Style the search box */
.dataTables_filter {
    flex: 1; /* Allow search box to expand to fill remaining space */
    text-align: right; /* Align the search box to the right */
}

/* Style for the search input */
.dataTables_filter input[type="search"] {
    border: 1px solid #ccc; /* Border color */
    border-radius: 4px; /* Rounded corners */
    padding: 8px; /* Padding inside the search box */
    font-size: 14px; /* Font size */
    width: auto; /* Adjust width based on content */
    box-sizing: border-box; /* Include padding and border in width */
}


/* Pagination alignment */
.dataTables_wrapper .dataTables_paginate {
    text-align: center; /* Center-align pagination */
}

/* Optional: Style for pagination buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 8px 12px; /* Add padding */
    margin: 0 2px; /* Space between buttons */
    border: 1px solid #ddd; /* Border color */
    border-radius: 4px; /* Rounded corners */
    background-color: #f9f9f9; /* Background color */
    color: #333; /* Text color */
    font-size: 14px; /* Font size */
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: #eee; /* Background color on hover */
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: #007bff; /* Active button background color */
    color: #fff; /* Active button text color */
    border: 1px solid #007bff; /* Active button border color */
}/* End custom CSS */