.video-grid
{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !Important; 
}

@media(max-width:768px)
  {
.video-grid
    [
    grid-template-columns: repeat(1, minmax(0, 1fr)) !Important;
}
}
@media(max-width:1024px)
  {
.video-grid
    [
    grid-template-columns: repeat(2, minmax(0, 1fr)) !Important;
}
}

.hidden
{
 display:none !Important; 
}


#videoModal
{
  position: fixed; 
top: 0;
right: 0;
bottom: 0;
left: 0; 
z-index: 50; 
justify-content: center; 
align-items: center; 
background-color: #000000; 
--bg-opacity: 0.8; 
}



#videoModal > div
{
 position: relative; 
padding: 1rem; 
width: 100%; 
max-width: 56rem;  
}

#videoModal > div > button
{
 position: absolute; 
right: 0; 
top: -2.5rem; 
font-size: 1.875rem;
line-height: 2.25rem; 
color: #ffffff;  
}

#videoContainer
{
 aspect-ratio: 16 / 9; 
width: 100%;  
}