* {

	margin:0;
	padding:0;

	box-sizing: border-box;
	font-family: sans-serif;
}


body{
 min-height:85vh;
background-color:lab(89.88% 0 1);
display:flexbox;
justify-content:center;
align-items:center;
 margin-top: 30px;
 overflow:inherit;
}


.header1 {
	text-align: center;
	padding:auto;
	color: rgb(13, 4, 109);
}




main.table{
width:80vw;
height:90vh;
background-color:rgba(223, 245, 250, 0.822);
background-filter:blur(7px);
box-shadow: 0 .4rem .8rem rgba(8, 8, 8, 0.333);
border-radius:.9rem;
 padding-bottom: 20px;
 margin-left:10%;
 margin-right:10%;
 margin-bottom:10%;
 overflow:inherit;
  
}

.table_header{
width:100%;
height:5%;
background-color:rgba(102, 111, 235, 0.267);
padding:.8rem 3rem;
overflow:hidden;
border-radius: 0.5rem;
color:rgb(60, 41, 231);
}

.table_body{
width:90%;
max-height:calc(89% - 0.6rem); 
 
background-color:#fffb;
margin:.8rem auto;
border-radius:.6rem; 
overflow:auto;
}

table{
width:100%;
}

.table_body::-webkit-scrollbar{
width:0.5rem;
height:0.5rem;
}

.table_body:: -webkit-scrollbar-thumb{
border-radius:.5rem;
background-color:rgba(150, 102, 214, 0.267);
visibility:hidden; 
 
}

.table_body:hover::-webkit-scrollbar-thumb{
visibility:collapse;
}


table, th, td{
border-collapse:collapse;
padding:1rem;
text-align:left;
}

thead th{
position:flex;
top:0;
left:0;
background-color:#fab8b8fe;
}
tbody tr:nth-child(even) {
background-color:#0000000b;
overflow: auto;
}

 a {
      text-decoration: none;
      color: rgb(8, 8, 8); /* Optional: maintain styling */
    }

    a:hover,
    a:visited,
    a:active {
      text-decoration: none;
    }



@media (max-width: 1000px) {
td:not (:first-of-type) {
min-width:12.1rem;
}
}


.table_header2{
width:100%;
height:5%;
background-color:rgba(79, 216, 250, 0.267);
padding:auto;
 margin-bottom: 10px;
 overflow:auto;
border-radius: 0.1rem;
}

.table_body2{
width:90%;
max-height:calc(89% - 0.6rem); 
 
background-color:#fffb;
margin-bottom:25px;
border-radius:.6rem; 
 
}

.video-container {
  display: flex;
  gap: 20px; /* Space between boxes */
  flex-wrap: wrap; /* Wrap on small screens */
}

.video-box {
  flex: 1 1 200px;
  padding: 20px;
  background-color: #d8f5a3;
  border: 1px solid #ccc;
  text-align: center;
  border-radius: 8px;
  transition: background-color 0.3s;
}

.video-box:hover {
  background-color: #e0e0e0;
}

.video-box a {
  text-decoration: none;
  color: #333;
  font-weight: bold;
}