/***********************************
************************************
    Project Reset
************************************
***********************************/

/*========Project Title=========*/

/* style project year text */
#project-year {
    font-family: 'Sometype Mono', monospace;
    font-weight: 400;
    font-size: 14px;
    line-height: normal;
    color: #000;
}

/* when smaller screen, change the font alignment of project year */
@media screen and (max-width : 768px) {
    #project-year {
        text-align: left;
    }
}

/*========Previous and next project navigator=========*/
#pre-next-project {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000;
    padding-top: 10rem;
}

/*========Deliverables=========*/

#deliverable {
    font-family: 'Sometype Mono', monospace;
    font-weight: 400;
    font-size: 14px;
    color: #000;
    opacity: .6;
    background-color: #fff;
    height: fit-content;
    width: fit-content;
    border-radius: 4px;
    padding: 4px 8px;
    text-transform: uppercase;
    margin-bottom: .5rem;
}

/*========Project Brief=========*/

/* set space below the project brief */
#brief {
    margin-bottom: 3rem;
}

/*========Project Images=========*/

.project-img img {
    width: 100%;
    height: 400px;
    border-radius: 4px;
    object-fit: cover;
    object-position: center;
}

/*========Methods=========*/

#method {
    position: relative;
    text-align: center;
}

/* set method image */
#method img {
    width: 100%;
    border-radius: 4px;
    opacity: .4;
}

/* set method name to float in the center on the image */
.method-name {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* set method name style */
#method-name {
    font-family:'Sometype Mono', monospace;
    font-weight: 400;
    font-size: 14px;
    color: #000;
    opacity: .6;
    padding-top: 1rem;
    text-transform: uppercase;
}

/*========Publication Info Table=========*/

.info-table {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #000;
    border-color: #aaa;
}

/* text float to the right */
#float-r {
    text-align: right;
}

/* align text in the middle vertically */
.table td {
    vertical-align: middle;
}

/* set row height of info table */
.table tr {
    height: 80px;
}

/*========Accordin=========*/

/* remove Bootstrap accordion style */
.accordion {
    --bs-accordion-bg: none;
    --bs-accordion-active-bg: none;
    --bs-accordion-btn-focus-border-color: none;
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-btn-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus" viewBox="0 0 16 16"><path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/></svg>');
    --bs-accordion-btn-active-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-dash" viewBox="0 0 16 16"><path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z"/></svg>');
}

.accordion-body {
    padding: 0;
}

.accordion-button {
    background-color: #e1dfde;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
}

.accordion-button:focus {
    border-color: none;
}

.accordion-button::after {
    background-color: #e1dfde;
}