.tipos-container {
    display: flex;
    height: 300px;
    justify-content: space-evenly;
    margin-bottom: 10%;
}


@media screen and (min-width: 768px) and (max-width: 1024px) {

    .tipos-section {
        width: 90%;
        height: 800px;
        padding: 5%;
        background: linear-gradient(90deg, var(--primary-color), var(--primary-color-dark));
        display: flex;
        flex-direction: column;
        justify-content: space-around;
    }    

    .tipos-container {
        height: fit-content;
    }

    .tipos-box {
        width: 25%;
        margin: 0 auto;
    }

    .icon-title {
        font-size: 20px;
    }

}

@media screen and (min-width: 768px) and (max-width: 1220px) {
    .icon-title {
        font-size: 20px;
    }
}

@media screen and (min-width: 320px) and (max-width: 767px) {

    .about-title {
        height: fit-content;
        font-size: 20px;
    }

    .tipos-section {
        height: fit-content;
    }

    .tipos-container {
        margin-bottom: 10%;
        height: auto;
    }

    .tipos-box {
        width: 60%;
        margin: 0 auto;
        margin-bottom: 10%;
    }

    .tipos-title {
        font-size: 26px;
        margin: 15% 0;
    }

    .tipos-container {
        flex-direction: column;
    }

    .tipo-title {
        font-size: 20px;
    }

}