.floating-button,.search-button,.share-button{transition:background-color .3s}.avatar,.tweet-image,.video-image{object-fit:cover}.play-button,.play-icon{top:50%;left:50%;transform:translate(-50%,-50%)}body{background:#fff;font-family:'Segoe UI',sans-serif;margin:0}.search-container{display:flex;width:100%;border:none;padding:20px 25px 0;text-align:center;margin-top:40px}.search-input{flex:1;padding:15px;font-size:16px;border:2px solid #ddd;outline:0;border-top-left-radius:1.375rem;border-bottom-left-radius:1.375rem}.search-input::placeholder{color:#6c757d}.search-button{background-color:#2c3e50;color:#fff;font-weight:700;padding:10px 20px;border:none;border-top-right-radius:.375rem;border-bottom-right-radius:.375rem;font-size:16px;cursor:pointer}.search-button:hover,.share-button:hover{background-color:#0056b3}.feed{max-width:650px;margin:auto;padding:20px 25px 25px;background-color:#fff;border-bottom:1px solid gray}.tweet{display:flex;gap:14px}.avatar{width:40px;height:40px;border-radius:50%;border:2px solid #1da1f2}.tweet-content{flex:1}a:focus{color:#1da1f2!important}.tweet-header{display:flex;align-items:center;gap:6px;margin-bottom:5px}.tweet-header .name{font-weight:600;font-size:16px;color:#14171a}.tweet-title,h1{font-weight:700;font-size:18px;margin-bottom:6px;color:#0f1419}.tweet-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#657786;overflow:hidden;position:relative;text-overflow:ellipsis;max-height:3.2em}.tweet-description::after{content:" more...";position:absolute;right:0;bottom:0;padding-left:4px;background:#fff;color:#00f;font-weight:700}.tweet-image-wrapper{position:relative;margin-top:6px;margin-bottom:10px;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.1)}.image-time,.play-button,.play-icon{position:absolute}.tweet-image{width:100%;max-height:360px;display:block}.image-time{bottom:10px;right:10px;background:rgba(0,0,0,.65);color:#fff;padding:4px 10px;border-radius:12px;font-size:13px}.play-icon{font-size:42px;color:#fff;opacity:.85}.play-icon:hover{transform:translate(-50%,-50%) scale(1.1)}.tweet-actions{display:flex;justify-content:space-between;margin-top:12px}.tweet-actions button{background:0 0;border:none;color:#657786;font-size:14px;display:flex;align-items:center;gap:6px;cursor:pointer;transition:color .2s}.tweet-actions button:hover{color:#1da1f2}.navbar-header{float:left;margin-top:5px;font-weight:700}.navbar-nav{float:right;margin:0}.navbar-nav>li>a{white-space:nowrap}.navbar .container-fluid::after{content:"";display:table;clear:both}.navbar-inverse .navbar-brand{padding:15px 10px;white-space:nowrap;color:#fff!important;font-weight:600;font-size:22px}.fa-bars{font-size:25px;vertical-align:middle}.navbar-inverse{background-color:#0077a8!important;border-color:#00334d!important;height:50px}.navbar-inverse .navbar-brand:focus,.navbar-inverse .navbar-brand:hover{color:#ddd}.navbar-inverse .navbar-nav>li>a{color:#fff!important;font-weight:500;font-size:16px;padding-top:15px;padding-bottom:15px}.navbar-inverse .navbar-nav>li>a:focus,.navbar-inverse .navbar-nav>li>a:hover{background-color:transparent;color:#ddd!important}.tile-menu{display:flex;flex-wrap:wrap;gap:12px;padding:15px 10px;justify-content:center}.tile-menu .tile{flex:1 1 40%;max-width:140px;background-color:#f7f7f7!important;border-radius:6px;text-align:center;padding:12px 10px;text-decoration:none;color:#333;font-weight:600;box-shadow:0 2px 6px rgb(0 0 0 / .1);transition:.3s;display:flex;align-items:center;justify-content:center;gap:6px}.tile-menu .tile i{font-size:18px;color:#555!important}.tile-menu .tile:hover{background-color:#222!important;color:#fff;box-shadow:0 4px 12px rgb(0 0 0 / .3)}.tile-menu .tile:hover i,.video-volume{color:#fff}.floating-button{position:fixed;bottom:20px;right:20px;background-color:#08c;color:#fff;border:none;border-radius:50%;width:50px;height:50px;display:flex;align-items:center;justify-content:center;font-size:24px;text-decoration:none}.floating-button:hover{background-color:#0077a8}.view-feed{max-width:650px;margin:auto;padding:0 10px 5px;background-color:#fff;border-bottom:1px solid gray}#defalultBtn1,#defalultBtn2,.button{display:inline-block;padding:10px 20px;text-decoration:none}.button{background-color:#337ab7;border:none;text-align:center;font-size:16px;margin:4px 2px;cursor:pointer;border-radius:4px}.share-button,.view-title,h2,h3{font-size:20px}#defalultBtn1{border:1px solid #a62e2f;color:#a62e2f;background-color:#eeeE}#defalultBtn1:focus{border-color:#00f;box-shadow:0 0 5px #00f;outline:0}#defalultBtn2{border:1px solid green;color:green;background-color:#eeeE}#defalultBtn2:focus{border-color:green;box-shadow:0 0 5px green;outline:0}.share-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(40px,1fr));gap:10px}.share-button{display:flex;justify-content:center;align-items:center;height:40px;border:none;border-radius:4px;color:#fff;text-decoration:none;cursor:pointer}.share-button i{margin-right:5px}.copyright{background-color:#0077a8;color:#fff;padding:20px 0}.copyright p{margin:0;text-align:center}.dropdown-menu{background-color:#000}.footer{background-color:#f6f6f1;color:#fff;padding:10px 0;margin-top:20px}.container{padding:0;overflow:hidden}.content-outer{align-items:center;width:auto;max-width:100%;margin:20px auto auto}.main-content{margin-top:50px;padding:5px;margin-bottom:15px;background-color:#fff;border-radius:5px}.view-title{margin:5px;line-height:1.3}.view-description{font-size:16px;margin:6px;line-height:1.5}.popular-post-box{border:1px solid #ddd;margin-bottom:10px;display:flex;align-items:center;border-radius:5px;margin-left:7px;margin-right:3px;box-shadow:0 2px 4px rgba(0,0,0,.1)}.popular-post-image{flex:0 0 100px;max-width:100px;margin-right:10px}.popular-post-image img{width:100%;height:75px;border-radius:5px 0 0 5px}.popular-post-meta{font-size:small;color:#777;margin-top:5px}.popular-post-title{font-size:14px;margin:0}@media (min-width:720px){.main-content,.sidebar{margin-top:30px;max-width:100%;border:1px solid gray}.main-content{margin-right:5px;width:68%;float:left}.sidebar{width:30%;float:right}.popular-post-image{flex:0 0 70px;max-width:70px;margin-right:10px}.popular-post-image img{width:100%;height:50px;border-radius:5px 0 0 5px}.popular-post-title{font-size:13px}.sidebar .popular-post-meta{display:none}}.video-container{position:relative;width:100%;max-width:640px;aspect-ratio:16/9;background-color:#000;overflow:hidden;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1)}.video-image{width:100%;height:100%}.play-button{background:url('/img/play.png') center center/64px 64px no-repeat;width:64px;height:64px;cursor:pointer}.loading-overlay,.video-controls{position:absolute;left:0;width:100%}.video-controls{bottom:0;height:40px;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:space-between;padding:0 10px}.progress-bar{flex-grow:1;height:5px;border-radius:3px;margin:0 10px;cursor:pointer;background:linear-gradient(to right,red 0,red 2%,#ccc 2%,#ccc 10%,#f7f7f7 10%,#f7f7f7 100%)}.video-duration{color:#fff;font-size:14px;padding-left:5px}.loading-overlay{top:0;height:100%;background:rgba(0,0,0,.8);display:none;justify-content:center;align-items:center}.loading-spinner{border:8px solid rgba(255,255,255,.3);border-top:8px solid #fff;border-radius:50%;width:60px;height:60px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}