#add { display: inline-block; margin-right: 15px !important; /* Optional: Adjust margin if needed */ } body { background-color: transparent !important; } /* Ensure the DataTable wrapper takes the full width */ .dataTables_wrapper { width: 100%; } /* Ensure the DataTable wrapper takes the full width */ .dataTables_wrapper { width: 100%; } /* Style for the custom dropdown */ .custom-dropdown { position: relative; display: inline-block; margin-left: 10px; /* Space between label and dropdown */ } .dropdown-button { background-color: white; color: black; padding: 5px; border: 1px solid black; border-radius: 4px; cursor: pointer; text-align: left; width: 60px; /* Adjust width as needed */ } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 80px; /* Adjust width as needed */ box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); z-index: 1; border: 1px solid #ddd; top: 100%; /* Position below the button */ left: 0; } .dropdown-content a { padding: 10px; text-decoration: none; display: block; color: #333; } .dropdown-content a:hover { background-color: #ddd; } .content-wrapper { background-color: transparent !important; text-align: center; } .wrapper { background-color: transparent !important; } .modal-content { background-color: #fff; } h1 { text-align: center; margin-bottom: 30px; } .table-responsive { width: 95%; overflow-x: none; } .table { width: 100%; } .text-wrap { white-space: normal !important; word-break: break-word; } div.dataTables_wrapper div.dataTables_length select { width: 60px; display: inline-block; } .center-align { padding-top: 20px; display: flex; justify-content: center; align-items: center; width: 100%; } .reduced-width { width: 50%; } th, td { white-space: nowrap; } .select2-container--bootstrap4 { z-index: 1050; /* Higher than the modal's z-index */ } .select2-container--open { z-index: 1060; /* Ensure the dropdown is above the modal */ } th:nth-child(1), td:nth-child(1) { width: 5%; } th:nth-child(2), td:nth-child(2) { width: 20%; } th:nth-child(3), td:nth-child(3) { width: 20%; } th:nth-child(4), td:nth-child(4) { width: 20%; } th:nth-child(5), td:nth-child(5) { width: 10%; } th:nth-child(6), td:nth-child(6) { width: 10%; } th:nth-child(7), td:nth-child(7) { width: 10%; } th:nth-child(8), td:nth-child(8) { width: 10%; } .alert { position: relative; padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; } .alert-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; } .alert-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; } .close2 { position: absolute; bottom: 10px; right: 10px; border: none; background: none; font-size: 16px; cursor: pointer; } aside { margin-top: 100px !important; } .navbar { margin-left: 0px !important; } ul { display: flex !important; row-gap: 20px !important; margin-top: 40px !important; } i { margin-top: 0px !important; margin-right: 10px !important; } @media screen and (max-width:500px) { aside { margin-left: 0px !important; margin-top: 68px !important; } .dataTables_filter { margin-top: 20px !important; } .dataTables_length { overflow: hidden; } }