body{
    background: #FFFCF5;
    background: linear-gradient(180deg,rgba(255, 252, 245, 1) 0%, rgba(216, 213, 202, 1) 50%);
}

m3i-home{
    display:block;
    min-height:100vh;
    padding:var(--menubar-height) 0 0 0;
}

m3i-capa{
    display:flex;
    flex-wrap:wrap;
    max-width:768px;
    height:auto;
    min-height:50vh;
    margin:23px auto;
    padding:23px;
    background-color:var(--pallete-white);
    border-radius:13px;
    gap:23px;
}

div.img-main{
    position:relative;
    width:100%;
    height:400px;
    background-repeat:none;
    background-size:cover;
    border-radius:13px;
    cursor:pointer; 
}

h1[capa]{
    width:100%;
    font-family:Trademark;
    --before-color:var(--pallete-2nd);
    color:var(--pallete-black);    
    margin:0 0 46px 0;
    font-weight:4;
}

h1[capa] a{
    font-size:2.0rem;
}

div.img-main h3{
    background-color:var(--pallete-black);
    color:var(--pallete-white);
    margin:13px;
    padding:13px;
    border-radius:13px;
    text-align:right;
    font-size:1.3rem;
}

div.img-main h4{
    position:absolute;
    width:43%;
    bottom:0;
    right:0;
    margin:13px;
    padding:13px;
    border-radius: 13px;
    background-color:var(--pallete-1st);
    color:var(--pallete-black);
    font-size:1.0rem;
}
/*--------------------------------------------------------
ADAPTAR PARA TAMANHO DA TELA
--------------------------------------------------------*/

@media only screen and (max-width:1100px){
    div.img-main h4{
        width:63%;
        font-size:1.3rem;
    }
}

@media only screen and (max-width:300px){
    div.img-main h4{
        width:63%;
        font-size:1.5rem;
    }

    div.img-main h3{
        font-size:1.5rem;
    }
}

@media only screen and (max-width:250px){
    div.img-main h4{
        width:94%;
        margin: 13px 3% 13px 3%;
        font-size:1.8rem;
    }
}