@media screen and (max-width: 1300px) {

    .navbar,
    .banner__item-container,
    .banner__about-content,
    .banner-introduccion__container,
    .banner-function__container,
    .cases_container,
    .banner-evolution,
    .banner-esquema__cont,
    .banner__info,
    .benefits-section,
    .beneficios-gallery__info,
    .beneficios-gallery,
    .banner-beneficios__container,
    .contact__items {
        margin: 0 5rem;
    }

    .banner-about__img {
        max-width: 100%;
        max-height: 30rem;
        margin: 0 auto;
    }

    .benefits-section {
        padding: 2rem 0;
    }

    .banner__item-info {
        width: 50%;
    }

    .banner__item-info-img {
        width: 30%;
        margin: 0 auto;
    }

    .banner-function__info {
        width: 45%;
    }

    .banner-function__btn {
        width: 80%;
    }

    .banner-evolution__container {
        margin: 5rem 0;
    }

    .banner__title {
        font-size: 5rem;
    }

    .escuelas__beneficios-gallery {
        flex-direction: column;
    }

    .escuelas__beneficios-gallery--inverted {
        flex-direction: column-reverse;
    }


    .beneficios-gallery__info,
    .beneficios-gallery {
        width: calc(100% - 5rem);
    }

    .beneficios-gallery__img {
        width: 40%;
        max-height: 270px;
    }

    .beneficios-gallery__img:nth-child(1) {
        top: 0;
        left: 0;
    }

    .beneficios-gallery__img:nth-child(2) {
        left: 32rem;
        top: 10rem;
    }

    .beneficios-gallery__info,
    .beneficios-gallery {
        position: relative;
        min-height: 50rem;
        align-content: center;
    }

    .banner-img-50 {
        width: 95%;
    }

    .bf_info-monitoreo {
        bottom: -0rem;
    }

    .bg-gray {
        margin-bottom: 5rem;
    }

    .contact__items {
        margin: 0 auto;
    }

    .bf__info-software {
        width: 60%;
        padding: 2rem 3.5rem;
    }

    .testimonios__columnas {
        flex-direction: column;
    }

    .bf__list--software {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1000px) {
    .nav-item__link {
        font-size: 1.5rem;
    }

    .banner__item-info {
        margin: 5rem auto;
        width: 60%;
    }

    .banner__about-text,
    .introduccion__info,
    .banner__tarjet-title,
    .left__info-item,
    .right__info-item,
    .cases__text,
    .banner-evolution__subtitle,
    .banner-evolution__text,
    .left__info-text,
    .banner__text,
    .benefit-text,
    .banner__info-text,
    .banner__info-btn,
    .info-container__text,
    .left__info-item,
    .gallery__info-item,
    .gallery__info-subtitle,
    .banner-function__list-item {
        font-size: 1.5rem;
    }

    .banner__about-btn {
        width: 50%;
    }

    .banner__item-info-img {
        width: 40%;
    }

    .banner-about__container {
        margin: 0 auto;
    }

    .banner-introduccion__tarjet {
        width: 30%;
    }

    .banner-function__info {
        width: 50%;
    }

    .cases__item {
        width: 33%;
    }

    .banner-evolution__title,
    .banner-action__title,
    .banner-action__subtitle,
    .left__info-title,
    .right__info-title,
    .info-container__title,
    .gallery__info-title,
    .banner-beneficios__container-title {
        font-size: 2rem;
    }

    .banner-beneficios__container-title {
        margin: 0 auto;
    }

    .banner__about-title,
    .banner__info-title {
        font-size: 3rem;
    }

    .banner-evolution__container,
    .banner-evolution__container>iframe {
        width: 400px;
        height: 500px;
    }

    .banner-evolution__info {
        width: calc(100% - 450px);
    }

    .text-large,
    .banner-phrase__title {
        font-size: 3rem;
    }

    .benerficios__article-left,
    .benerficios__article-right {
        margin: 0rem 0;
    }

    .article-left__info,
    .article-right__info {
        width: 100%;
    }

    .article-left__cont-img,
    .article-right__cont-img {
        width: 30%;
    }

    .left__info-item,
    .right__info-item {
        font-size: 1.5rem;
        margin: 2rem 1rem;
    }

    .group-icons-left,
    .group-icons-right {
        width: 100%;
        bottom: -6rem;
        left: 0rem;
    }

    .left__info-text {
        margin: 3rem 2rem;
    }

    .group-icons-right {
        bottom: -2rem;
        right: 1rem;
    }

    .top {
        width: 100%;
        bottom: -6.5rem;
        right: 0rem;
    }

    .article-left__img--puertos,
    .article-right__img {
        height: auto;
    }

    .navbar__nav {
        display: none;
    }

    .navbar__mobile-btn {
        display: block;
        z-index: 1;
    }

    .beneficios-desk {
        display: none;
    }

    .beneficios-mobile {
        display: block;
    }

    .beneficios-gallery__info,
    .beneficios-gallery {
        width: 100%;
    }

    .beneficios-gallery__img {
        position: relative;
        width: fit-content;
        max-height: 350px;
        margin: 0 auto;
    }

    .gallery__info-list {
        width: 100%;
        height: auto;
    }

    .gallery__info-item {
        margin: 3rem auto;
    }

    .bc-title {
        font-size: 3rem;
        margin-bottom: 3rem;
    }

    .bf-escuelas {
        width: 65%;
        padding: 3rem;
        top: 3rem;
        bottom: -7rem;
        z-index: 3;
    }

    .bf-empresas {
        width: 65%;
        padding: 3rem;
        top: 3rem;
        bottom: -4rem;
        z-index: 3;
    }

    .bf-industrias {
        width: 65%;
        padding: 3rem;
        top: 3rem;
        bottom: -4rem;
        z-index: 3;
    }

    .contact__items {
        flex-wrap: wrap;
    }

    .contact__item {
        width: calc(50% - 3rem);
    }

    .bf_info-hardware {
        width: 60%;
        top: 2rem;
        bottom: -8rem;
    }

}

@media screen and (max-width: 890px) {

    .banner__about-text,
    .introduccion__info,
    .banner__tarjet-title,
    .left__info-item,
    .right__info-item,
    .banner-function__list-item,
    .cases__text,
    .banner-evolution__subtitle,
    .banner-evolution__text,
    .left__info-text,
    .banner__text,
    .benefit-text,
    .banner__info-text,
    .banner__info-btn,
    .info-container__text,
    .left__info-item--index,
    .right__info-item--index,
    .beneficios__btn {
        font-size: 1.2rem;
    }

    .banner-introduccion__title,
    .cases__title {
        font-size: 2rem;
    }

    .cont--img {
        height: auto;
        width: 65%;
    }

    .cont--texto {
        width: 35%;
    }

    .banner-function__info {
        width: 80%;
    }

    .cases__item {
        height: 190px;
    }

    .bf-escuelas {
        top: 4rem;
        bottom: -6rem;
    }

    .sb_title-escuelas {
        font-size: 2rem;
    }

    .bf-mantenimiento {
        bottom: -15rem;
        width: 40%;
    }

    .bf-usb {
        bottom: -8rem;
        width: 40%;
    }

    .bf-index {
        width: 50%;
        bottom: -10rem;
    }

    .phrase-monitoreo {
        font-size: 2rem;
    }

    tbody td {
        font-size: 1.2rem;
    }

    .bf_info-monitoreo {
        bottom: -5rem;
        padding: 3rem;
    }

    .ventajas__items {
        flex-direction: column;
    }

    .ventaja {
        width: 100%;
    }

    .ventaja-50 {
        width: 100%;
    }

    .ventaja-item__text {
        font-size: 1.5rem;
    }

    .contact-item__text {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 750px) {

    .banner__about-text,
    .introduccion__info,
    .left__info-item,
    .right__info-item,
    .banner-function__list-item,
    .cases__text,
    .banner-evolution__subtitle,
    .banner-evolution__text,
    .left__info-text,
    .banner__text,
    .benefit-text,
    .banner__info-text,
    .banner__info-btn,
    .info-container__text,
    .left__info-item--index,
    .right__info-item--index,
    .beneficios__btn,
    .banner-function__title {
        font-size: 1.7rem;
    }

    .introduccion-img {
        width: 100%;
        height: 100%;
    }

    .banner__tarjet-title {
        font-size: 1.3rem;
    }

    .banner__info {
        flex-direction: column;
    }

    .banner__title {
        margin-top: 5rem;
        font-size: 4rem;
    }

    .banner_info-img {
        width: 85%;
        margin: 5rem auto;
    }

    .content__info-banner {
        width: 100%;
    }

    .banner__about-title,
    .banner__info-title {
        font-size: 3rem;
    }

    .banner-introduccion__title,
    .cases__title {
        font-size: 4rem;
    }

    .banner__about-content,
    .benerficios__article-left,
    .cases__container,
    .banner-evolution,
    .banner__item-container {
        flex-direction: column;
    }

    .banner-introduccion__container,
    .benerficios__article-right {
        flex-direction: column-reverse;
        gap: 0;
    }

    .banner-introduccion__tarjet {
        width: calc(100% - 10rem);
        bottom: 3rem;
    }

    .banner__btn {
        width: 50%;
        margin: 3rem auto;
    }

    .banner__about-info,
    .banner-about__container,
    .banner-introduccion__cont,
    .article-left__info,
    .article-right__info,
    .banner__item-info,
    .banner__item-info-img {
        width: 100%;
    }

    .cont--img {
        margin-top: 0rem;
        margin-bottom: 9rem;
    }

    .article-left__info--index,
    .article-right__info--index {
        width: calc(100% - 5rem);
    }

    .banner__item-info-img {
        margin-top: 5rem;
    }

    .banner__item__img {
        width: 85%;
    }

    .article-right__cont-img,
    .article-left__cont-img {
        width: 100%;
        margin-bottom: 5rem;
    }

    .article-right__img--admi,
    .article-left__img--rendi {
        width: calc(100% - 5rem);
        margin-bottom: 5rem;
    }

    .banner-about__img {
        width: 100%;
        margin: 0 auto;
    }

    .beneficios__btn {
        margin-top: 0;
        margin-bottom: 10rem;
        width: 60%;
    }

    .cases__item {
        width: 100%;
        margin-bottom: 5rem;
        height: 235px;
    }

    .banner-evolution__info {
        width: 100%;
    }

    .banner-function__info {
        width: calc(100% - 3rem);
        bottom: -65px;
        right: 1rem;
        padding: 3.5rem;
        margin-bottom: 7rem;
    }

    .banner-phrase__title {
        font-size: 2rem;
        margin-top: 5rem;
    }

    .banner-evolution__container,
    .banner-evolution__container>iframe {
        width: 250px;
        height: 313px;
    }

    .banner-evolution__container {
        margin: 3rem auto;
    }

    .banner-esquema {
        margin: 0rem auto;
        margin-top: 0rem;
    }

    .ei-hardware {
        width: 100%;
    }

    .group-icons-left,
    .group-icons-right {
        width: 100%;
        bottom: -3.5rem;
        left: 0rem;
    }

    .bf_info-hardware {
        position: absolute;
        width: calc(100% - 5rem);
        height: auto;
        right: 3rem;
        bottom: -31rem;
        padding: 2rem;
    }

    .sub__title--hardware {
        font-family: var(--anton);
        font-size: 1.3rem;
    }

    .banner__text--sub {
        font-family: var(--montserrat);
        font-size: 1.3rem;
    }

    .bf-escuelas {
        top: 9rem;
        bottom: -42rem;
        padding: 2rem;
    }

    .bi-escuelas {
        margin-top: 15rem;
    }

    .bf__info-software {
        bottom: -49rem;
    }

    .bf-industrias {
        width: 95%;
        left: 1rem;
        top: 9rem;
        bottom: -48rem;
        padding: 2rem;
    }

    .tc-software {
        margin-top: 49rem;
    }

    .banner__info-cont {
        width: 100%;
    }

    .testimonio__title {
        margin: 0 auto;
        margin-top: 0rem;
    }

    .testimonios__derecha {
        padding: 0rem;
        margin-top: 0rem;
    }

    .ventajas__items {
        flex-direction: column;
        margin: 5rem auto;
    }

    .testimonio--rg {
        left: 0rem;
    }

    .ventaja {
        width: 100%;
    }

    .benefit-item {
        flex-direction: column;
    }

    .benefit-content {
        align-content: center;
        margin: 0 auto;
    }

    .benefit-icon {
        width: 50%;
        margin: 3rem auto;
    }

    .margin-ct {
        margin-top: -5rem;
    }

    .tabla {
        margin: 0 auto;
    }

    tbody td {
        font-family: var(--montserrat);
        font-size: 1.5rem;
        position: relative;
    }

    .left__info-item--index,
    .right__info-item--index {
        margin: 0rem;
    }

    .bf_info-monitoreo {
        bottom: -30rem;
    }

    .banner-function__container {
        font-size: 1.5rem;
    }

    .banner-function__subtitle,
    .banner-function__list-item {
        font-size: 1.3rem;
    }

    .d-none {
        display: none;
    }

    .cont--img {
        width: 100%;
    }

    .banner-action__title {
        padding: 3rem 0rem;
        font-size: 2rem;
    }

    .esquema__img {
        width: 100%;
        margin: 5rem auto;
    }

    .monitoreo-img {
        width: 90%;
    }

    .bf-index {
        width: 93%;
        margin: 0 auto;
        bottom: -33rem;
    }

    .bf-difusion {
        bottom: -35rem;
    }

    .phrase--index {
        margin-top: 40rem;
    }

    .esquema-hardware {
        margin-top: 25rem;
    }

    .article-left__img,
    .article-right__img,
    .article-left__img--rendi,
    .article-right__img--admi {
        padding: 0rem 5rem;
    }

    .int-monitoreo__img {
        margin: 0 auto;
        margin-top: 20rem;
    }

    .int-industras {
        margin-top: 40rem;
    }

    .int_empresas {
        margin-top: 30rem;
    }

    .int-difusion__img,
    .int_usb {
        margin-top: 30rem;
    }

    .bf-mantenimiento {
        bottom: -35rem;
    }

    .bf-empresas {
        width: 95%;
        padding: 3rem;
        top: 11rem;
        bottom: -41rem;
        z-index: 3;
    }

    .int_mantenimiento {
        margin-top: 25rem;
        width: 60%;
    }

    .int-escuelas {
        margin-top: 15rem;
    }

    .phrase--difusion,
    .phrase--usb {
        margin-top: 0rem;
        margin-bottom: 5rem;
    }

    .ventaja-item__text {
        font-size: 1.8rem;
    }

    /* ---------------Descargas----------------- */

    .banner-info__container {
        width: 100%;
    }

    .banner-info__img--vmatrix {
        margin-top: 10rem;
        width: 30%;
    }

    .banner__info-container__item {
        flex-direction: column;
    }

    .container-info,
    .info-container__img {
        width: 100%;
    }

    /* ------Contacto------------ */
    .contact__item {
        width: calc(100% - 3rem);
    }

    .benefits-column {
        min-width: 20rem;
    }

    .bf-usb {
        bottom: -40rem;
    }

    .content__ficha {
        flex-direction: column;
    }

    .btn__descargar{
        width: 100%;
        margin-top: 5rem;
    }
}