@media only screen and (min-width: 320px) and (max-width: 479px){
    nav.top-right {top: -187px; right: -187px}

    #portada-prn {background: url(../shapes/reciclado-05.jpg) no-repeat left center fixed; -webkit-background-size: fixed; -moz-background-size: fixed; -o-background-size: fixed; background-size: fixed;}
    #portada-01 .izq-box-01{padding-bottom: 10vh; padding-top: 12vh;}
    .down-green {bottom: 2vh; right: 10px; background-color: #ff6a13; display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 38px; border-radius: 50px; margin-top: 30px; transition: .3s; -webkit-transition: .3s; position: fixed; font-size: 14px;}
    .home-green {right: 55px; bottom: 2vh; background-color: #78be20; display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 37px; border-radius: 50px; margin-top: 30px; transition: .3s; -webkit-transition: .3s; position: fixed; font-size: 14px;} 
    .back-azul {background-color: #1c75bc; display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 39px; border-radius: 50px; margin-top: 30px; transition: .3s; -webkit-transition: .3s;  position: fixed; right: 100px; bottom: 2vh; font-size: 14px;}
    .go-prev-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}

    .pc-item{display: block;}
    .pc-item-02{display: none;}
    .mb-item{display: none;}
    h1{font-size: 30px;}
    h2{font-size: 28px;}
    .nro-item-a, .nro-item-o {width: 100%; max-width: 75px;}
    .mb-tit{margin-top: 30vh;}
    .mb-pad{padding-left: 8%; padding-right: 8%;}
    
    .circle-02, .circle-03, .circle-04, .circle-05, .circle-06{display: none;}

    #portada-prn-2 {background: url(../shapes/back-portada-colbun-mb.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

    .mb-tit h1 {font-size: 35px;}

    .go-report-mb{background-color: #00afd7; display: inline-block; height: 50px; width: 50px; text-align: center; line-height: 48px; border-radius: 50px; font-size: 24px; transition: .3s; -webkit-transition: .3s;}
    .go-report-mb:hover{box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); -ms-transform: translateY(-3px); -webkit-transform: translateY(-3px); transform: translateY(-3px); background-color: #245095;}
    .go-report-mb svg{color: #ffffff;}

    .cap-azul-mb img, .cap-verde-mb img, .cap-naranjo-mb img, .cap-blue-mb img, .cap-green-mb img, .cap-orange-mb img{width: 45px;}
    .cap-azul-mb p, .cap-verde-mb p, .cap-naranjo-mb p, .cap-blue-mb p, .cap-green-mb p, .cap-orange-mb p, .cap-yellow-mb p, .cap-amarillo-mb p{padding-left: 15px; color: #ffffff; font-family: Variable; font-weight: 900; font-size: 12px; margin-bottom: 0;}
    .cap-azul-mb > a > div, .cap-verde-mb > a > div, .cap-naranjo-mb > a > div, .cap-blue-mb > a > div, .cap-green-mb > a > div, .cap-orange-mb > a > div, .cap-yellow-mb > a > div, .cap-amarillo-mb > a > div{padding: 15px;}

    .cap-azul-mb{background-color: #245095; padding: 0px 15px;}
    .cap-verde-mb{background-color: #008c44; padding: 0px 15px;}
    .cap-naranjo-mb{background-color: #f16122; padding: 0px 15px;}
    .cap-blue-mb{background-color: #00b7de; padding: 0px 15px;}
    .cap-green-mb{background-color: #50b848; padding: 0px 15px;}
    .cap-orange-mb{background-color: #f78d31; padding: 0px 15px;}
    .cap-yellow-mb{background-color: #ffc72c; padding: 0px 15px;}
    .cap-amarillo-mb{background-color: #ffa300; padding: 0px 15px;}

    .pad-top-tb{margin-top: 5vh; margin-bottom: 10vh;}

    .tit-01, .tit-02, .tit-03, .tit-04, .tit-05, .tit-06 {width: 100%; max-width: 110px; margin-bottom: 20px;}
    .tit-cap-port {font-size: 20px; line-height: 25px;}
    .subtit-cap-port {margin-top: 30px; color: #ffffff; width: 85%; font-family: Hind Guntur; font-size: 13px;}
    .tuerca-01 {display: none;}
    .conector-01 {display: none;}
    .waves-02 {display: none;}
    .waves-01 {display: none;}
    .peces-01 {display: none;}

    .bajada-sub p {width: 100%; font-family: Variable; font-size: 18px;}
    .ruta-energetica {position: absolute; width: 100px; right: 12vw; top: 7vh;}
    .eficiencia-energetica {width: 100%; max-width: 100px; position: absolute; top: 21vh; right: 0px;}
    .seia-vec{display: none;}
    .ley-flexibilidad-vec{display: none;}
    .antena-electrica{display: none;}
    .wave-gris {width: 100%; max-width: 100px; position: absolute; right: 0; top: -7vh;}
    .peru-crecimiento{display: none;}
    .shorty-01 {width: 100%;}
    .tipo-clientes-contratos > tbody > tr > th, .tipo-clientes-contratos > tbody > tr > td {padding: 10px; font-size: 14px; border: 1px solid #bfbfbf;}

    .btn-ghost {background-color: rgba(124, 124, 124, 0.6); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px; }
    .graph-energia-peru {width: 100%; max-width: 240px; margin-bottom: 20px;}
    .graph-generacion-energia {width: 100%; max-width: 240px; margin-bottom: 20px;}
    .circ-viviana {width: 100%; max-width: 150px; margin-top: 30vh; margin-bottom: 30vh;}
    .ministerio-energia {width: 100%; max-width: 120px; padding-right: 15px;}
    .next-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .next-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .go-prev-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}

    .mundo-ventas, .eco-square, .molino-desarrollo, .dispon-centrales, .conector-gener, .generacion-peru, .his-libro, .his-flecha, .his-sol, .his-conector, .his-gota, .his-mundo, .tuercas-proposito, .profile-circle, .fabrica-humo, .conver-per, .graph-finan-conso, .profile-politica, .clic-estrella, .people-arrow, .rayo-generacion{display: none;}
    .fuentes-renovables {width: 100%; max-width: 100px;}
    .francisco-camus {width: 100%; max-width: 200px; position: initial; left: unset; top: unset; padding-top: 25vh; padding-bottom: 25vh; margin-left: -15px;}
    .manos-01 {width: 100%; max-width: 130px; margin-top: 20px;}
    .nota-comite {width: 100%; max-width: 120px;}
    .complekp-nehuenco-qui {width: 100%; max-width: 200px; position: relative; right: 0; top: unset; padding-top: 25vh; padding-bottom: 25vh; margin-right: -15px; padding-right: 0; float: right;}
    ..sello-colbun{margin-bottom: 30px;}
    .estragia-creci {width: 100%; max-width: 120px;}
    .contribucion-ods {width: 100%; max-width: 120px; margin-top: 20px;}
    .fabrica-eco {width: 100%;  max-width: 120px;}
    .plan-integridad{margin-bottom: 20px;}
    .mujer-reciclaje, .lapiz-reciclaje {width: 100%; max-width: 95px;}
    .next-o {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .cursos-flechas {width: 100%; max-width: 100px;}
    #transformacion-digital-colbun { background: url(../shapes/cap02/transformacion-digital-colbun.jpg) no-repeat left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 20vh; padding-bottom: 20vh;}
    .ampolleta-encendida {width: 100%; max-width: 120px; margin-bottom: 20px;}
    .chispas-03{display: none;}
    .proyector-svg{display: none;}
    .prev-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s;  font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-o {background-color: rgba(246, 139, 49, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .go-prev-o {background-color: rgba(246, 139, 49, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .tb-evol{margin-bottom: 30px;}
    .billet-icon {width: 100%; max-width: 100px;}
    .tb-financieras {width: 100%; max-width: 350px; margin-bottom: 30px;}
    .razon-deuda {width: 100%; max-width: 100px;}
    .circ-vista-cordillera {width: 100%; max-width: 180px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .tortas-generacion {margin-top: 20px;}
    .circ-central-angostura {width: 100%; max-width: 150px; position: initial; right: unset; bottom: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .img-dispon {margin-bottom: 20px;}
    .dispon-por-central {margin-bottom: 80px;}
    .personas-cultura {width: 100%;  max-width: 120px;}
    .denuncia-circs {width: 100%; max-width: 200px; margin-bottom: 20px;}
    .circ-san-clemente {width: 100%; max-width: 180px; position: initial; right: unset;  bottom: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .gorra-vigilantes {width: 100%; max-width: 100px;}
    .corrupcion {width: 100%; max-width: 100px;}
    .next-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .casa-hoja, .bicicleta-04, .voluntariado, .equidad-genero-01, .mano-like, .empresas-proveedoras, .dialogo-cta-publica{display: none;}

    .prev-o {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}

    .go-prev-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .manos-04, .constructor-04, .alerta-04{display: none;}
    .salario-mujeres {margin-bottom: 20px;}
    .canal-comunicacion {margin-bottom: 20px;}
    .bread-div{text-align: left !important;}
    .monto-compras {width: 100%; max-width: 100px;}
    .repro-achile {width: 100%;  max-width: 120px;}
    .casco-seguridad {width: 100%; max-width: 120px;}
    .segur-ocupacional {margin-bottom: 20px;}
    .curso-conduccion {width: 100%; max-width: 120px;}
    .manzana {width: 100%; max-width: 120px;}
    .hitos-seguridad {width: 100%; max-width: 150px; margin-bottom: 20px;}
    .temas-segur-com {margin-bottom: 20px;}
    .obrero-gestion {width: 100%; max-width: 120px; margin-bottom: 30px;}
    .mejor-calidad-vida {width: 100%; max-width: 100px; float: right;}
    .canal-comu-cdad {margin-bottom: 20px;}
    .circ-entorno-central {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .ciudadania, .lago-chapo{display: none;}
    .generando-futuro {width: 100%; max-width: 120px;}
    #relacionamiento-comun {padding-top: 20vh; padding-bottom: 20vh;}
    .next-v {background-color: rgba(0, 140, 68, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px;  margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .centro-historico {width: 100%; max-width: 120px;}
    .juntas-vecino {width: 100%; max-width: 120px; margin-bottom: 20px;}
    .circ-entorno-canutillar {width: 100%; max-width: 150px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .circ-bahia-coronel {width: 100%; max-width: 150px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}

    .gota-05, .sol-05, .nube-04, .arbolitos-05, .viento, .gota-iniciativas, .represa-centrales, .gestion-del-agua{display: none;}
    .prev-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px;  transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-v {background-color: rgba(80, 184, 72, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .embalse-angostura {width: 100%; max-width: 150px; position: initial; left: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .reutilizacion-agua-01 {width: 100%; max-width: 120px;}
    .centrales-hidroelectricas {margin-bottom: 20px;}
    .consuma-agua-total {width: 100%; max-width: 120px;}
    .agua-potable {width: 100%; max-width: 120px;}

    .go-prev-v {background-color: rgba(80, 184, 72, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .consumo-diesel {width: 100%; max-width: 90px;}
    .emision-gases {width: 100%; max-width: 120px; margin-top: 50px;}
    .huella-carbono {width: 100%; max-width: 120px;}
    #zorro-silvestre {background: url(../shapes/cap05/zorro-silvestre.jpg) no-repeat right center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;  background-size: cover; padding-top: 20vh; padding-bottom: 20vh;}
    .circ-martin-pescador {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset;  padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .tb-total-emisiones-gei {padding-bottom: 30px;}
    .emisiones-gei {width: 100%; max-width: 120px;}
    .circ-entorno-lago-chapo {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .emisiones-atmosfericas {margin-bottom: 20px;}
    .viento-ico, .pajarito-biodiversidad{display: none;}

    .flor-manzano {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 30vh; padding-bottom: 30vh; float: right; margin-right: -15px;}
    .next-n {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    #biodiversidad {padding-top: 20vh; padding-bottom: 20vh;}
    .colmena {width: 100%; max-width: 120px;}
    .constructor-06, .rayo-06, .nube-04, .industria-06, .ampolleta-06{display: none;}
    .prev-v {background-color: rgba(0, 140, 68, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff;  position: fixed; bottom: 2vh; left: 10px;}
    .circ-depuradora-agua {width: 100%; max-width: 180px; position: initial; right: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-central-biobio {width: 100%; max-width: 180px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .colbun-corp {width: 100%; max-width: 200px; padding-top: 25vh; padding-bottom: 25vh;}
    .btn-ghost-next {background-color: rgba(124, 124, 124, 0.6); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; position: fixed; bottom: 2vh; left: 55px;}
    .aguas-01, .aguas-03{display: none;}
    .margen-ebitda {width: 100%; max-width: 250px; padding-top: 30px;}

    .comillas-presidente-gris, .comillas-presidente-verdes{display: none;}    
    .flecha-carta, .gota-carta, .flecha-032{display: none;}
    .circ-embalse-guardia {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .helice-carta {width: 100%; max-width: 100px;}
    #regul-trans-energetica {padding-top: 20vh; padding-bottom: 20vh;}
    .mundo-carta {width: 100%; max-width: 100px;}
    #reconocimiento-back {background: url(../shapes/reconocimientos-back-2.jpg) no-repeat center top fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .crecio-economia-peru, .crecio-demanda-peru{display: none;}
    .circ-complejo-termo-valpo {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-embalse-colbun-maule {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .circ-proyecto-reciclaje {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .circ-cerntro-monitoreo{width: 100%; max-width: 180px; position: initial; bottom: unset; left: unset; padding-bottom: 20vh; padding-top: 20vh; margin-left: -15px;}
    .circ-central-clemente-maule{width: 100%; max-width: 180px; position: initial; bottom: unset; left: unset; padding-bottom: 20vh; padding-top: 20vh; margin-right: -15px; float: right;}
    .movil-cap-nro{width: 100%; max-width: 140px; margin-bottom: 10px;}
    .movil-box{padding-top: 15vh; padding-bottom: 15vh; padding-left: 8%;}
    #portada-01 {background: url(../shapes/cap01/movil-01-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-02 {background: url(../shapes/cap02/movil-02-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-03 {background: url(../shapes/cap03/movil-03-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-04 {background: url(../shapes/cap04/movil-04-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-05 {background: url(../shapes/cap05/movil-05-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-06 {background: url(../shapes/cap06/movil-06-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .fecha-circ {width: 100%; max-width: 150px; margin-bottom: 20px}
}

@media only screen and (min-width: 480px) and (max-width: 767px){
    nav.top-right {top: -187px; right: -187px}

    .pc-item{display: block;}
    .pc-item-02{display: none;}
    .mb-item{display: none;}
    h1{font-size: 30px;}
    h2{font-size: 28px;}
    .nro-item-a, .nro-item-o {width: 100%; max-width: 75px;}
    .mb-tit{margin-top: 33vh;}
    .mb-pad{padding-left: 8%; padding-right: 8%;}

    #portada-prn-2 {background: url(../shapes/back-portada-colbun-mb.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

    .mb-tit h1 {font-size: 35px;}

    .go-report-mb{background-color: #00afd7; display: inline-block; height: 50px; width: 50px; text-align: center; line-height: 50px; border-radius: 50px; font-size: 18px; transition: .3s; -webkit-transition: .3s;}
    .go-report-mb:hover{box-shadow: 0px 10px 10px 0px rgba(0, 0, 0, 0.1); -ms-transform: translateY(-3px); -webkit-transform: translateY(-3px); transform: translateY(-3px); background-color: #245095;}
    .go-report-mb svg{color: #ffffff;}

    .cap-azul-mb img, .cap-verde-mb img, .cap-naranjo-mb img, .cap-blue-mb img, .cap-green-mb img, .cap-orange-mb img{width: 60px;}
    .cap-azul-mb p, .cap-verde-mb p, .cap-naranjo-mb p, .cap-blue-mb p, .cap-green-mb p, .cap-orange-mb p, .cap-yellow-mb p, .cap-amarillo-mb p{padding-left: 15px; color: #ffffff; font-family: Variable; font-weight: bold; font-size: 13px; margin-bottom: 0;}
    .cap-azul-mb > a > div, .cap-verde-mb > a > div, .cap-naranjo-mb > a > div, .cap-blue-mb > a > div, .cap-green-mb > a > div, .cap-orange-mb > a > div, .cap-yellow-mb > a > div, .cap-amarillo-mb > a > div{padding: 15px;}

    .cap-azul-mb{background-color: #245095; padding: 0px 15px;}
    .cap-verde-mb{background-color: #008c44; padding: 0px 15px;}
    .cap-naranjo-mb{background-color: #f16122; padding: 0px 15px;}
    .cap-blue-mb{background-color: #00b7de; padding: 0px 15px;}
    .cap-green-mb{background-color: #50b848; padding: 0px 15px;}
    .cap-orange-mb{background-color: #f78d31; padding: 0px 15px;}
    .cap-yellow-mb{background-color: #ffc72c; padding: 0px 15px;}
    .cap-amarillo-mb{background-color: #ffa300; padding: 0px 15px;}

    .pad-top-tb{margin-top: 10vh; margin-bottom: 10vh;}

    .tit-01, .tit-02, .tit-03, .tit-04, .tit-05, .tit-06 {width: 100%; max-width: 150px; margin-bottom: 20px;}
    .tit-cap-port {font-size: 26px; line-height: 28px;}
    .subtit-cap-port {margin-top: 30px; color: #ffffff; width: 85%; font-family: Hind Guntur;}
    .tuerca-01 {display: none;}
    .conector-01 {display: none;}
    .waves-02 {display: none;}
    .waves-01 {width: 100%; max-width: 120px; position: absolute; bottom: 0; left: -2vw; z-index: -1;}
    .peces-01 {width: 100%; max-width: 200px; position: absolute; right: 80px;}

    .bajada-sub p {width: 100%; font-family: Variable; font-size: 18px;}
    .ruta-energetica {position: absolute; width: 100px; right: 12vw; top: 7vh;}
    .eficiencia-energetica {width: 100%; max-width: 100px; position: absolute; top: 21vh; right: 0px;}
    .seia-vec, .flecha-032{display: none;}
    .ley-flexibilidad-vec{display: none;}
    .antena-electrica{display: none;}
    .wave-gris {width: 100%; max-width: 100px; position: absolute; right: 0; top: -7vh;}
    .peru-crecimiento{display: none;}
    .shorty-01 {width: 100%;}
    .tipo-clientes-contratos > tbody > tr > th, .tipo-clientes-contratos > tbody > tr > td {padding: 10px; font-size: 14px; border: 1px solid #bfbfbf;}

    .btn-ghost {background-color: rgba(124, 124, 124, 0.6); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px; }
    .graph-energia-peru {width: 100%; max-width: 240px; margin-bottom: 20px;}
    .graph-generacion-energia {width: 100%; max-width: 240px; margin-bottom: 20px;}
    .circ-viviana {width: 100%; max-width: 150px; margin-top: 30vh; margin-bottom: 30vh;}
    .ministerio-energia {width: 100%; max-width: 120px; padding-right: 15px;}
    .next-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .next-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .go-prev-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .go-prev-b {background-color: rgba(28, 117, 188, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}

    .mundo-ventas, .eco-square, .molino-desarrollo, .dispon-centrales, .conector-gener, .generacion-peru, .his-libro, .his-flecha, .his-sol, .his-conector, .his-gota, .his-mundo, .tuercas-proposito, .profile-circle, .fabrica-humo, .conver-per, .graph-finan-conso, .profile-politica, .clic-estrella, .people-arrow, .rayo-generacion{display: none;}
    .fuentes-renovables {width: 100%; max-width: 100px;}
    .francisco-camus {width: 100%; max-width: 200px; position: initial; left: unset; top: unset; padding-top: 25vh; padding-bottom: 25vh; margin-left: -15px;}
    .manos-01 {width: 100%; max-width: 130px; margin-top: 20px;}
    .nota-comite {width: 100%; max-width: 120px;}
    .complekp-nehuenco-qui {width: 100%; max-width: 200px; position: relative; right: 0; top: unset; padding-top: 25vh; padding-bottom: 25vh; margin-right: -15px; padding-right: 0; float: right;}
    ..sello-colbun{margin-bottom: 30px;}
    .estragia-creci {width: 100%; max-width: 120px;}
    .contribucion-ods {width: 100%; max-width: 120px; margin-top: 20px;}
    .fabrica-eco {width: 100%;  max-width: 120px;}
    .plan-integridad{margin-bottom: 20px;}
    .mujer-reciclaje, .lapiz-reciclaje {width: 100%; max-width: 95px;}
    .next-o {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .cursos-flechas {width: 100%; max-width: 100px;}
    #transformacion-digital-colbun { background: url(../shapes/cap02/transformacion-digital-colbun.jpg) no-repeat left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 20vh; padding-bottom: 20vh;}
    .ampolleta-encendida {width: 100%; max-width: 120px; margin-bottom: 20px;}
    .chispas-03{display: none;}
    .proyector-svg{display: none;}
    .prev-g {background-color: rgba(0, 161, 75, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s;  font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-o {background-color: rgba(246, 139, 49, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .go-prev-o {background-color: rgba(246, 139, 49, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .tb-evol{margin-bottom: 30px;}
    .billet-icon {width: 100%; max-width: 100px;}
    .tb-financieras {width: 100%; max-width: 350px; margin-bottom: 30px;}
    .razon-deuda {width: 100%; max-width: 100px;}
    .circ-vista-cordillera {width: 100%; max-width: 180px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .tortas-generacion {margin-top: 20px;}
    .circ-central-angostura {width: 100%; max-width: 150px; position: initial; right: unset; bottom: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .img-dispon {margin-bottom: 20px;}
    .dispon-por-central {margin-bottom: 80px;}
    .personas-cultura {width: 100%;  max-width: 120px;}
    .denuncia-circs {width: 100%; max-width: 200px; margin-bottom: 20px;}
    .circ-san-clemente {width: 100%; max-width: 180px; position: initial; right: unset;  bottom: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .gorra-vigilantes {width: 100%; max-width: 100px;}
    .corrupcion {width: 100%; max-width: 100px;}
    .next-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .casa-hoja, .bicicleta-04, .voluntariado, .equidad-genero-01, .mano-like, .empresas-proveedoras, .dialogo-cta-publica{display: none;}

    .prev-o {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}

    .go-prev-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .manos-04, .constructor-04, .alerta-04{display: none;}
    .salario-mujeres {margin-bottom: 20px;}
    .canal-comunicacion {margin-bottom: 20px;}
    .bread-div{text-align: left !important;}
    .monto-compras {width: 100%; max-width: 100px;}
    .repro-achile {width: 100%;  max-width: 120px;}
    .casco-seguridad {width: 100%; max-width: 120px;}
    .segur-ocupacional {margin-bottom: 20px;}
    .curso-conduccion {width: 100%; max-width: 120px;}
    .manzana {width: 100%; max-width: 120px;}
    .hitos-seguridad {width: 100%; max-width: 150px; margin-bottom: 20px;}
    .temas-segur-com {margin-bottom: 20px;}
    .obrero-gestion {width: 100%; max-width: 120px; margin-bottom: 30px;}
    .mejor-calidad-vida {width: 100%; max-width: 100px; float: right;}
    .canal-comu-cdad {margin-bottom: 20px;}
    .circ-entorno-central {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .ciudadania, .lago-chapo{display: none;}
    .generando-futuro {width: 100%; max-width: 120px;}
    #relacionamiento-comun {padding-top: 20vh; padding-bottom: 20vh;}
    .next-v {background-color: rgba(0, 140, 68, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px;  margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    .centro-historico {width: 100%; max-width: 120px;}
    .juntas-vecino {width: 100%; max-width: 120px; margin-bottom: 20px;}
    .circ-entorno-canutillar {width: 100%; max-width: 150px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .circ-bahia-coronel {width: 100%; max-width: 150px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}

    .gota-05, .sol-05, .nube-04, .arbolitos-05, .viento, .gota-iniciativas, .represa-centrales, .gestion-del-agua{display: none;}
    .prev-c {background-color: rgba(0, 183, 222, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px;  transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 10px;}
    .go-next-v {background-color: rgba(80, 184, 72, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 55px;}
    .embalse-angostura {width: 100%; max-width: 150px; position: initial; left: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .reutilizacion-agua-01 {width: 100%; max-width: 120px;}
    .centrales-hidroelectricas {margin-bottom: 20px;}
    .consuma-agua-total {width: 100%; max-width: 120px;}
    .agua-potable {width: 100%; max-width: 120px;}

    .go-prev-v {background-color: rgba(80, 184, 72, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; transition: .3s; -webkit-transition: .3s; position: fixed; bottom: 2vh; left: 10px;}
    .consumo-diesel {width: 100%; max-width: 90px;}
    .emision-gases {width: 100%; max-width: 120px; margin-top: 50px;}
    .huella-carbono {width: 100%; max-width: 120px;}
    #zorro-silvestre {background: url(../shapes/cap05/zorro-silvestre.jpg) no-repeat right center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;  background-size: cover; padding-top: 20vh; padding-bottom: 20vh;}
    .circ-martin-pescador {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset;  padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .tb-total-emisiones-gei {padding-bottom: 30px;}
    .emisiones-gei {width: 100%; max-width: 120px;}
    .circ-entorno-lago-chapo {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .emisiones-atmosfericas {margin-bottom: 20px;}
    .viento-ico, .pajarito-biodiversidad{display: none;}

    .flor-manzano {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 30vh; padding-bottom: 30vh; float: right; margin-right: -15px;}
    .next-n {background-color: rgba(241, 97, 34, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff; position: fixed; bottom: 2vh; left: 55px;}
    #biodiversidad {padding-top: 20vh; padding-bottom: 20vh;}
    .colmena {width: 100%; max-width: 120px;}
    .constructor-06, .rayo-06, .nube-04, .industria-06, .ampolleta-06{display: none;}
    .prev-v {background-color: rgba(0, 140, 68, 0.9); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 16px; transition: .3s; -webkit-transition: .3s; font-family: Variable; font-weight: 900; color: #ffffff;  position: fixed; bottom: 2vh; left: 10px;}
    .circ-depuradora-agua {width: 100%; max-width: 180px; position: initial; right: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-central-biobio {width: 100%; max-width: 180px; position: initial; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .colbun-corp {width: 100%; max-width: 200px; padding-top: 25vh; padding-bottom: 25vh;}
    .btn-ghost-next {background-color: rgba(124, 124, 124, 0.6); display: inline-block; height: 40px; width: 40px; text-align: center; line-height: 40px; border-radius: 50px; margin-top: 30px; font-size: 18px; position: fixed; bottom: 2vh; left: 55px;}
    .aguas-01, .aguas-03{display: none;}
    .margen-ebitda {width: 100%; max-width: 250px; padding-top: 30px;}

    .comillas-presidente-gris {width: 100%; max-width: 100px; position: absolute; top: 106vh; right: 67vw;}
    .comillas-presidente-verdes {width: 100%; max-width: 40px; position: absolute; bottom: -5px; right: 44vw;}
    .flecha-carta, .gota-carta{display: none;}
    .circ-embalse-guardia {width: 100%; max-width: 180px; position: initial; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .helice-carta {width: 100%; max-width: 100px;}
    #regul-trans-energetica {padding-top: 20vh; padding-bottom: 20vh;}
    .mundo-carta {width: 100%; max-width: 100px;}
    #reconocimiento-back {background: url(../shapes/reconocimientos-back-2.jpg) no-repeat center top fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .crecio-economia-peru, .crecio-demanda-peru{display: none;}
    .circ-complejo-termo-valpo {width: 100%; max-width: 180px;  position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-embalse-colbun-maule {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .circ-proyecto-reciclaje {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-bottom: 20vh; padding-top: 20vh; float: right; margin-right: -15px;}
    .circ-cerntro-monitoreo{width: 100%; max-width: 180px; position: initial; bottom: unset; left: unset; padding-bottom: 20vh; padding-top: 20vh; margin-left: -15px;}
    .circ-central-clemente-maule{width: 100%; max-width: 180px; position: initial; bottom: unset; left: unset; padding-bottom: 20vh; padding-top: 20vh; margin-right: -15px; float: right;}
    .movil-cap-nro{width: 100%; max-width: 140px; margin-bottom: 10px;}
    .movil-box{padding-top: 15vh; padding-bottom: 15vh; padding-left: 8%;}
    #portada-01 {background: url(../shapes/cap01/movil-01-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-02 {background: url(../shapes/cap02/movil-02-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-03 {background: url(../shapes/cap03/movil-03-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-04 {background: url(../shapes/cap04/movil-04-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-05 {background: url(../shapes/cap05/movil-05-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-06 {background: url(../shapes/cap06/movil-06-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .fecha-circ {width: 100%; max-width: 150px; margin-bottom: 20px}
}

@media only screen and (min-width: 768px) and (max-width: 1023px){
    .pc-item{display: none;}
    .pc-item-02{display: block;}
    .shorty-01 {width: 100%;}
    .tablet-item{display: none;}
    .grey-back-tb{background-color: #f3f3f3;}
    .silver-back-tb{background-color: #ebebec;}
    .menu-pad {margin-top: 10vh; padding-bottom: 8vh}
    .cap-azul img, .cap-verde img, .cap-naranjo img, .cap-celeste img, .cap-green img, .cap-orange img {width: 100%; max-width: 90px; margin-bottom: 15px;}
    .cap-azul a, .cap-verde a, .cap-naranjo a, .cap-celeste a, .cap-green a, .cap-orange a, .cap-yellow a, .cap-amarillo a {position: absolute; top: 15px; right: 30px; font-size: 40px; transition: .3s; -webkit-transition: .3s;}
    .cap-azul h5, .cap-verde h5, .cap-naranjo h5, .cap-celeste h5, .cap-green h5, .cap-orange h5, .cap-yellow h5, .cap-amarillo h5 {font-size: 16px; width: 95%;}
    .overlay a {padding: 6px !important; font-size: 16px !important;}
    .book-pad-4-der {padding-left: 8%; padding-right: 8%; padding-top: 80px; padding-bottom: 80px;}
    .tablet-box {padding-top: 25vh; padding-left: 8%;}
    .tablet-box .movil-cap-nro {width: 100%; max-width: 200px; margin-bottom: 20px;}

    /*CAP1*/
    .tuerca-01 {display: none;}
    .waves-02 {display: none}
    .conector-01 {display: none;}
    #portada-01 {background: url(../shapes/cap01/tablet-01-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .waves-01 {width: 100%; max-width: 150px; position: absolute; bottom: 14vh; left: -2vw; z-index: -1;}
    .peces-01 {display: none;}
    .tit-01{width: 100%; max-width: 225px; margin-bottom: 20px;}

    .bajada-sub p {width: 100%; font-family: Variable; font-size: 18px;}
    .cifra-aumento {padding-left: 0; padding-top: 30px;}
    .conector-02 {width: 150px;}
    .rayo-01 {width: 125px;}
    .ruta-energetica {position: absolute; width: 160px; left: -50px; top: 45px;}
    .eficiencia-energetica {width: 100%; max-width: 110px; position: absolute; top: 12vh; right: 0px;}
    .seia-vec {width: 100%; max-width: 110px; position: absolute; right: 0px; bottom: 29vh;}
    .ley-flexibilidad-vec {width: 100%; max-width: 130px; position: absolute;  top: 0; right: 6vw;}
    .antena-electrica {width: 100%; max-width: 140px; position: absolute; bottom: 14vh; left: 0;}
    .perfect-transmision {width: 100%; max-width: 140px;}
    .wave-gris {width: 100%; max-width: 140px; position: absolute; right: 0; top: 5vh;}
    .pad-tb-01{padding-bottom: 80px;}
    .pad-tb-01{padding-top: 30px;}
    .peru-crecimiento {width: 100%; max-width: 140px; position: absolute; top: 0; right: 14vw;}
    .circ-viviana {width: 100%; max-width: 200px; margin-top: 25vh; margin-bottom: 25vh;}

    .circ-complejo-termo-valpo {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .crecio-economia-peru {width: 100%; max-width: 130px; position: absolute; left: 0; top: 8vh;}
    .crecio-demanda-peru {width: 100%; max-width: 120px; position: absolute; right: 6vw; top: 0;}
    .tit-item h1 {font-weight: 900; font-size: 34px;}

    .circ-embalse-colbun-maule {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    /*FIN CAP 1*/

    /*CAP 2*/
    #portada-02{background: url(../shapes/cap02/tablet-02-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .his-libro, .his-flecha, .his-mundo, .his-sol, .his-conector, .his-gota{display: none;}
    .thumb-nehuenco{height: 28vh;}
    .thumb-colbun{height: 14vh;}
    .thumb-candelaria{height: 14vh;}
    .thumb-canutillar{height: 14vh;}
    .thumb-santa-maria{height: 14vh;}
    .thumb-angostura{height: 14vh;}
    .thumb-la-mina{height: 14vh;}
    .thumb-solar{height: 14vh;}
    .thumb-rucue{height: 14vh;}
    .francisco-camus {width: 100%; max-width: 200px; position: initial;  left: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    #directorio-member-01{height: 28vh;}
    #directorio-member-02{height: 14vh;}
    #directorio-member-03{height: 14vh;}
    #directorio-member-04{height: 14vh;}
    #directorio-member-05{height: 14vh;}
    #directorio-member-06{height: 14vh;}
    #jardin-central {padding-top: 25vh; padding-bottom: 25vh;}
    .complekp-nehuenco-qui {width: 100%; max-width: 200px; position: initial; right: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .tuercas-proposito {width: 100%; max-width: 160px; position: absolute; top: 0; right: 10vw;}
    #crea-modelo-nego {background: url(../shapes/cap02/crea-modelo-negocio.jpg) no-repeat bottom left; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 25vh; padding-bottom: 25vh;}
    #gestion-riesgos {background: url(../shapes/cap02/gestion-riesgos.jpg) no-repeat center left; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 25vh; padding-bottom: 25vh;}
    .profile-circle, .conver-per{display: none;}
    .directrices-riesgos {width: 100%; max-width: 160px; margin-bottom: 30px;}
    .circ-central-santa-maria {width: 100%; max-width: 180px; position: initial; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .mundo-sos {width: 100%; max-width: 170px; position: absolute; top: 40vh; left: 0px;}
    .plan-integridad {margin-bottom: 30px;}
    #gobernanza-ddhh {background: url(../shapes/cap02/gobernanza-ddhh.jpg) no-repeat left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 25vh; padding-bottom: 25vh;}
    .circ-proyecto-reciclaje {width: 100%; max-width: 180px; position: inherit; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-cerntro-monitoreo {width: 100%; max-width: 180px; position: inherit; bottom: unset; left: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    #avances-2018 {background: url(../shapes/cap02/avances-2018.jpg) no-repeat left center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding-top: 25vh; padding-bottom: 25vh;}
    .circ-central-clemente-maule {width: 100%; max-width: 180px; position: inherit; bottom: unset; right: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    #metricas-financieras {padding-top: 25vh; padding-bottom: 25vh;}
    #evaluacion-inversionistas {padding-top: 25vh; padding-bottom: 25vh;}
    .circ-vista-cordillera {width: 100%; max-width: 180px; position: inherit; left: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .people-arrow{display: none;}
    .hitos201801{height: 11vh;}
    .hitos201802{height: 11vh;}
    .hitos201803{height: 11vh;}
    .hitos201804{height: 11vh;}
    .hitos201805{height: 11vh;}
    .hitos201806{height: 11vh;}
    .hitos201807{height: 11vh;}
    .hitos201808{height: 11vh;}
    .circ-central-angostura {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh;  padding-bottom: 20vh; float: right; margin-right: -15px;}
    .conector-gener {width: 100%; max-width: 110px;  position: absolute; right: 0; top: 32vh;}
    #energia-frutos-01{height: 25vh;}
    #energia-frutos-02{height: 25vh;}
    #energia-frutos-03{height: 25vh;}
    #energia-frutos-04{height: 25vh;}
    #energia-frutos-05{height: 25vh;}
    .molino-desarrollo {display: none;}
    .circ-central-chilca {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right;  margin-right: -15px;}
    .circ-san-clemente {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh;  padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-depuradora-nehuenco {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .sello-colbun {width: 100%; max-width: 450px;}
    .manos-04 {width: 100%; max-width: 160px; position: absolute; right: 0;}
    #diversidad-trabajadores {padding-top: 25vh;  padding-bottom: 25vh;}
    .salario-mujeres {margin-bottom: 30px;}
    #gastos-remuneraciones {padding-top: 25vh; padding-bottom: 25vh;}
    #cupos-laborales-capacitados{padding-top: 25vh; padding-bottom: 25vh;}
    #evaluacion-desempenio{padding-top: 30vh; padding-bottom: 30vh;}
    #voluntariado-corporativo{padding-top: 25vh; padding-bottom: 25vh;}
    .book-pad-2-der {padding-right: 8%; padding-left: 8%;}
    .mano-like {width: 100%; max-width: 150px; position: absolute; right: 0; top: 3vh;}
    .circ-central-los-quilos {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    #contratistas-proveedores{padding-top: 25vh; padding-bottom: 25vh;}
    #numero-distribucion{padding-top: 25vh; padding-bottom: 25vh;}
    .empresas-proveedoras {width: 100%; max-width: 90px; position: absolute; right: 0; top: 4vh;}
    #itercambio-buenas-practicas {padding-top: 25vh; padding-bottom: 25vh;}
    #evalua-socio-ambiente{padding-top: 25vh; padding-bottom: 25vh;}
    #encueta-percepcion{padding-top: 25vh; padding-bottom: 25vh;}
    #seguridad-salud{padding-top: 25vh; padding-bottom: 25vh;}
    .circ-instalaciones-central {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    #central-seguridad{padding-top: 25vh; padding-bottom: 25vh;}
    #relacionamiento-comun{padding-top: 25vh; padding-bottom: 25vh;}
    #participacion-ciudadana{padding-top: 25vh; padding-bottom: 25vh;}
    #prog-desarrollo-comun{padding-top: 25vh; padding-bottom: 25vh;}
    #inver-comun-chile{padding-top: 25vh; padding-bottom: 25vh;}
    #inv-progr-sociales{padding-top: 25vh; padding-bottom: 25vh;}
    #fondos-concursables{padding-top: 25vh; padding-bottom: 25vh;}
    #balneario-machicura{padding-top: 25vh; padding-bottom: 25vh;}
    #entorno-central-canutillar{padding-top: 25vh; padding-bottom: 25vh;}
    .circ-bahia-coronel{width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-entorno-central {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .circ-entorno-lago-chapo{width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .flor-manzano{width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh;  float: right; margin-right: -15px;}
    .gota-iniciativas{display: none;}
    .embalse-angostura {width: 100%; max-width: 150px; position: inherit; left: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .represa-centrales {width: 100%; max-width: 180px; position: absolute; right: 0; top: 22vh;}
    .circ-comuna-cochamo {width: 100%; max-width: 150px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    .circ-martin-pescador {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    #biodiversidad{padding-top: 25vh; padding-bottom: 25vh;}
    .circ-depuradora-agua {width: 100%; max-width: 180px; position: inherit; right: unset; top: unset; padding-top: 20vh; padding-bottom: 20vh; float: right; margin-right: -15px;}
    #objetivos-sostenibles{padding-top: 25vh; padding-bottom: 25vh;}
    #info-rel-planta{padding-top: 25vh; padding-bottom: 25vh;}
    .circ-central-biobio{width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-top: 20vh; padding-bottom: 20vh; margin-left: -15px;}
    .pad-fill {padding-top: 8vh; padding-bottom: 8vh;}
    .colbun-corp {width: 100%; max-width: 300px; padding-top: 25vh; padding-bottom: 25vh;}
    /*FIN CAP 2*/

    .chispas-03, .flecha-032, .bicicleta-04, .nube-04, .viento, .sol-05, .gota-05, .arbolitos-05, .constructor-06, .rayo-06, .ampolleta-06, .industria-06{display: none;}
    #portada-03{background: url(../shapes/cap03/tablet-03-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-04{background: url(../shapes/cap04/tablet-04-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-05{background: url(../shapes/cap05/tablet-05-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    #portada-06{background: url(../shapes/cap06/tablet-06-back.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .comillas-presidente-gris {width: 100%; max-width: 240px; position: absolute; top: 8vh; right: 9vw;}
    .comillas-presidente-verdes {width: 100%; max-width: 35px; position: absolute; bottom: -1px; right: 21vw;}
    .flecha-carta{display: none;}
    .circ-embalse-guardia {width: 100%; max-width: 180px; position: inherit; right: unset; bottom: unset; padding-bottom: 25vh; padding-top: 25vh; float: right; margin-right: -15px;}
    #regul-trans-energetica {padding-top: 25vh; padding-bottom: 25vh;}
    #reconocimiento-back {background: url(../shapes/reconocimientos-colbun-tablet.jpg) no-repeat left center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
}

@media only screen and (min-width: 1024px) and (max-width: 1279px){
    .pc-item{display: none !important;}
    .pc-item-02{display: none;}
}

@media only screen and (min-width: 1280px) and (max-width: 1365px){
    .book-pad { padding-left: 6%; padding-right: 6%;}
    .book-pad-2 {padding-left: 6%; padding-right: 6%; padding-top: 80px; padding-bottom: 80px;}
    h1, .tit-item h1 {font-size: 30px;}
    .pc-item{display: none !important;}
    .pc-item-02{display: none;}
    #portada-01{background: url(../shapes/cap01/01-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

    .aqua-circle, .circle-02, .circle-03, .circle-04, .circle-05, .circle-06{width: 550px; margin-left: 0vw; margin-top: 12vh;}
    .tuerca-01 {width: 100%; max-width: 170px; position: fixed; right: -5vw; top: 57vh;}
    .conector-01 {width: 100%; max-width: 155px;}
    .waves-01 {width: 100%; max-width: 155px;}
    .waves-02 {width: 100%; max-width: 155px;}
    .peces-01 {width: 100% !important; max-width: 250px !important;}
    .conexiones{width: 100%; max-width: 250px;}
    .flecha-03{width: 100%; max-width: 200px;}
    .tit-01, .tit-02, .tit-03, .tit-04, .tit-05, .tit-06{width: 100%; max-width: 210px; margin-bottom: 20px;}
    .tit-cap-port {font-size: 30px; line-height: 33px; font-weight: 900;}
    .subtit-cap-port {width: 70%; font-size: 14px;}
    .entrar-cian-01 {margin-top: 0px;}
    .cap-azul h5, .cap-verde h5, .cap-naranjo h5, .cap-celeste h5, .cap-green h5, .cap-orange h5, .cap-yellow h5, .cap-amarillo h5 {font-weight: 900; color: #ffffff; width: 80%; font-size: 18px;}
    .cap-azul img, .cap-verde img, .cap-naranjo img, .cap-celeste img, .cap-green img, .cap-orange img{width: 100%; max-width: 80px; margin-bottom: 20px;}
    .cap-yellow {background-color: #ffc72c; padding: 20px 30px;}
    .cap-amarillo {background-color: #ffa300; padding: 20px 30px;}

    .ruta-energetica {position: absolute; width: 200px; left: -50px; top: 45px;}
    .bajada-sub p {width: 70%; font-family: Variable; font-size: 18px;}
    .compromisos-ruta p, .economia-aumento p {font-family: Variable; font-weight: 900; width: 100%;}
    .ministerio-energia {width: 100%; max-width: 110px; padding-right: 15px;}
    .seia-vec {width: 100%; max-width: 100px; position: absolute; right: 0px; bottom: 46vh;}
    .comillas-presidente-gris {width: 100%; max-width: 180px;  position: absolute; top: 0; right: 31vw;}
    .comillas-presidente-verdes {width: 100%; max-width: 35px; position: absolute; bottom: 0; right: 20vw;}
    .flecha-carta {width: 100%; max-width: 200px; position: absolute; left: 0; bottom: 30vh;}
    .gota-carta {width: 100%; max-width: 120px; position: absolute; right: 0; top: 4vh;}
    .eficiencia-energetica {width: 100%; max-width: 120px; position: absolute; top: 15vh; right: 0px;}
    .ley-flexibilidad-vec {width: 100%; max-width: 150px; position: absolute; top: 0; right: 8vw;}
    .crecio-economia-peru {width: 100%; max-width: 150px; position: absolute; left: 0; top: 8vh;}
    .crecio-demanda-peru {width: 100%; max-width: 120px; position: absolute; right: 5vw; top: 0; }
    .tuercas-proposito {width: 100%; max-width: 200px;  position: absolute; top: 0;  right: 30vw;}
    .flecha-032 {width: 100%; max-width: 200px; position: fixed; right: 7vw; top: 2vh;}
    .chispas-03 {width: 100%; max-width: 180px; position: fixed; left: 35vw; top: 24vh;}
    .mundo-sos {width: 100%; max-width: 184px; position: absolute; top: 53vh; left: 0px;}
    .conver-per {width: 100%; max-width: 184px; position: absolute; top: 23vh; left: 0px;}
    .people-arrow {position: absolute; left: 0; width: 100%; max-width: 200px; top: 8vh;}
    .rayo-generacion {position: absolute; top: 0; width: 100%; right: 85px; max-width: 200px;}
    .mundo-ventas {width: 100%; max-width: 200px; position: absolute; left: 0; top: 8vh;}
    .conector-gener {width: 100%; max-width: 120px; position: absolute; right: 0; top: 38vh;}
    .graph-finan-conso {width: 100%; max-width: 200px; position: absolute; left: 0; top: 14vh;}
    .dispon-centrales{display: none;}
    .eco-square {width: 100%; max-width: 200px; position: absolute; left: 0; top: 73vh;}

    .bicicleta-04 {width: 100%; max-width: 180px; position: fixed; left: 35vw; top: 28vh;}
    .casa-hoja {width: 100%; max-width: 200px; position: absolute; bottom: 0; left: 18vw;}
    .nube-04 {width: 100%; max-width: 120px; position: fixed; right: -2vw; top: 65vh;}
    #portada-04 {background: url(../shapes/cap04/04-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .empresas-proveedoras {width: 100%; max-width: 90px; position: absolute; right: 0; top: 4vh;}

    .constructor-04 {width: 100%; max-width: 130px; position: absolute; right: 0; top: 47vh;}
    .viento {width: 100%; max-width: 180px; position: absolute; bottom: -40px; left: 18vw;}
    .gota-05 {width: 100%; max-width: 150px; position: fixed; left: 36vw; top: 33vh;}
    .arbolitos-05 {position: absolute; width: 100%; max-width: 200px; bottom: 0px; left: 44vw;}
    .sol-05 {position: absolute; width: 100%; max-width: 180px; top: 0px; right: 5vw;}
    #portada-05 {background: url(../shapes/cap05/05-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .graph-energia-segura {width: 100%; max-width: 400px;}
    .gota-iniciativas {width: 100%; max-width: 130px; position: absolute; right: 1vw; top: 0;}
    .represa-centrales {width: 100%; max-width: 130px; position: absolute; right: 0; top: 21vh;}
    .pajarito-biodiversidad {width: 100%; max-width: 150px; position: absolute; right: 0; top: 4vh;}
    .ampolleta-06 {width: 100%; max-width: 200px; position: absolute; bottom: -20px; left: -2vw;}
    .industria-06 {position: absolute; width: 100%; max-width: 200px; bottom: 0px; left: 28vw;}
    .constructor-06 {width: 100%; max-width: 180px; position: fixed; left: 32vw; top: 30vh;}
    .rayo-06 {position: absolute; width: 100%; max-width: 100px; top: 0px; right: 7vw;}
    #portada-06 {background: url(../shapes/cap06/06-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
}

@media only screen and (min-width: 1366px) and (max-width: 1439px){
    .book-pad { padding-left: 6%; padding-right: 6%;}
    .book-pad-2 {padding-left: 6%; padding-right: 6%; padding-top: 80px; padding-bottom: 80px;}
    .pc-item{display: none !important;}
    .pc-item{display: none;}
    #portada-01{background: url(../shapes/cap01/01-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

    .aqua-circle, .circle-02, .circle-03, .circle-04, .circle-05, .circle-06{width: 550px; margin-left: 0vw; margin-top: 12vh;}
    .tuerca-01 {width: 100%; max-width: 170px; position: fixed; right: -5vw; top: 57vh;}
    .conector-01 {width: 100%; max-width: 155px;}
    .waves-01 {width: 100%; max-width: 155px;}
    .waves-02 {width: 100%; max-width: 155px;}
    .peces-01 {width: 100% !important; max-width: 250px !important;}
    .conexiones{width: 100%; max-width: 250px;}
    .flecha-03{width: 100%; max-width: 200px;}
    .tit-01, .tit-02, .tit-03, .tit-04, .tit-05, .tit-06{width: 100%; max-width: 210px; margin-bottom: 20px;}
    .tit-cap-port {font-size: 34px; line-height: 35px; font-weight: 900;}
    .subtit-cap-port {width: 70%; font-size: 14px;}
    .entrar-cian-01 {margin-top: 0px;}
    .cap-azul img, .cap-verde img, .cap-naranjo img, .cap-celeste img, .cap-green img, .cap-orange img{width: 100%; max-width: 80px; margin-bottom: 20px;}
    .cap-azul h5, .cap-verde h5, .cap-naranjo h5, .cap-celeste h5, .cap-green h5, .cap-orange h5, .cap-yellow h5, .cap-amarillo h5 {font-weight: 900; color: #ffffff; width: 80%; font-size: 18px;}
    .cap-yellow {background-color: #ffc72c; padding: 20px 30px;}
    .cap-amarillo {background-color: #ffa300; padding: 20px 30px;}

    .ruta-energetica {position: absolute; width: 180px; left: -50px; top: 45px;}
    .ministerio-energia {width: 100%; max-width: 125px; padding-right: 15px;}
    .seia-vec {width: 100%; max-width: 110px; position: absolute; right: 0px; bottom: 37vh;}
    .bajada-sub p {width: 50%; font-family: Variable; font-size: 18px;}

    .comillas-presidente-gris {width: 100%; max-width: 180px; position: absolute; top: 0; right: 35vw;}
    .comillas-presidente-verdes {width: 100%; max-width: 35px; position: absolute; bottom: 0; right: 2vw;}
    .flecha-carta {width: 100%; max-width: 200px; position: absolute; left: 0; bottom: 24vh;}
    .gota-carta {width: 100%; max-width: 120px; position: absolute; right: 0; top: 4vh;}

    .crecio-economia-peru {width: 100%; max-width: 150px; position: absolute; left: 0; top: 8vh;}
    .crecio-demanda-peru {width: 100%; max-width: 120px; position: absolute; right: 5vw; top: 0; }

    .tuercas-proposito {width: 100%; max-width: 200px;  position: absolute; top: 0;  right: 30vw;}
    .flecha-032 {width: 100%; max-width: 200px; position: fixed; right: 7vw; top: 2vh;}
    .chispas-03 {width: 100%; max-width: 180px; position: fixed; left: 35vw; top: 24vh;}
    .mundo-sos {width: 100%; max-width: 184px; position: absolute; top: 53vh; left: 0px;}
    .conver-per {width: 100%; max-width: 184px; position: absolute; top: 23vh; left: 0px;}
    .people-arrow {position: absolute; left: 0; width: 100%; max-width: 200px; top: 8vh;}
    .rayo-generacion {position: absolute; top: 0; width: 100%; right: 85px; max-width: 200px;}
    .mundo-ventas {width: 100%; max-width: 200px; position: absolute; left: 0; top: 8vh;}
    .conector-gener {width: 100%; max-width: 120px; position: absolute; right: 0; top: 38vh;}
    .graph-finan-conso {width: 100%; max-width: 200px; position: absolute; left: 0; top: 14vh;}
    .dispon-centrales{display: none;}
    .eco-square {width: 100%; max-width: 200px; position: absolute; left: 0; top: 73vh;}
    .proyector-svg {width: 100%; max-width: 150px; position: absolute; bottom: -6vh; right: 14vw;}

    .bicicleta-04 {width: 100%; max-width: 180px; position: fixed; left: 35vw; top: 28vh;}
    .casa-hoja {width: 100%; max-width: 200px; position: absolute; bottom: 0; left: 18vw;}
    .nube-04 {width: 100%; max-width: 120px; position: fixed; right: -2vw; top: 65vh;}
    #portada-04 {background: url(../shapes/cap04/04-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .empresas-proveedoras {width: 100%; max-width: 90px; position: absolute; right: 0; top: 4vh;}

    .constructor-04 {width: 100%; max-width: 130px; position: absolute; right: 0; top: 47vh;}
    .viento {width: 100%; max-width: 180px; position: absolute; bottom: -40px; left: 18vw;}
    .gota-05 {width: 100%; max-width: 150px; position: fixed; left: 36vw; top: 33vh;}
    .arbolitos-05 {position: absolute; width: 100%; max-width: 200px; bottom: 0px; left: 44vw;}
    .sol-05 {position: absolute; width: 100%; max-width: 180px; top: 0px; right: 5vw;}
    #portada-05 {background: url(../shapes/cap05/05-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .graph-energia-segura {width: 100%; max-width: 400px;}
    .gota-iniciativas {width: 100%; max-width: 130px; position: absolute; right: 1vw; top: 0;}
    .represa-centrales {width: 100%; max-width: 130px; position: absolute; right: 0; top: 21vh;}
    .pajarito-biodiversidad {width: 100%; max-width: 150px; position: absolute; right: 0; top: 12vh;}
    .ampolleta-06 {width: 100%; max-width: 200px; position: absolute; bottom: -20px; left: -2vw;}
    .industria-06 {position: absolute; width: 100%; max-width: 200px; bottom: 0px; left: 28vw;}
    .constructor-06 {width: 100%; max-width: 180px; position: fixed; left: 32vw; top: 30vh;}
    .rayo-06 {position: absolute; width: 100%; max-width: 100px; top: 0px; right: 7vw;}
    #portada-06 {background: url(../shapes/cap06/06-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .eficiencia-energetica {width: 100%; max-width: 130px; position: absolute; top: 15vh; right: 0px;}
}

@media only screen and (min-width: 1440px) and (max-width: 1679px){
    .pc-item{display: none !important;}
    .pc-item-02{display: none;}
    #portada-01{background: url(../shapes/cap01/01-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}

    .aqua-circle, .circle-02, .circle-03, .circle-04, .circle-05, .circle-06{width: 620px; margin-left: 0vw; margin-top: 15vh;}
    .tuerca-01 {width: 100%; max-width: 170px; position: fixed; right: -5vw; top: 57vh;}
    .conector-01 {width: 100%; max-width: 155px;}
    .waves-01 {width: 100%; max-width: 155px;}
    .waves-02 {width: 100%; max-width: 155px;}
    .peces-01 {width: 100% !important; max-width: 300px !important;}
    .conexiones{width: 100%; max-width: 250px;}
    .flecha-03{width: 100%; max-width: 200px;}
    .tit-01, .tit-02, .tit-03, .tit-04, .tit-05, .tit-06{width: 100%; max-width: 210px; margin-bottom: 20px;}
    .tit-cap-port {font-size: 35px; line-height: 37px; font-weight: 900;}
    .subtit-cap-port {width: 60%; font-size: 14px;}
    .entrar-cian-01 {margin-top: 10px;}
    .ministerio-energia {width: 100%; max-width: 120px; padding-right: 15px;}
    .seia-vec {width: 100%; max-width: 130px; position: absolute; right: 0px; bottom: 30vh;}
    .proyector-svg {width: 100%; max-width: 120px; position: absolute; bottom: 8vh; right: 18vw;}

    .cap-azul img, .cap-verde img, .cap-naranjo img, .cap-celeste img, .cap-green img, .cap-orange img{width: 100%; max-width: 80px; margin-bottom: 20px;}
    .cap-azul h5, .cap-verde h5, .cap-naranjo h5, .cap-celeste h5, .cap-green h5, .cap-orange h5, .cap-yellow h5, .cap-amarillo h5 {font-weight: 900; color: #ffffff; width: 80%; font-size: 18px;}
    .cap-yellow {background-color: #ffc72c; padding: 20px 30px;}
    .cap-amarillo {background-color: #ffa300; padding: 20px 30px;}
}

@media only screen and (min-width: 1680px) and (max-width: 1919px){
    .pc-item{display: none !important;}
    .pc-item-02{display: none;}
    #portada-01{background: url(../shapes/cap01/01-back.jpg) no-repeat right center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}
    .tuerca-01 {width: 100%; max-width: 220px; position: fixed; right: -5vw; top: 58vh;}
    .cap-azul img, .cap-verde img, .cap-naranjo img, .cap-celeste img, .cap-green img, .cap-orange img{width: 100%; max-width: 100px; margin-bottom: 20px;}
}

@media only screen and (min-width: 1920px){
    .pc-item{display: none !important;}
    .pc-item-02{display: none;}
}