.rutube-lite {
position: relative !important;
display: block !important;
width: 100% !important;
max-width: 100% !important;
aspect-ratio: 16 / 9 !important;
overflow: hidden !important;
background: #000 !important;
}
.rutube-lite__link {
position: absolute !important;
inset: 0 !important;
display: block !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
text-decoration: none !important;
background: #000 !important;
}
.rutube-lite__poster {
position: absolute !important;
inset: 0 !important;
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
object-fit: cover !important;
}
.rutube-lite__play {
position: absolute !important;
top: 50% !important;
left: 50% !important;
z-index: 2 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 76px !important;
height: 76px !important;
margin: 0 !important;
padding: 0 !important;
border-radius: 50% !important;
background: rgba(0, 0, 0, 0.72) !important;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.28) !important;
transform: translate(-50%, -50%) !important;
transition: transform .18s ease, background-color .18s ease !important;
pointer-events: none !important;
}
.rutube-lite__triangle {
display: block !important;
width: 0 !important;
height: 0 !important;
margin: 0 0 0 6px !important;
padding: 0 !important;
border-top: 13px solid transparent !important;
border-bottom: 13px solid transparent !important;
border-left: 21px solid #fff !important;
}
.rutube-lite__link:hover .rutube-lite__play,
.rutube-lite__link:focus-visible .rutube-lite__play {
background: rgba(0, 0, 0, 0.88) !important;
transform: translate(-50%, -50%) scale(1.06) !important;
}
.rutube-lite__iframe {
position: absolute !important;
inset: 0 !important;
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
background: #000 !important;
}
.rutube-lite__loading {
position: absolute !important;
inset: 0 !important;
z-index: 5 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: rgba(0, 0, 0, 0.48) !important;
color: #fff !important;
font: 600 16px/1.4 Arial, sans-serif !important;
pointer-events: none !important;
}
.rutube-lite__loading::before {
content: "" !important;
width: 22px !important;
height: 22px !important;
margin-right: 10px !important;
border: 3px solid rgba(255,255,255,.35) !important;
border-top-color: #fff !important;
border-radius: 50% !important;
animation: rtlite-spin .8s linear infinite !important;
}
@keyframes rtlite-spin {
to { transform: rotate(360deg); }
}
@media (max-width: 600px) {
.rutube-lite__play {
width: 60px !important;
height: 60px !important;
}
.rutube-lite__triangle {
border-top-width: 10px !important;
border-bottom-width: 10px !important;
border-left-width: 17px !important;
}
}