.atom-video { text-align: left !important; position: relative; }
.atom-video video { max-width: 100%; height: auto; margin: 0 auto; display: block; }

/* VIDEO MODAL MODIFIER */
.atom-video.modal { position: fixed; height: 100%; width: 100%; top: 0; left: 0; background: var( --color-codskin-black ); z-index: 99999999; display: flex; align-items: center; justify-content: center; 
    padding: 20px; opacity: 0; pointer-events: none; transform: scale(0,0); }
.atom-video video { max-height: 100%; max-width: 100%; }

.atom-video.modal.contain { position: absolute; padding: 0; top: 0; right: 0; }
.atom-video.modal.contain .close-holder { top: 0; right: 0; }
.atom-video.modal.contain .close-holder .icon { background: transparent; border-radius: 100px; padding: 6px 7px 6px 6px !important; 
    -webkit-transition: all 300ms ease-out; -moz-transition: all 300ms ease-out; -ms-transition: all 300ms ease-out; -o-transition: all 300ms ease-out; transition: all 300ms ease-out;}
.atom-video.modal.contain:hover .close-holder .icon { background: var( --color-codskin-black );}
.atom-video.modal.contain .close-holder svg { width: 14px; }


.atom-video.modal .close-holder { position: absolute; top: 10px; right: 10px; }
.atom-video.modal.active { opacity: 1; pointer-events: all; transform: scale(1,1); }
.atom-video.modal.active video { }


.atom-video.cover { width: 100%; height: 100%; background: var( --color-codskin-black );  }
.atom-video.cover video { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); 
    min-width: 100%; min-height: 100%; width: auto; height: auto; overflow: hidden; object-fit: cover;  }