body{font-size:12px;}

button, input {
    font-size: .9rem;       /* Increase text size */
    padding: 10px 20px;      /* Increase clickable area */
    border-radius: 8px;      /* Rounded corners for a modern look */
    cursor: pointer;         /* Pointer on hover */
    transition: all 0.2s ease; /* Smooth hover effect */
}

/* video tiles container layout */
#videos{display:flex;flex-wrap:wrap;align-items:flex-start}

/* video box: rounded corners, clipping, shadow */
.video-box{
  position:relative;
  display:inline-block;
  margin:8px;
  width:240px;       /* change to taste */
  height:135px;      /* 16:9 (240x135) - change for other aspect */
  border-radius:12px;
  overflow:hidden;    /* important: clip the inner video to rounded corners */
  box-shadow:0 6px 18px rgba(0,0,0,0.35);
  background:#000;
}

/* make the actual <video> fill the box and crop cleanly */
.video-box video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover; /* crop/cover behavior so video always fills box */
}

/* label that sits over the video */
.video-box .label{
  position:absolute;
  bottom:6px;
  left:6px;
  color:#fff;
  background:rgba(0,0,0,0.55);
  font-size:12px;
  padding:3px 6px;
  border-radius:4px;
  z-index:2;
}