/* 
HEADER
*/
#project_p-header {margin-bottom: 4rem;}
#project_p-header > * {grid-column: 1/-1;}

#project_p-back {
    width: fit-content;
    margin-bottom: .5em;
}

/* TITLE */
#project_p-title h3 {vertical-align: top;}
#project_p-team {margin: 2rem 0;}

@media only screen and (min-width: 768px) {
    #project_p-header {margin-bottom: 6rem;}

    #project_p-title {margin-bottom: 1rem;}
    #project_p-team {grid-column: 1/3; margin: 0;}
    #project_p-article {grid-column: 3/-1; margin: 0;}
}

@media only screen and (min-width: 1024px) {
    #project_p-back {grid-column: 1/-1; grid-row: 1;}
    #project_p-title {grid-column: 1/5; grid-row: 2;}
    #project_p-article {grid-column: 5/-1; grid-row: 2/5;}
    #project_p-team {grid-column: 1/5; grid-row: 3;}
}

@media (hover: hover) {
    #project_p-back:hover {
        background: var(--c-blue);
    }
}

/* 
FEED
*/
.project_p-block {row-gap: 1rem;}
#project_p-feed .project_p-block:not(:last-of-type) {margin-bottom: 1rem;}

.project_p-block .project_p-block--container {grid-column: 1/-1;}

@media only screen and (min-width: 768px) {
    #project_p-feed .project_p-block:not(:last-of-type) {margin-bottom: 6rem;}

    .project_p-block.--single .project_p-block--container {
        max-height: 70vh;
        min-height: 70vh;
    }
    .project_p-block.--single .video-block {
        width: fit-content;
        height: 100%;
    }

    .project_p-block.--multiple .project_p-block--container {grid-column: span 2;}
}

@media only screen and (min-width: 1024px) {
    .project_p-block.--single .project_p-block--container {
        min-height: calc(100vh - 8rem) !important;
        max-height: calc(100vh - 8rem) !important;
    }

    .project_p-block.--multiple .project_p-block--container {grid-column: span 4;}
}



/* 
OVERLAY
*/
#project_p-video_overlay {z-index: 205;}
#project_p-video_overlay[data-status='hide'] {transform: translateY(100%);}

#project_p-video_overlay .--close {
    top: 0;
    left: 0;
    z-index: 5;
}

#project_p-video_overlay video {
    max-height: calc(calc(var(--vh) * 100) - 5rem);
}

#project_p-video_overlay .--bottom {
    background: var(--c-blue);
    right: 0;
    bottom: calc(calc(var(--vh) * 100) - 100%);
    left: 0;
}

/* BOTTOM */
#project_p-video_ov--controls {margin-bottom: 1rem;}
#project_p-video_ov--controls .--toggle *:not(:last-child),
#project_p-video_ov--controls .--volume *:not(:last-child) {margin-right: 1rem;}

#project_p-video_ov--controls .--progress {
    width: 100%;
    height: 5px;
    margin: auto 1rem;
    cursor: pointer !important;
}
#project_p-video_ov--controls .--line {
    top: 50%;
    right: 0;
    left: 0;
    height: 2px;
    transform: translateY(-1px);
}
#project_p-video_ov--controls .--realtime {
    top: 0;
    bottom: 0;
    left: 0;
    width: 0;
}

/* Credits */
#project_p-video_ov--credits > button {
    margin-right: 1rem;
    white-space: nowrap;
}

#project_p-video_ov--credits[data-status='hide'] ul {height: 0;}
#project_p-video_ov--credits li:not(:first-of-type) {margin-left: 1rem;}