body > header{
    margin-bottom: 1rem;
}

body > main > header{
    background-color: var(--col-prim);
    padding: 0.6rem 0.8rem;
    border-radius: 6px;
    opacity: 0.85;
}

h1{
    color: white;
    text-align: center;
    margin: 0;
    font-size: 2.2rem;
}

#blogs-cont{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

#blogs-cont .card{
    max-width: 400px;
    margin: 1rem auto;
}

#blogs-cont .card .card-image{
    max-height: 220px;
    overflow: hidden;
}
#blogs-cont .card .card-image img{
    max-width: 100%;
    max-height: 100%;
}

#blogs-cont .card-title{
    color: #FFFFFF;
    text-shadow: 1px 3px 2px #474747;
    padding-bottom: 0.8rem;
}

@media screen and (max-width: 600px){
    #blogs-cont .card{
        max-width: 300px;
    }
    
}