/* Index */
#projects .projects .project .index {
    padding-right: 17px;
}
@media only screen and (min-width: 768px) {
    #projects {
        padding-left: 50%;
    }
}
@media only screen and (min-width: 1280px) {
    #projects {
        padding-left: 25%;
    }
}
#projects .credits {
    color: var(--grey);
}
#projects .credits {
    margin-top: 67px;
}

/* View */
#studies .study header,
#project header > .wrapper {
    display: flex;
}
#project header {
    margin-bottom: 7px;
}
#studies .study header .index,
#project header .index {
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    text-transform: uppercase;
    font-family: 'Rauschen-BBook';
    letter-spacing: -0.75px;
    margin-bottom: 6px;
    flex-shrink: 0;
    width: 49px;
    position: relative;
    top: -2px;
}
#studies .study header .name,
#project header .name {
    font-size: var(--title-font-size);
    line-height: var(--title-line-height);
    text-transform: uppercase;
    font-family: 'Rauschen-BBook';
    letter-spacing: -0.75px;
    position: relative;
    top: -2px;
    margin-bottom: 2px
}
#studies .study header .index,
#studies .study header .name {
    top: 0;
    margin-bottom: 2px;
}
#project header .study_link {
    margin-left: 50px;
}
#project .medias li > .wrapper {
    display: flex;
}
#project .medias li.right > .wrapper {
    justify-content: flex-end;
}
#project .medias li img {
    width: 100%;
    display: block;
}
#project .medias li.only_image img {
    margin-bottom: var(--default-spacing);
}
#project .medias li:last-child img {
     margin-bottom: 0 !important;
}
#project .medias li .description {
    padding: 7px 0 47px 0;
}
#project .medias li.epigraph_black .description,
#project .medias li.epigraph .description {
    padding: 12px 0 50px 0;
    font-size: var(--epigraph-font-size);
    line-height: var(--epigraph-line-height);
    color: var(--grey);
}
#project .medias li.epigraph_black .description {
    color: #000;
}
#project .details {
    padding-top: 25px;
}
#project .details ul li {
    display: flex;
}
#project .details ul li strong {
    width: 120px;
    flex-shrink: 0;
    font-weight: normal;
}
#project .details ul li span {
    width: auto
}
#project .studies {
    margin-top: 8px;
}
#project .studies a {
    color: var(--grey);
    display: block;
    margin-top: 16px;
}
#project .studies a:hover {
    color: #000;
}

@media only screen and (min-width: 768px) {
    #project {
        padding-left: 50%;
    }
    #project header {
        margin-bottom: 38px;
    }
}
@media only screen and (min-width: 768px) {
    #project header .index,
    #project header .name {
        top: -2px;
    }
}

@media only screen and (min-width: 1280px) {
    #project {
        padding-left: 25%;
    }
    #project > .wrapper {
        display: flex;
        flex-direction: row-reverse;
    }
    #project header {
        width: 33.33%;
        box-sizing: border-box;
        padding-left: 11px;
    }
    #project .medias {
        width: 66.66%;
    }
    #project .medias li img.medium {
        width: 75%;
    }
    #project .details_container {
        display: flex;
        flex-direction: row-reverse;
    }
    #project .details {
        padding-top: 8px;
        width: 66.66%;
    }
    #project .details ul {
        width: 75%;
    }
    #project .studies {
        width: 33.33%;
        box-sizing: border-box;
        padding-left: 12px;
    }
    
    #projects .credits tbody {
        display: flex;
    }
    #projects .credits tbody tr {
        padding-right: 23px;
    }
}