.video-section{position:relative;max-width:100%;margin:0 auto}.section-heading{color:#009ba2;font-family:Libre Baskerville;font-size:36px;font-weight:700;line-height:150%;text-align:center}.video-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));justify-content:center;padding:30px 100px}.video-card{text-align:center;margin-bottom:10px}.video-thumbnail{position:relative;width:100%;height:261px}.video-thumbnail img{width:100%;height:100%;object-fit:cover}.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background:#fff;border-radius:100%;border:none;cursor:pointer;-webkit-mask:url(#triangle-mask);mask:url(#triangle-mask)}.video-title{color:#009ba2;font-size:20px;font-weight:700;padding-top:16px}.video-description{color:#6d6d6d;font-size:12px;text-align:center;padding-left:10px;line-height:17px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.view-more{background-color:#009ba2;color:#fff;padding:10px 20px;border:none;cursor:pointer}.video-popup{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.popup-content{background:#fff;padding:30px;border-radius:10px;text-align:center;position:relative;width:512px}.vdo-content-pop-up{background:#fff;padding:30px;border-radius:10px;width:49%;height:92%;text-align:center;position:relative}.video-frame-container{width:100%;height:59%}.video-frame-container iframe.video-iframe{width:92%;height:127%}span.close-video{cursor:pointer}.close-popup{position:absolute;top:15px;right:20px;cursor:pointer;height:32px;width:32px;color:#009ba2}.popup-title{font-size:36px;font-weight:700;color:#008b8b;margin-bottom:0}.popup-des{color:gray}#video_form{display:flex;flex-direction:column}.field{text-align:left;margin-bottom:24px}.field__label{font-size:14px;color:#6d6d6d;font-weight:500;margin-bottom:5px;display:block}.field__input{width:100%;padding:12px 16px;border:1px solid #ccc;border-radius:5px;font-size:16px;transition:border-color .3s}.field__input:focus{border-color:#008b8b;outline:none}.button{display:flex;justify-content:center;align-items:center;background:#00c2cb;color:#fff;border:none;padding:16px 40px;font-size:16px;font-weight:600;border-radius:25px;cursor:pointer;text-align:center;transition:background .3s}.button:hover{background:#007373}.field{--border: var(--text-a35, var(--text));display:block;width:100%;border:0;border-bottom:none;padding:0;border-radius:0;color:var(--text)}.button-container{display:flex;justify-content:center;text-align:center;width:100%}.view-more,.view-less{display:flex;align-items:center;justify-content:center;gap:8px;width:176px;height:56px;border-radius:75px;border:1px solid #004D51;background:none;color:#004d51;font-size:16px;cursor:pointer;transition:all .3s ease;font-weight:600}.view-more svg,.view-less svg{width:24px;height:15px;transition:transform .3s ease}.view-more:hover,.view-less:hover{background:#004d51;color:#fff}.view-more:hover svg,.view-less:hover svg{stroke:#fff;transform:translate(5px)}.hidden{display:none}@media screen and (max-width: 768px){.section-heading{font-size:28px}.video-title{color:#009ba2;font-size:16px;font-weight:700}.video-container{grid-template-columns:repeat(2,1fr);padding:0 10px}.video-thumbnail{height:168.667px}.play-button{font-size:20px;width:60px;height:60px}.vdo-content-pop-up{width:80%;height:75%;padding:15px}.popup-content{width:85%;padding:15px}.video-frame-container{height:55%}.video-frame-container iframe.video-iframe{height:100%}.button{font-size:12px;padding:15px}.view-more,.view-less{font-size:12px;width:139px;height:50px}}@media screen and (max-width: 480px){.popup-title,.section-heading{font-size:24px}.video-container{grid-template-columns:repeat(2,1fr);gap:10px;padding-top:20px}.field{margin-bottom:16px}.video-thumbnail img{height:168.667px;width:169px}.vdo-content-pop-up,.popup-content{width:90%;height:auto}.video-frame-container{height:50%}.video-frame-container iframe.video-iframe{width:100%;height:100%}.button{font-size:12px;padding:12px 20px;border-radius:50px;width:40%}}
/*# sourceMappingURL=/cdn/shop/t/53/assets/media-of-tea.css.map */
