.seccion-modal{
    width: 100%;
    height: 100vh;
    float: left;
    background-color: rgba(0, 0, 0, .9);
    position: fixed;
    top: -150vh;
    left: 0;
    z-index: 1000;
    transition: ease .4s top;
}

.seccion-modal.muestra-modal{
    top: 0vh;
    transition: ease .4s top;
}

.contenedor-general-modal{
    width: 780px;
    height: 570px;
    float: left;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.contenedor-titulo-modal{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
}

.contenedor-titulo-modal h3{
    width: auto;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Anton", sans-serif;
    font-weight: 200;
    font-style: normal;
    color: #FFFFFF;
    font-size: 40px;
}

.btn-cerrar-modal{
    width: 40px;
    height: 40px;
    float: left;
    background-color: transparent;
    border: none;
    outline: none;
    appearance: none;
    margin-top: 8px;
    cursor: pointer;
}

.btn-cerrar-modal img{
    width: 40px;
    height: 40px;
    float: left;
    background-color: transparent;
}

.contenedor-galeria-modal{
    width: 100%;
    height: 500px;
    background-color: transparent;
    float: left;
    position: relative;
    margin-top: 5px;
}

.contenedor-btns-modal{
    width: 100%;
    height: 60px;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.contenedor-btns-modal button{
    width: 60px;
    height: 60px;
    border-radius: 5px;
    background-color: #DB261E;
    float: left;
    position: relative;
    appearance: none;
    border: none;
    outline: none;
    cursor: pointer;
}

.contenedor-btns-modal button img{
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.contenedor-btns-modal button:hover{
    background-color: #060E24;
}

.contenedor-galeria-modal figure{
    width: 100%;
    height: 100%;
    float: left;
    background-color: transparent;
    overflow: hidden;
}

.contenedor-galeria-modal figure img{
    width: 100%;
    height: 100%;
    float: left;
    background-color: transparent;
    object-fit: cover;
    object-position: center;
}





.seccion-proyectos-0{
    width: 100%;
    height: auto;
    float: left;
    background-color: transparent;
    padding-left: 90px;
    padding-right: 90px;
}

.contenedor-general-proyectos-0{
    width: 100%;
    height: 90vh;
    background-color: #060E24;
    float: left;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
}

.construccion-industrial{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/construccion-industrial-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}

.movimiento-de-tierras{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/movimiento-de-tierras-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s; 
}

.pavimentacion{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/pavimentacion-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s; 
}

.urbanizacion{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/urbanizacion-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}

.obras-de-infraestructura{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/obras-de-infraestructura-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}

.instalaciones-electromecanicas{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/instalaciones-electromecanicas-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}

.proyectos-llave-en-mano{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/proyectos-llave-en-mano-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}

.diseno-e-ingenieria-industrial{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url("../assets/diseno-e-ingenieria-de-valor-portada.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: .5;
    transform: scale(1.1);
    transition: ease transform 4s;
}


.img-proyectos-0.escala-portada{
    transform: scale(1);
    transition: ease transform 4s;
}

.contenedor-titulos-proyectos-0{
    width: 1400px;
    height: 320px;
    background-color: transparent;
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    display: inline-flex;
    justify-content: center;
}

.contenedor-tutulo-portada-proyectos-0{
    width: 50%;
    height: auto;
    background-color: transparent;
    float: left;
}

.contenedor-tutulo-portada-proyectos-0 h1{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Anton", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
    font-size: 80px;
    letter-spacing: .5px;
    text-align: right;
}

.contenedor-tutulo-portada-proyectos-0 h2{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Anton", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
    font-size: 40px;
    letter-spacing: .5px;
    text-align: right;
}

.linea-v{
    width: 1px;
    height: 320px;
    float: left;
    background-color: #FFFFFF;
    margin-left: 40px;
    margin-right: 40px;
}

.contenedor-parrafo-portada-proyectos-0{
    width: 50%;
    height: auto;
    background-color: transparent;
    float: left;
}

.contenedor-parrafo-portada-proyectos-0 p{
    width: 100%;
    float: left;
    background-color: transparent;
    font-family: "Commissioner", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #FFFFFF;
    font-size: 18px;
    line-height: 26px;
    margin-top: 18px;
}






.seccion-proyectos-1{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: center;
    padding-top: 120px;
    padding-bottom: 60px;
}

.contenedor-general-proyectos-1{
    width: 1400px;
    height: auto;
    background-color: transparent;
    float: left;
}

.contenedor-titulo-proyectos-1{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
}

.titulos-proyectos-1{
    width: 46%;
    height: auto;
    background-color: transparent;
    float: left;
}

.titulos-proyectos-1 h3{
    width: auto;
    height: auto;
    background-color: #DB261E;
    float: left;
    font-family: "Commissioner", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    color: #FFFFFF;
    font-size: 14px;
    border-radius: 20px;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.titulos-proyectos-1 h2{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Anton", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #060E24;
    font-size: 60px;
    letter-spacing: .5px;
    text-align: left; 
}

.titulos-proyectos-1 p{
    width: 100%;
    float: left;
    background-color: transparent;
    font-family: "Commissioner", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #222021;
    font-size: 18px;
    line-height: 26px;
}

.contenedor-btn-proyectos-1{
    width: 250px;
    height: auto;
    background-color: transparent;
    float: left;
}

.contenedor-btn-proyectos-1 a{
    width: 250px;
    height: 60px;
    background-color: #DB261E;
    float: left;
    display: inline-flex;
    justify-content: center;
    padding: 19px;
    border-radius: 50px;
    text-decoration: none;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 30px;
}

.contenedor-btn-proyectos-1 a .icon-tel{
    width: 25px;
    height: 25px;
    float: left;
    background: url('../assets/icon-tel-b.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 20px;
    margin-top: -1px;
}

.contenedor-btn-proyectos-1 a span{
    width: auto;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Commissioner", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    color: #FFFFFF;
    font-size: 18px;
}

.contenedor-btn-proyectos-1 a:hover{
   background-color: #060E24;
}

.contenedor-btn-proyectos-1 a:hover span{
    color: #FFFFFF;
}

.contenedor-proyectos-proyectos-1{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    margin-top: 40px;
    display: inline-flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.proyectos{
    width: 23%;
    height: auto;
    background-color: #FFFFFF;
    float: left;
    border-radius: 20px;
    padding: 30px;
    padding-top: 40px;
    padding-bottom: 40px;
    margin-bottom: 30px;
    cursor: default;
    transition: background-color ease .2s;
}

.proyectos-oculto{
    visibility: hidden;
}

.proyectos:hover{
    background-color: #DB261E;
    transition: background-color ease .2s;
}

.icono-proyectos{
    width: 60px;
    height: 60px;
    float: left;
    background-color: transparent;
}

.icono-proyectos-ci-1{
    background: url('../assets/icon-diseno-y-planeacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-1{
    background: url('../assets/icon-diseno-y-planeacion-b.svg');
}

.icono-proyectos-ci-2{
    background: url('../assets/icon-costruccion-de-instalaciones-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-2{
    background: url('../assets/icon-costruccion-de-instalaciones-b.svg');
}

.icono-proyectos-ci-3{
    background: url('../assets/icon-renovacion-expansion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-3{
    background: url('../assets/icon-renovacion-expansion-b.svg');
}

.icono-proyectos-ci-4{
    background: url('../assets/icon-gestion-de-proyectos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-4{
    background: url('../assets/icon-gestion-de-proyectos-b.svg');
}

.icono-proyectos-ci-5{
    background: url('../assets/icon-cumplimiento-normativo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-5{
    background: url('../assets/icon-cumplimiento-normativo-b.svg');
}

.icono-proyectos-ci-6{
    background: url('../assets/icon-asesoramiento-tecnico-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ci-6{
    background: url('../assets/icon-asesoramiento-tecnico-b.svg');
}

.icono-proyectos-mdt-1{
    background: url('../assets/icon-excavacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-1{
    background: url('../assets/icon-excavacion-b.svg');
}

.icono-proyectos-mdt-2{
    background: url('../assets/icon-terraplenado-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-2{
    background: url('../assets/icon-terraplenado-b.svg');
}

.icono-proyectos-mdt-3{
    background: url('../assets/icon-demonte-y-acarreo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-3{
    background: url('../assets/icon-demonte-y-acarreo-b.svg');
}

.icono-proyectos-mdt-4{
    background: url('../assets/icon-movimiento-de-relleno-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-4{
    background: url('../assets/icon-movimiento-de-relleno-b.svg');
}

.icono-proyectos-mdt-5{
    background: url('../assets/icon-drenaje-y-control-de-erocion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-5{
    background: url('../assets/icon-drenaje-y-control-de-erocion-b.svg');
}

.icono-proyectos-mdt-6{
    background: url('../assets/icon-gestion-de-residuos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-6{
    background: url('../assets/icon-gestion-de-residuos-b.svg');
}

.icono-proyectos-mdt-7{
    background: url('../assets/icon-asesoramiento-tecnico-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-mdt-7{
    background: url('../assets/icon-asesoramiento-tecnico-b.svg');
}


.icono-proyectos-p-1{
    background: url('../assets/icon-pavimentacion-asfaltica-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-1{
    background: url('../assets/icon-pavimentacion-asfaltica-b.svg');
}

.icono-proyectos-p-2{
    background: url('../assets/icon-pavimentacion-de-concreto-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-2{
    background: url('../assets/icon-pavimentacion-de-concreto-b.svg');
}

.icono-proyectos-p-3{
    background: url('../assets/icon-reavilitacion-de-pavimento-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-3{
    background: url('../assets/icon-reavilitacion-de-pavimento-b.svg');
}

.icono-proyectos-p-4{
    background: url('../assets/icon-drenaje-y-control-de-erocion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-4{
    background: url('../assets/icon-drenaje-y-control-de-erocion-b.svg');
}

.icono-proyectos-p-5{
    background: url('../assets/icon-pavimentacion-permeable-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-5{
    background: url('../assets/icon-pavimentacion-permeable-b.svg');
}

.icono-proyectos-p-6{
    background: url('../assets/icon-diseno-y-planeacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-p-6{
    background: url('../assets/icon-diseno-y-planeacion-b.svg');
}

.icono-proyectos-u-1{
    background: url('../assets/icon-estudio-de-viabilidad-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-1{
    background: url('../assets/icon-estudio-de-viabilidad-b.svg');
}

.icono-proyectos-u-2{
    background: url('../assets/icon-diseno-de-infraestructura-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-2{
    background: url('../assets/icon-diseno-de-infraestructura-b.svg');
}

.icono-proyectos-u-3{
    background: url('../assets/icon-sistema-de-servicios-basicos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-3{
    background: url('../assets/icon-sistema-de-servicios-basicos-b.svg');
}

.icono-proyectos-u-4{
    background: url('../assets/icon-gestion-de-residuos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-4{
    background: url('../assets/icon-gestion-de-residuos-b.svg');
}

.icono-proyectos-u-5{
    background: url('../assets/icon-zonas-de-almacenamiento-manipulacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-5{
    background: url('../assets/icon-zonas-de-almacenamiento-manipulacion-b.svg');
}

.icono-proyectos-u-6{
    background: url('../assets/icon-cumplimiento-normativo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-6{
    background: url('../assets/icon-cumplimiento-normativo-b.svg');
}

.icono-proyectos-u-7{
    background: url('../assets/icon-asesoramiento-tecnico-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-u-7{
    background: url('../assets/icon-asesoramiento-tecnico-b.svg');
}

.icono-proyectos-oi-1{
    background: url('../assets/icon-cnstruccion-de-vias-y-carreteras-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-1{
    background: url('../assets/icon-cnstruccion-de-vias-y-carreteras-b.svg');
}

.icono-proyectos-oi-2{
    background: url('../assets/icon-puentes-y-pasos-a-desnivel-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-2{
    background: url('../assets/icon-puentes-y-pasos-a-desnivel-b.svg');
}

.icono-proyectos-oi-3{
    background: url('../assets/icon-drenaje-y-control-de-erocion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-3{
    background: url('../assets/icon-drenaje-y-control-de-erocion-b.svg');
}

.icono-proyectos-oi-4{
    background: url('../assets/icon-infraestructura-de-servicios-publicos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-4{
    background: url('../assets/icon-infraestructura-de-servicios-publicos-b.svg');
}

.icono-proyectos-oi-5{
    background: url('../assets/icon-edificaciones-publicas-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-5{
    background: url('../assets/icon-edificaciones-publicas-b.svg');
}

.icono-proyectos-oi-6{
    background: url('../assets/icon-cumplimiento-normativo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-oi-6{
    background: url('../assets/icon-cumplimiento-normativo-b.svg');
}

.icono-proyectos-ie-1{
    background: url('../assets/icon-instalaciones-electricas-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-1{
    background: url('../assets/icon-instalaciones-electricas-b.svg');
}

.icono-proyectos-ie-2{
    background: url('../assets/icon-sistemas-de-iluminacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-2{
    background: url('../assets/icon-sistemas-de-iluminacion-b.svg');
}

.icono-proyectos-ie-3{
    background: url('../assets/icon-climatizacion-y-ventilacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-3{
    background: url('../assets/icon-climatizacion-y-ventilacion-b.svg');
}

.icono-proyectos-ie-4{
    background: url('../assets/icon-sistema-de-automatizacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-4{
    background: url('../assets/icon-sistema-de-automatizacion-b.svg');
}

.icono-proyectos-ie-5{
    background: url('../assets/icon-proteccion-contra-incendios-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-5{
    background: url('../assets/icon-proteccion-contra-incendios-b.svg');
}

.icono-proyectos-ie-6{
    background: url('../assets/icon-mantenimiento-y-soporte-tecnico-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-6{
    background: url('../assets/icon-mantenimiento-y-soporte-tecnico-b.svg');
}

.icono-proyectos-ie-7{
    background: url('../assets/icon-cumplimiento-normativo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-ie-7{
    background: url('../assets/icon-cumplimiento-normativo-b.svg');
}

.icono-proyectos-pllm-1{
    background: url('../assets/icon-diseno-y-planeacion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-1{
    background: url('../assets/icon-diseno-y-planeacion-b.svg');
}

.icono-proyectos-pllm-2{
    background: url('../assets/icon-gestion-de-proyectos-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-2{
    background: url('../assets/icon-gestion-de-proyectos-b.svg');
}

.icono-proyectos-pllm-3{
    background: url('../assets/icon-construccion-y-ejecucion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-3{
    background: url('../assets/icon-construccion-y-ejecucion-b.svg');
}

.icono-proyectos-pllm-4{
    background: url('../assets/icon-cumplimiento-normativo-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-4{
    background: url('../assets/icon-cumplimiento-normativo-b.svg');
}

.icono-proyectos-pllm-5{
    background: url('../assets/icon-instalaciones-y-equipamento-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-5{
    background: url('../assets/icon-instalaciones-y-equipamento-b.svg');
}

.icono-proyectos-pllm-6{
    background: url('../assets/icon-control-de-calidad-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-6{
    background: url('../assets/icon-control-de-calidad-b.svg');
}

.icono-proyectos-pllm-7{
    background: url('../assets/icon-entrega-y-portventa-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-pllm-7{
    background: url('../assets/icon-entrega-y-portventa-b.svg');
}

.icono-proyectos-deidv-1{
    background: url('../assets/icon-optimizacion-de-ingenierias-para-el-movimiento-de-tierras-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-deidv-1{
    background: url('../assets/icon-optimizacion-de-ingenierias-para-el-movimiento-de-tierras-b.svg');
}

.icono-proyectos-deidv-2{
    background: url('../assets/icon-reduccion-de-tiempo-en-proyectos-de-construccion-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-deidv-2{
    background: url('../assets/icon-reduccion-de-tiempo-en-proyectos-de-construccion-b.svg');
}

.icono-proyectos-deidv-3{
    background: url('../assets/icon-diseno-de-obras-economicas-y-sostenibles-c.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.proyectos:hover .icono-proyectos-deidv-3{
    background: url('../assets/icon-diseno-de-obras-economicas-y-sostenibles-b.svg');
}

.proyectos h4{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    font-family: "Anton", sans-serif;
    font-weight: 200;
    font-style: normal;
    color: #060E24;
    font-size: 20px;
    letter-spacing: -0px;
    margin-top: 20px;
    transition: color ease .2s;
}

.proyectos:hover h4{
    color: #FFFFFF;
    transition: color ease .2s;
}

.proyectos hr{
    width: 100%;
    height: auto;
    margin-top: 20px;
    margin-bottom: 20px;
    float: left;
    border-color: #EBEBEB;
}

.proyectos p{
    width: 100%;
    float: left;
    background-color: transparent;
    font-family: "Commissioner", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #222021;
    font-size: 14px;
    line-height: 22px;
    transition: color ease .2s;
}

.proyectos:hover p{
    color: #FFFFFF;
    transition: color ease .2s;
}








.seccion-proyectos-2{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: center;
    padding-bottom: 120px;
}

.contenedor-general-proyectos-2{
    width: 1400px;
    height: auto;
    background-color: transparent;
    float: left;
    position: relative;
}

.contenedor-btns-proyectos-2{
    width: 100%;
    height: 60px;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin-top: auto;
    margin-bottom: auto;
}

.contenedor-btns-proyectos-2 button{
    width: 60px;
    height: 60px;
    border-radius: 5px;
    background-color: #060E24;
    float: left;
    position: relative;
    appearance: none;
    border: none;
    outline: none;
    cursor: pointer;
}

.contenedor-btns-proyectos-2 button img{
    width: 30px;
    height: 30px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.contenedor-btns-proyectos-2 button:hover{
    background-color: #DB261E;
}

.contenedor-general-carrusel-proyectos-2{
    width: 100%;
    height: auto;
    background-color: transparent;
    float: left;
    overflow: hidden;
}

.contenedor-carrusel-proyectos-6{
    width: 200%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
}

.contenedor-carrusel-proyectos-7{
    width: 233.33%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
}

.contenedor-carrusel-proyectos-8{
    width: 266.66%;
    height: auto;
    background-color: transparent;
    float: left;
    display: inline-flex;
    justify-content: space-between;
}

.contenedor-img-carrusel-proyectos-2{
    width: 33.33%;
    height: 500px;
    float: left;
    background-color: transparent;
    padding-left: 30px;
    padding-right: 30px;
}

.contenedor-img-carrusel-proyectos-2 figure{
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: transparent;
    border-radius: 20px;
}

.contenedor-img-carrusel-proyectos-2 figure img{
    width: 100%;
    height: 100%;
    float: left;
    background-color: transparent;
    object-fit: cover;
    object-position: center;
}








@media only screen and (max-width: 1780px){
    
    .seccion-proyectos-0{
        padding-left: 90px;
        padding-right: 90px;
    }

    .contenedor-titulos-proyectos-0{
        width: 100%;
        height: 350px;
        padding-left: 70px;
        padding-right: 70px;
        background-color: transparent;
    }

    .linea-v{
        height: 100%;
    }
    
    .contenedor-parrafo-portada-proyectos-0 p{
        margin-top: 18px;
    }




    .seccion-proyectos-1{
        padding-left: 90px;
        padding-right: 90px;
    }

    .contenedor-general-proyectos-1{
        width: 100%;
    }





    .seccion-proyectos-2{
        padding-left: 90px;
        padding-right: 90px;
    }

    .contenedor-general-proyectos-2{
        width: 100%;
    }
}







@media only screen and (max-width: 1580px){
    
    .contenedor-titulos-proyectos-0{
        width: 100%;
        height: 350px;
        padding-left: 70px;
        padding-right: 70px;
        background-color: transparent;
    }

    .contenedor-tutulo-portada-proyectos-0 h2{
        letter-spacing: -1.5px;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        font-size: 16px;
        line-height: 24px;
    }

}







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

    .contenedor-titulos-proyectos-0{
        width: 100%;
        height: 380px;
        padding-left: 50px;
        padding-right: 50px;
        background-color: transparent;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        font-size: 70px;
    }
    
    .contenedor-tutulo-portada-proyectos-0 h2{
        letter-spacing: .5px;
    }

    .linea-v{
        width: 1px;
        height: 100%;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        font-size: 16px;
        margin-top: 15px;
    }





    .titulos-proyectos-1{
        width: 60%;
        height: auto;
        background-color: transparent;
        float: left;
    }

    .proyectos{
        width: 31%;
        height: auto;
    }

    .proyectos-oculto{
        visibility: hidden;
        display: none;
    }





    .contenedor-img-carrusel-proyectos-2{
        padding-left: 20px;
        padding-right: 20px;
    }
}







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

    .seccion-proyectos-0{
        padding-left: 70px;
        padding-right: 70px;
    }

    .contenedor-titulos-proyectos-0{
        height: 320px;
        flex-wrap: wrap;
        background-color:transparent;
    }

    .contenedor-tutulo-portada-proyectos-0{
        width: 100%;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        text-align: center;
    }
    
    .contenedor-tutulo-portada-proyectos-0 h2{
        text-align: center;
    }

    .linea-v{
        display: none;
        visibility: hidden;
    }

    .contenedor-parrafo-portada-proyectos-0{
        width: 100%;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        margin-top: 15px;
        text-align: center;
    }




    .seccion-proyectos-1{
        padding-left: 70px;
        padding-right: 70px;
    }

    .proyectos{
        height: auto;
    }

    .proyectos-oculto{
        visibility: hidden;
        display: none;
    }




    .seccion-proyectos-2{
        padding-left: 70px;
        padding-right: 70px;
    }

    .contenedor-carrusel-proyectos-2{
        width: 300%;
    }

    .contenedor-img-carrusel-proyectos-2{
        width: 50%;
        padding-left: 20px;
        padding-right: 20px;
    }
}









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

    .contenedor-general-modal{
        width: 90%;
        height: 470px;
    }

    .contenedor-galeria-modal{
        height: 400px;
    }





    .seccion-proyectos-0{
        padding-left: 50px;
        padding-right: 50px;
    }

    .contenedor-titulos-proyectos-0{
        padding-left: 30px;
        padding-right: 30px;
        height: 320px;
        flex-wrap: wrap;
        background-color: transparent;
    }

    .contenedor-tutulo-portada-proyectos-0{
        width: 100%;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        text-align: center;
    }
    
    .contenedor-tutulo-portada-proyectos-0 h2{
        text-align: center;
    }

    .linea-v{
        display: none;
        visibility: hidden;
    }

    .contenedor-parrafo-portada-proyectos-0{
        width: 100%;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        margin-top: 15px;
        text-align: center;
    }




    .seccion-proyectos-1{
        padding-left: 50px;
        padding-right: 50px;
    }

    .contenedor-titulo-proyectos-1{
        flex-wrap: wrap;
    }

    .titulos-proyectos-1{
        width: 100%;
    }

    .contenedor-btn-proyectos-1{
        width: 100%;
        margin-top: 20px;
    }

    .contenedor-btn-proyectos-1 a{
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
    }

    .proyectos{
        width: 48%;
        height: auto;
    }

    .proyectos-oculto{
        visibility: hidden;
        display: none;
    }




    .seccion-proyectos-2{
        padding-left: 50px;
        padding-right: 50px;
    }

    .contenedor-carrusel-proyectos-6{
        width: 300%;
    }

    .contenedor-carrusel-proyectos-7{
        width: 350%;
    }

    .contenedor-carrusel-proyectos-8{
        width: 400%;
    }

    .contenedor-img-carrusel-proyectos-2{
        width: 50%;
    }
}










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

    .seccion-proyectos-0{
        padding-left: 30px;
        padding-right: 30px;
    }

    .contenedor-titulos-proyectos-0{
        height: 320px;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        font-size: 60px;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        font-size: 14px;
        line-height: 22px;
        margin-top: 15px;
    }




    .seccion-proyectos-1{
        padding-left: 30px;
        padding-right: 30px;
        padding-top: 90px;
        padding-bottom: 70px;
    }

    .proyectos{
        width: 48%;
        height: auto;
    }

    .proyectos-oculto{
        visibility: hidden;
        display: none;
    }




    .seccion-proyectos-2{
        padding-left: 30px;
        padding-right: 30px;
        padding-bottom: 90px;
    }

    .contenedor-img-carrusel-proyectos-2{
        padding-left: 10px;
        padding-right: 10px;
    }
}










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

    .contenedor-titulo-modal h3{
        font-size: 26px;
    }

    .btn-cerrar-modal{
        width: 30px;
        height: 30px;
        margin-top: 0px;
    }

    .btn-cerrar-modal img{
        width: 30px;
        height: 30px;
    }

    
    
    
    

    .seccion-proyectos-0{
        padding-left: 20px;
        padding-right: 20px;
    }

     .contenedor-general-proyectos-0{
        height: 780px;
    }

    .contenedor-titulos-proyectos-0{
        padding-left: 20px;
        padding-right: 20px;
        height: 450px;
        flex-wrap: wrap;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        font-size: 50px;
    }





    .seccion-proyectos-1{
        padding-left: 20px;
        padding-right: 20px;
    }

    .titulos-proyectos-1 h2{
        font-size: 50px;
    }

    .contenedor-btn-proyectos-1 a{
        width: 225px;
        height: auto;
        padding: 16px;
    }

    .proyectos{
        width: 100%;
        height: auto;
    }

    .proyectos-oculto{
        visibility: hidden;
        display: none;
    }




    .seccion-proyectos-2{
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 0px;
    }

    .contenedor-carrusel-proyectos-6{
        width: 600%;
    }

    .contenedor-carrusel-proyectos-7{
        width: 700%;
    }

    .contenedor-carrusel-proyectos-8{
        width: 800%;
    }

    .contenedor-img-carrusel-proyectos-2{
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}










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

    .seccion-proyectos-0{
        padding-left: 10px;
        padding-right: 10px;
    }

     .contenedor-tutulo-portada-proyectos-0 h1{
        font-size: 45px;
    }





    .titulos-proyectos-1 h2{
        font-size: 45px;
        letter-spacing: -.5px;
    }

    .contenedor-btn-proyectos-1 a{
        width: 215px;
        height: auto;
        padding: 14px;
    }
}











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

    .contenedor-titulo-modal h3{
        font-size: 20px;
    }





    .seccion-proyectos-0{
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 0px;
        padding-bottom: 60px;
    }

    .contenedor-titulos-proyectos-0{
        padding-left: 10px;
        padding-right: 10px;
        height: 350px;
        flex-wrap: wrap;
    }

    .contenedor-tutulo-portada-proyectos-0 h1{
        font-size: 40px;
    }

    .contenedor-tutulo-portada-proyectos-0 h2{
        letter-spacing: -1px;
    }

    .contenedor-parrafo-portada-proyectos-0 p{
        font-size: 12px;
        line-height: 20px;
        margin-top: 15px;
    }




    .seccion-proyectos-1{
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 60px;
        padding-bottom: 40px;
    }

    .titulos-proyectos-1 h3{
       letter-spacing: -.5px;
    }

    .titulos-proyectos-1 h2{
        font-size: 40px;
    }

    .contenedor-btn-proyectos-1 a{
        width: 200px;
        height: auto;
        padding: 12px;
    }






     .seccion-proyectos-2{
        padding-left: 10px;
        padding-right: 10px;
        padding-bottom: 60px;
    }
}