@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@300&display=swap');

body
{
    font-family: 'Dosis', sans-serif;
    background: linear-gradient(rgba(255, 255, 255, 0.54)-30%, rgba(255, 255, 255, 0.81)), url(../XXXMATERIAISXXX/IMAGENS/cubos-brancos-seamless-design-pattern_1319-68.jpg) ;
}

footer
{
    height: 60px;
}

div
{
    padding-left: 3%;
    padding-right: 3%;
}

h1
{
    font-size: 2.07em;
    text-align: center;
}
h2
{
    font-size: 1.8em;
}
h3
{
    font-size: 1.5em;
}
h4
{
    font-size: 1.2em;
}

p
{
    margin: 1.5%;
}

section
{
    border: 6px outset currentColor ;
    background-color: rgba(255, 255, 255, 0.733);
}

summary
{
    font-size: 1.2em;
    font-weight: 600;
}

.escopoup
{
    margin: 1%;
    padding: .9%;
    box-shadow: gray -4.5px 6px 9px 1.2px ;
}

.grid3
{
    display: grid;
    grid-template-areas:"i1", "i2", "i3" ;
    grid-template-rows: auto;
    grid-template-columns: 33% 33% 33%;
}
.it1 #analisealg
{
    grid-area: i1;
    grid-row: 1/1;
    grid-column: 1/1;
}
.it2 #algoritimoalg
{
    grid-area: i2;
    grid-row: 1/1;
    grid-column:2/2;
}
.it3 #codificaalg
{
    grid-area: i3;
    grid-row: 1/1;
    grid-column:3/3;
}

.grid2
{
    display: grid;
    grid-template-areas: "comp", "inte";
    grid-template-columns: 45% 45%;
    grid-template-rows: auto;
}
.it1g2
{
    grid-area: comp ;
    grid-row: 1/1;
    grid-column: 1/2;
}
.it2g2
{
    grid-area: comp ;
    grid-row: 1/1;
    grid-column: 2/2;
}

.voltar
{
    position: fixed;
    bottom: 3%;
}