@import url('https://fonts.googleapis.com/css2?family=Allan:wght@400;700&family=Carattere&family=Ephesis&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Libertinus+Mono&family=Monsieur+La+Doulaise&family=Mozilla+Headline:wght@200..700&family=Quintessential&family=Roboto:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Space+Grotesk:wght@300..700&family=Tangerine:wght@400;700&display=swap');

:root {
    --dobradura-papel: rgba(109, 76, 38, 0.288);
}



#conteudo {
    box-shadow: inset 0px -16px 111px -9px rgba(0, 0, 0, 1);

    .container-monumento {

        display: flex;
        align-items: center;
        justify-content: center;

        padding-block: 120px;
    }
}

#jornal {
    position: relative;

    width: 80%;
    padding: 25px 30px;

    box-shadow: inset 0px 0px 30px 15px rgba(109, 76, 38, 0.623);
    background-color: #DDCDB0;

    &::after {
        content: "";
        z-index: 2;
        position: absolute;
        top: 0;
        left: 0;

        pointer-events: none;

        width: 100%;
        height: 100%;
        background: linear-gradient(#00000000, 50%, var(--dobradura-papel), 51%, #00000000),
            linear-gradient(to right, #00000000, 50%, var(--dobradura-papel), 51%, #00000000);
    }

    h2 {
        width: 100%;
        margin-bottom: 30px;

        color: #543D30;
        font-size: 2.375rem;
        text-align: center;
        font-family: 'Times New Roman', Times, serif;
    }

    .container-data {
        width: 100%;
        text-align: center;
        margin-block: 30px;

        #dataNoticia {
            display: block;
            width: 100%;

            text-transform: uppercase;
            margin-block: 10px;
            min-height: 5px;

            font-weight: 500;
            color: #543D30;
            text-align: center;
            font-size: 0.825rem;
            line-height: 1.125rem;
        }

        &::before,
        &::after {
            content: '';

            display: block;
            width: 100%;
            height: 7px;
            background: #543D30;
            background: linear-gradient(180deg, rgba(84, 61, 48, 1) 10%, rgba(84, 61, 48, 0) 10%, rgba(84, 61, 48, 0) 70%, rgba(84, 61, 48, 1) 70%);
        }
    }

    p {
        margin-top: 25px;

        color: #543D30;
        font-weight: 500;
        text-indent: 60px;
        text-align: justify;
        font-family: 'Times New Roman', Times, serif;

    }

    img {
        float: right;

        width: 100%;
        max-width: 500px;

        height: 100%;
        max-height: 300px;

        margin-left: 20px;

        filter: grayscale(60%) sepia(50%);
    }

    .tape-section {
        position: absolute;
        width: 100%;

        &:first-of-type {
            top: 0;

            &::before {
                transform: rotate(-45deg);
                left: -65px;
            }

            &::after {
                transform: rotate(45deg);
                right: -10px;
                top: -5px;
            }
        }

        &:last-of-type {
            bottom: 0;

            &::after {
                transform: rotate(-45deg);
                right: -7px;
                bottom: -12px;
            }

            &::before {
                transform: rotate(45deg);
                left: -65px;
                bottom: -7px;
            }
        }

        &::before,
        &::after {
            content: "";
            width: 100px;
            height: 40px;
            position: absolute;

            background-color: #dbd8be;
            opacity: 0.5;
            border-right: 1px dotted #b7b49d;
            border-left: 1px dotted #b7b49d;
        }
    }
}

@media (max-width:950px) {
    #jornal {
        padding: 20px 25px;

        h2 {
            margin-bottom: 25px;
            font-size: 2.25rem;
        }

        #dataNoticia {
            font-size: 0.75rem;
            line-height: 1rem;
        }

        img {
            float: inline-start;
            margin: 0 0 10px 0;
        }
    }
}

@media (max-width:800px) {
    #jornal {
        padding: 15px 20px;

        h2 {
            margin-bottom: 20px;
            font-size: 2rem;
        }

        #dataNoticia {
            font-size: 0.625rem;
            line-height: 0.875rem;
        }

        p {
            font-size: 1.25rem;
        }
    }
}

@media (max-width:690px) {
    #jornal {
        width: 90%;
        padding: 10px 15px;
        transform: rotate(0deg);
        box-shadow: inset 0px 0px 15px 7px rgba(109, 76, 38, 0.575);

        h2 {
            margin-bottom: 15px;
            font-size: 1.625rem;
        }

        #dataNoticia {
            font-size: 0.5rem;
            line-height: 0.75rem;
        }

        p {
            font-size: 1.125rem;
        }
    }
}

@media (max-width:576px) {
    #jornal {
        margin-inline: 5px;
        padding: 10px 15px 20px 15px;

        &::after {
            background: linear-gradient(#00000000, 50%, var(--dobradura-papel), 51%, #00000000);
        }

        h2 {
            margin-bottom: 10px;
            font-size: 1.375rem;
        }

        p {
            font-size: 0.875rem;
            line-height: 1.625rem;
        }
    }
}