.cortica {
    border-top:    15px solid #370700;
    border-left:   15px solid #370700;
    border-bottom: 15px solid #230500;
    border-right:  15px solid #230500;
    background: #603520 url('/gfx/bg-cortica.jpg') center center;
    color: #fff;

    padding: 2.5% 5%;

    -webkit-clip-path: polygon(
        0% 10px, 10px 10px, 10px 0%,
        calc(100% - 10px) 0%, calc(100% - 10px) 10px, 100% 10px,
        100% calc(100% - 10px), calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) 100%,
        10px 100%, 10px calc(100% - 10px), 0% calc(100% - 10px)
    );
    clip-path: polygon(
        0% 10px, 10px 10px, 10px 0%,
        calc(100% - 10px) 0%, calc(100% - 10px) 10px, 100% 10px,
        100% calc(100% - 10px), calc(100% - 10px) calc(100% - 10px), calc(100% - 10px) 100%,
        10px 100%, 10px calc(100% - 10px), 0% calc(100% - 10px)
    );
    box-shadow: inset 4px 4px 0px rgba(0, 0, 0, 0.2);
    display: block;
    float: left;
    width: 100%;
    margin-bottom: 2em;
}
.cortica > * {
    margin: 2.5% 0;
}
.cortica h1 {
    font-size: calc(14px + 2.2vw);
    font-weight: bold;
}
.cortica .icone-feminista {
    position: relative;
    margin-bottom: -40px;
    margin-left: -10px;
    z-index: 1;
}
.cortica .posters {
    display: none;
}
.cortica .poster {
    padding: 0;
    list-style: none;
    -webkit-clip-path: polygon(20px 0%, calc(100% - 20px) 0%, 100% 20px, 100% calc(100% - 20px), calc(100% - 20px) 100%, 20px 100%, 0% calc(100% - 20px), 0% 20px);
    clip-path: polygon(20px 0%, calc(100% - 20px) 0%, 100% 20px, 100% calc(100% - 20px), calc(100% - 20px) 100%, 20px 100%, 0% calc(100% - 20px), 0% 20px);
    display: flex;
    flex-direction: column;
}
.cortica .poster li {
    background-color: #fdefcd;
    -webkit-clip-path: polygon(15px 0%, calc(100% - 15px) 0%, 100% 15px, 100% calc(100% - 15px), calc(100% - 15px) 100%, 15px 100%, 0% calc(100% - 15px), 0% 15px);
    clip-path: polygon(15px 0%, calc(100% - 15px) 0%, 100% 15px, 100% calc(100% - 15px), calc(100% - 15px) 100%, 15px 100%, 0% calc(100% - 15px), 0% 15px);
    margin: 10px;
    text-align: center;
    line-height: 1.8;
    padding: 1.8em 0 0;
}
.cortica .poster li img {
    object-fit: contain;
    width: 100%;
    max-height: 94vh;
}
.cortica .icone-inscricoes,
.cortica .icone-data,
.cortica address .icone-localidade {
    margin-left: -40px;
    height: 0;
}
.cortica .inscricoes,
.cortica .datas {
    list-style: none;
    padding-left: 40px;
    font-weight: bold;
}
.cortica .inscricoes.columns,
.cortica .datas.columns {
    columns: auto 280px;
}
.cortica .inscricoes > *,
.cortica .datas > * {
    font-size: 1.25em;
    -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
              page-break-inside: avoid; /* Firefox */
                   break-inside: avoid; /* IE 10+ */
}
.cortica .inscricoes .next,
.cortica .datas .next {
    font-size: calc(18px + 1.0vw);
}
.cortica address {
    padding-left: 40px;
    font-size: 1.5em;
    font-style: normal;
    margin-bottom: 1.5em;
}
.cortica address .lugar {
    font-size: 1.0em;
}
.cortica address .localidade {
    font-size: 1.0em;
}
.cortica address .distrito {
    font-size: 1.0em;
}




@supports (display: grid) {
    .cortica {
        grid-column: 1/-1;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(4, auto) 1fr;
        grid-gap: 10px 5%;
        align-items: start;
    }
    .cortica > * {
        grid-column: 2/3;
    }
    .cortica .icone-feminista {
        grid-column: 1/2;
        grid-row: 1/2;
        z-index: 5;
        transform: translateY(-10px);
    }
    .cortica .cartazes {
        grid-column: 1/2;
        grid-row: 1/6;
    }
    .cortica .poster {
        display: grid;
    }
    .cortica .poster li {
        grid-column: 1/2;
        grid-row: 1/2;
        display: grid;
        align-items: end;
    }
    .cortica .posters {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-gap: 10px;
    }
    .cortica .posters > img {
        border-radius: 64px;
        overflow: hidden;
        justify-self: start;
        align-self: start;
        transition: padding ease-out 0.1s;
        box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.2);
    }
    .cortica .posters > img.active {
        padding: 5px;
    }
    .cortica .posters > img:not(.active):hover {
        padding: 2px;
        background-color: #fff;
    }
    .cortica h1 {
        grid-row: 1/2;
    }
    .cortica .hr {
        grid-row: 2/3;
        width: 100%;
        height: 7px;
        box-shadow: 4px 4px 0px rgba(0, 0, 0, 0.2);
    }
    .cortica .inscricoes {
        grid-row: 3/4;
    }
    .cortica .datas {
        grid-row: 4/5;
    }
    .cortica address {
        grid-row: 5/6;
    }

    @media screen and (max-width: 620px) {
        .cortica {
            display: flex;
            flex-direction: column;
        }
        .cortica > * {
            grid-column: 1/2 !important;
            grid-row: initial !important;
        }
        .cortica .hr {
            /*display: none;*/
        }
    }
}




@media screen and (min-width: 1000px) {
    .cortica h1 {
        font-size: calc(14px + 22px);
    }
    .cortica .datas .next {
        font-size: calc(18px + 10px);
    }
}

@media screen and (max-width: 800px) {
    .organizacoes {
        width: 100%;
    }
    .organizacao {
        width: 31%;
        margin: 1%;
    }
}
@media screen and (max-width: 620px) {
    .cortica {
        padding: 3%;
        border: 7px solid #370700;
        -webkit-clip-path: polygon(
            0% 5px, 5px 5px, 5px 0%,
            calc(100% - 5px) 0%, calc(100% - 5px) 5px, 100% 5px,
            100% calc(100% - 5px), calc(100% - 5px) calc(100% - 5px), calc(100% - 5px) 100%,
            5px 100%, 5px calc(100% - 5px), 0% calc(100% - 5px)
        );
        clip-path: polygon(
            0% 5px, 5px 5px, 5px 0%,
            calc(100% - 5px) 0%, calc(100% - 5px) 5px, 100% 5px,
            100% calc(100% - 5px), calc(100% - 5px) calc(100% - 5px), calc(100% - 5px) 100%,
            5px 100%, 5px calc(100% - 5px), 0% calc(100% - 5px)
        );
    }
}


