#watch-page-skeleton {
    position: relative;
    z-index: 1;
    margin: 0 auto;
    box-sizing: border-box
    }
#watch-page-skeleton #info-container, #watch-page-skeleton #related {
    box-sizing: border-box
    }
.watch-skeleton .text-shell {
    height: 20px;
    border-radius: 2px
    }
.watch-skeleton .skeleton-bg-color {
    background-color: hsl(0, 0%, 89%)
    }
.watch-skeleton .skeleton-light-border-bottom {
    border-bottom: 1px solid hsl(0, 0%, 93.3%)
    }
html[dark] .watch-skeleton .skeleton-bg-color {
    background-color: hsl(0, 0%, 16%)
    }
html[dark] .watch-skeleton .skeleton-light-border-bottom {
    border-bottom: 1px solid hsla(0, 100%, 100%, 0.08)
    }
.watch-skeleton .flex-1 {
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    -webkit-flex-basis: 0.0px;
    flex-basis: 0.0px
    }
.watch-skeleton #primary-info {
    height: 64px;
    padding: 20px 0 8px
    }
.watch-skeleton #primary-info #title {
    width: 400px;
    margin-bottom: 12px
    }
.watch-skeleton #primary-info #info {
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-align-items: center;
    align-items: center
    }
.watch-skeleton #primary-info #info #count {
    width: 200px
    }
.watch-skeleton #primary-info #info #menu {
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    padding-right: 8px
    }
.watch-skeleton #primary-info .menu-button {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    margin-left: 20px
    }
.watch-skeleton #secondary-info {
    height: 151px;
    margin-bottom: 24px;
    padding: 16px 0
    }
.watch-skeleton #secondary-info #top-row, .watch-skeleton #secondary-info #top-row #video-owner {
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
    }
.watch-skeleton #secondary-info #top-row #video-owner #channel-icon {
    height: 48px;
    width: 48px;
    border-radius: 50%;
    margin-right: 16px
    }
.watch-skeleton #secondary-info #top-row #video-owner #upload-info {
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -moz-justify-content: center;
    -webkit-justify-content: center;
    justify-content: center
    }
.watch-skeleton #secondary-info #top-row #video-owner #upload-info #owner-name {
    width: 200px;
    margin-bottom: 12px
    }
.watch-skeleton #secondary-info #top-row #video-owner #upload-info #published-date {
    width: 200px
    }
.watch-skeleton #secondary-info #top-row #subscribe-button {
    width: 137px;
    height: 36px;
    border-radius: 2px;
    margin: 7px 4px 0 0
    }
#watch-page-skeleton #related {
    float: right;
    position: relative;
    clear: right;
    max-width: 426px;
    width: calc(100% - 640px)
    }
#watch-page-skeleton.theater #related {
    width: 100%
    }
.watch-skeleton #related .autoplay {
    margin-bottom: 16px
    }
.watch-skeleton #related[playlist] .autoplay {
    border-bottom: none;
    margin-bottom: 0
    }
.watch-skeleton #related #upnext {
    height: 20px;
    width: 120px;
    margin-bottom: 14px
    }
.watch-skeleton #related[playlist] #upnext {
    display: none
    }
.watch-skeleton #related .video-details {
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    padding-bottom: 8px
    }
.watch-skeleton #related:not([playlist]) .autoplay .video-details {
    padding-bottom: 16px
    }
.watch-skeleton #related .video-details .thumbnail {
    height: 94px;
    width: 168px;
    margin-right: 8px
    }
.watch-skeleton #related .video-details .video-title {
    width: 200px;
    margin-bottom: 12px
    }
.watch-skeleton #related .video-details .video-meta {
    width: 120px
    }
@media (max-width: 999px) {
    #watch-page-skeleton {
        width: 854px
        }
    #watch-page-skeleton #container {
        display: -moz-flexbox;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: column;
        flex-direction: column
        }
    #watch-page-skeleton #info-container {
        order: 1
        }
    #watch-page-skeleton #related {
        order: 2;
        width: 100%;
        max-width: 100%
        }
    }
@media (max-width: 856px) {
    #watch-page-skeleton {
        width: 640px
        }
    }
@media (max-width: 656px) {
    #watch-page-skeleton {
        width: 426px
        }
    }
@media (min-width: 882px) {
    #watch-page-skeleton.theater {
        width: 100%;
        max-width: 1706px;
        padding: 0 32px
        }
    #watch-page-skeleton.theater #related {
        margin-top: 0
        }
    #watch-page-skeleton.theater #info-container > * {
        margin-right: 24px
        }
    }
@media (min-width: 1000px) {
    #watch-page-skeleton {
        width: 100%;
        max-width: 1066px
        }
    #watch-page-skeleton #related {
        margin-top: -360px;
        padding-left: 24px
        }
    #watch-page-skeleton #info-container {
        width: 640px
        }
    #watch-page-skeleton.theater #info-container {
        width: 100%;
        padding-right: 426px
        }
    }
@media (min-width: 1294px) and (min-height: 630px) {
    #watch-page-skeleton {
        width: 100%;
        max-width: 1280px
        }
    #watch-page-skeleton #related {
        margin-top: -480px
        }
    #watch-page-skeleton #info-container {
        width: 854px
        }
    }
@media (min-width: 1720px) and (min-height: 980px) {
    #watch-page-skeleton {
        width: 100%;
        max-width: 1706px
        }
    #watch-page-skeleton #related {
        margin-top: -720px
        }
    #watch-page-skeleton #info-container {
        width: 1280px
        }
    }
#watch-page-skeleton.theater.theater-all-widths {
    width: 100%;
    max-width: 1706px;
    padding: 0 32px
    }
#watch-page-skeleton.theater.theater-all-widths #related {
    margin-top: 0
    }
#watch-page-skeleton.theater.theater-all-widths #info-container > * {
    margin-right: 24px
    }
#watch-page-skeleton #related {
    display: none
    }