/* .hidden elements with a .show_child parent are meant to be displayed by
 * mouse hovering on the parent, without javascript intervention */
.show_child>.hidden {
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.2s, opacity 0.2s;
    transition-delay:  0.02s;
}
.show_child:hover>.hidden {
    visibility: visible;
    opacity: 1;
}

.overlay_image {
    position: absolute;
    bottom: 10px;
    right: 7px;
    z-index: 1;
}

.thumbnail_link:hover { text-decoration: none; }
.thumbnail_wrapper { display: inline-block; }
.thumbnail_container {
    position: relative;
    display: inline-block;
}

.video_info {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    min-width: 240px;
}

.video_info.go_right { left: 0; }
.video_info.go_left { right: 0; }

.cover_outer {
    background-color: rgba(0, 0, 0, 0.8);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 3;
    text-align: center;
    overflow: auto;
}

.cover_inner {
    width: 80%;
    margin: 20px auto;
}

.video_frame {
    padding-top: 4px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.cover_inner .video_info {
    margin: 10px auto;
    text-align: left;
    padding: 5px;
}

.cover_inner .buttons_left {
    width: 50%;
    text-align: left;
    display: inline-block;
}
.cover_inner .buttons_right {
    width: 50%;
    text-align: right;
    display: inline-block;
}
.prev_button, .next_button { margin-right: 0.5em; }

.cover_button { font-size: x-large; }

video.loading { visibility: hidden; }
.cover_inner .video_frame.loading {
    background-repeat: no-repeat;
    background-position: center center;
}

.cover_inner .video_info { position: relative; }
.video_info .name { display: inline-block; }
.controls_link { float: right; }
