/* Change colour of header background and shorten height */
.main-header {
    background-color: #A14520;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

/* Change font type of body text and article titles */
body,
.article__title,
.recent-issues__issue-title,
.archived-issue__title {
    font-family: 'Work Sans', sans-serif;
}

.issue__header {
    font-size: 32px;
}

/* Make heading logo smaller for shorter header and reduce padding */
.main-menu__logo img,
.main-menu__title img {
    max-height: 70px;
}

.main-menu__logo,
.main-menu__title {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

/* Make journal name bigger */
.journal-desc h2 {
    font-size: 2rem;
    font-weight: 800;
    text-transform: uppercase;
}

/* Homepage image: full width, cropped (not squished), no white above */
main .row figure {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    margin-top: 0;
    position: relative;
    z-index: 1;
    margin-bottom: 2em;
    height: 20vh;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

main .row figure img.img-fluid {
    width: 100vw;
    min-width: 100vw;
    height: 100%;
    max-height: none;
    object-fit: cover;
    display: block;
    mix-blend-mode: normal !important;
    background: none;
    position: relative;
    z-index: 1;
}

/* Remove hr below the image and everywhere */
main .row header hr,
main .row hr,
hr {
    display: none !important;
}

/* Remove whitespace between header and image */
.main__content {
    margin-top: 0 !important;
}

/* Place issue-galleys, issue-section, and recent-issues inside #A14520 border boxes with spacing */
.issue-galleys,
.issue-section,
.recent-issues {
    border: 3px solid #A14520;
    border-radius: 0.75em;
    padding: 1.5em;
    margin-bottom: 2em;
    background: #fff;
    box-shadow: 0 2px 8px rgba(161,69,32,0.08);
}

.issue-galleys {
    padding-bottom: 3em;
}

/* Add extra spacing between boxes */
.issue-galleys + .issue-section,
.issue-section + .recent-issues,
.issue-galleys + .recent-issues {
    margin-top: 2em;
}

/* Match announcements box to issue section boxes */
.announcement__content_boxed {
    border: 3px solid #A14520;
    border-radius: 0.75em;
    padding: 1.5em;
    margin-bottom: 2em;
    background: #fff;
    box-shadow: 0 2px 8px rgba(161,69,32,0.08);
    margin-top: 3em;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Make carousel slide arrows bigger and #A14520 */
.carousel-control-prev,
.carousel-control-next {
    width: 60px;
    height: 60px;
    top: 50%;
    transform: translateY(-50%);
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    background-color: #A14520;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    background-size: 60% 60%;
    box-shadow: 0 2px 8px rgba(161,69,32,0.15);
    filter: none;
}

/* Style announcements carousel slide controls orange */
[data-slide="next"],
[data-slide="prev"] {
    color: #A14520;
    font-size: 1.5rem;
}

.btn-secondary,
button {
    border: 2px solid #A14520;
    border-radius: 10%;
}

/* Prevent .article__title text from wrapping under the image */
.article__title {
    display: flex;
    align-items: center;
}

.article__title::before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 32px;
    height: 32px;
    margin-right: 0.5em;
    background-image: url('https://unitingchurchstudies.org.au/public/journals/15/pageHeaderLogoImage_en_US.jpg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

/* Align .metadata paragraph with the text of .article__title */
.article__title + .metadata {
    margin-left: calc(32px + 0.75em);
    margin-top: 0.2em;
}

/* Change col-sm-8 and col-sm-4 to 90% and 10% width respectively */
.col-sm-8 {
    width: 90% !important;
    flex: 0 0 90% !important;
    max-width: 90% !important;
}

.col-sm-4 {
    width: 10% !important;
    flex: 0 0 10% !important;
    max-width: 10% !important;
    min-width: 6em;
    box-sizing: border-box;
}

/* Issue section title styling */
.issue-section__title {
    font-weight: 500;
    font-size: 1.5em;
}

/* Responsive: On small screens, align .col-sm-4 right and stack below .col-sm-8 */
@media (max-width: 767px) {
    .col-sm-8,
    .col-sm-4 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        display: block;
    }
    .col-sm-4 {
        text-align: right;
        margin-top: 0.5em;
        margin-bottom: 2em;
    }
}