section.portfolios {}
section.portfolios h6 {
    color: #000;
    font-family: 'Roboto-Regular';
    font-size: 30px;
    margin: 150px 0 50px 0;
}
section.portfolios .card {
    border: 0px solid #000000;
    border-radius: 0px;
    box-shadow: rgba(0, 0, 0, 0.15) 2.4px 2.4px 3.2px;
    width: 100%;
}
section.portfolios .card a {
    color: #ffffff;
    font-family: 'Roboto-Medium';
    font-size: 14px;
    font-weight: 300;
    letter-spacing: 0.01rem;
}
section.portfolios .card a .card-img {
    border-radius: 0px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    filter: brightness(1);
    transition: filter 1s;
}
section.portfolios .card a:hover .card-img {
    filter: brightness(0.55);
}
section.portfolios .card a .card-img-overlay {
    border-radius: 0px;
    padding: 8px;
    top: 0px;
    /*    top: -62px;*/
}
section.portfolios .card a .card-img-overlay .card-title, section.portfolios .card a .card-img-overlay .card-text {
    color: #ffffff;
    font-family: 'Roboto-Light';
    font-size: 15px;
    font-weight: 500;
    letter-spacing: normal;
    height: 20px;
    line-height: 22px;
    opacity: 0;
    position: relative;
    text-align: center;
    top: 115px;
    transition: opacity 1s;
}
section.portfolios .card a .card-img-overlay .card-title {}
section.portfolios .card a .card-img-overlay .card-text {
    font-family: 'Roboto-Medium';
    font-size: 14px;
}
section.portfolios .card a:hover .card-img-overlay .card-title, section.portfolios .card a:hover .card-img-overlay .card-text {
    opacity: 1;
}
@media (max-width: 1199.98px) {
    section.portfolios h6 {
        font-size: 20px;
        margin: 110px 0 50px 0;
        text-align: center;
    }
}
@media (max-width: 991.98px) {}
@media (max-width: 767.98px) {
    section.portfolios h6 {
        margin: 90px 0 50px 0;
    }
}
@media (max-width: 575.98px) {
    /*.container, .container-sm {
        max-width: 320px;
    }*/
    section.portfolios h6 {
        margin: 70px 0 30px 0;
    }
}