@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
body { font-family: 'Poppins'; margin: 0; padding: 0; }
.video-bg { height: 100vh; width: 100%; overflow: hidden; display: flex; justify-content: center; align-items: center; position: relative; }
.video-bg video { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100vh; object-fit: cover; }
.effects { position: absolute; object-fit: cover; top: 0; left: 0; z-index: 2; width: 100%; height: 100vh; background-color: rgba(0,0,0,0.6); }
.video-bg__content { z-index: 2; color: #ffffff; font-size: 50px; }

.main { max-width: 1600px; margin: 0 auto; margin-top: 50px; padding: 0 20px; }
body, html { height: 100%; margin: 0; overflow: hidden; }
.video-container { position: relative; height: 100%; width: 100%; overflow: hidden; }
#myVideo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; color: white; font-size: 24px; }