.video-background-section{position:relative;height:100vh;overflow:hidden;color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column}.background-video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;z-index:0;transform:translate(-50%,-50%);background:url(https://via.placeholder.com/1920x1080) no-repeat;background-size:cover;border-radius:0}.video-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:1}.container{position:relative;z-index:2;width:100%;max-width:1200px;margin:0 auto}.content{padding:20px}.content h2,.content h3{margin:0;padding:10px 0}.content .main-content{margin:20px 0}.btn-wrapper{margin-top:120px}.button{display:flex;justify-content:space-around;align-items:center;padding:.5em 1em;background-color:#fff;color:#ff9800;font-weight:700;cursor:pointer;border:2px solid #FF9800;border-radius:15px;position:relative;overflow:hidden;z-index:100;box-shadow:4px 6px #000;transition:background-color .3s,color .3s,box-shadow .25s,transform .25s,filter 50ms}.button:hover{background-color:#ff9800;color:#fff;transform:translate(2px,2px);box-shadow:2px 3px #000}.button:active{filter:saturate(.75)}.button:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:#ff9800;z-index:-1;transform:translate(-100%);transition:transform .25s}.button:hover:after{transform:translate(0)}.arrowContainer{padding:.5em;margin-left:.5em;border:2px solid #FF9800;border-radius:50%;background-color:#fff;position:relative;overflow:hidden;transition:transform .25s,background-color .25s}.arrowContainer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background-color:#ff9800;transform:translate(-100%);z-index:-1;transition:transform .25s ease-in-out}.button:hover .arrowContainer:after{transform:translate(0)}.button:hover .arrowContainer{transform:translate(5px);background-color:#ff9800}.button:active .arrowContainer{transform:translate(8px)}.arrowContainer svg{fill:#ff9800;vertical-align:middle}.button:hover .arrowContainer svg{fill:#fff}@media (min-width: 768px){.video-background-section{flex-direction:row}.background-video{width:50%;height:100%;border-radius:20px 0 0 20px}.content{width:50%;text-align:left;padding:40px}.video-overlay{width:50%;height:100%;border-radius:20px 0 0 20px}}@media (max-width: 767px){.background-video{border-radius:0}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/video-background-section.css.map */