@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1560px) {
	#intro .tres .intro .intro-1{width: 44%;}
	#intro .tres .intro .intro-2{width: 800px;}
	#intro .tres .intro .intro-3{width: 44%;}

}

@media screen and (max-width:1145px) {
	#perfil .intro p{color:#ffffff; font-size: 18px; font-weight: 600; position: relative;}
	#inversionistas .intro .bg-inversionistas2{width: 70%; height: 100%; top:0; left: 0%; position: absolute; background-repeat: no-repeat; background-position: center;}
}

@media screen and (max-width:1045px) {
	#semblanza .mapa .tooltip{left: 54%;}
}


@media screen and (max-width:995px) {
	#perfil .intro p{color:#ffffff; font-size: 16px; font-weight: 600; position: relative;}
	#semblanza .mapa .tooltip{left: 60%;}
}

@media screen and (max-width:900px) {
	#perfil .corporativo .flex-50{display: block;}
	#perfil .corporativo .flex-50 > div{width: 100%;}
	
	#perfil .intro .flex-50{flex-wrap: wrap;}
	#perfil .intro .flex-50 > div{width: 100%;}
	#perfil .intro .flex-50 > div .txt60{padding: 0 30px;}
	#perfil .intro .bg-perfil{width: 100%; height: 100%; top:0; left: 0; right: 0; margin:0 auto; position: absolute; -moz-transform: skew(0deg, 0deg);
-webkit-transform: skew(0deg, 0deg);
-o-transform: skew(0deg, 0deg);
-ms-transform: skew(0deg, 0deg);
transform: skew(0deg, 0deg);}
	#perfil .intro .cinta{display: none;}
	
	#semblanza .mapa .referencias{width: 350px; display: flex; position: relative; right: 0; top:0; margin: -40px 0 0px; padding-bottom: 20px;}
	
	#semblanza .flex-50{flex-wrap: wrap;}
	#semblanza .flex-50 > div{width: 100%; margin-bottom: 20px;}
	#semblanza .sitios .cifra .foto{right: -20%;}
	
	#fibra .intro-fibra h2 br{display: block;}
}

@media screen and (max-width:800px) {
	#intro .tres .cinta{left: 10%;}
	#intro .tres{width: 100%; height: 68%; max-height: 400px;}
	#intro .tres .intro .intro-1{width: 42%;}
	#intro .tres .intro .intro-2{width: 550px;}
	#intro .tres .intro .intro-3{width: 42%;}
	
	#gobierno .flex-6040{flex-wrap: wrap;}
	#gobierno .flex-6040 > div{width: 100%;}
	
	#societarias .titulo h2{font-size: 34px !important;}
	#societarias .titulo .cinta{width: 12px !important; background: url("../images/bg-degradado.jpg") center; background-size: cover; margin: 35px 0;}
	
	#inversionistas .intro .bg-inversionistas{background: url("../images/inversionistas/bg.jpg"); background-size: cover; width: 75%; height: 100%; top:0; right: -20%;}
	#inversionistas .intro p{color:#ffffff; font-size: 50px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; right: 60px; bottom: 60px;}
	
	#inversionistas .flex-6040{flex-wrap: wrap;}
	#inversionistas .flex-6040 > div{width: 100%;}
	
	#crecimiento .flex-6040{flex-wrap: wrap;}
	#crecimiento .flex-6040 > div{width: 100%;}
	
	#crecimiento .flex-6040{flex-wrap: wrap;}
	#crecimiento .flex-6040 > div{width: 100%;}
	
	#fibra .flex-6040{flex-wrap: wrap;}
	#fibra .flex-6040 > div{width: 100%;}
	
	#innovacion .flex-4060{flex-wrap: wrap;}
	#innovacion .flex-4060 > div{width: 100%;}
	
	#contacto .intro p{font-size: 50px;}
}

@media screen and (max-width:720px) {
	.titulo h2{font-size: 34px;}
	.titulo .cinta{width: 12px; background: url("../images/bg-degradado.jpg") center; background-size: cover; margin: 35px 0;}
	
	#semblanza .mapa .tooltip{position: absolute; top: 0px; left: auto; right: 0px;}	
	
	#gobierno .flex-50{flex-wrap: wrap;}
	#gobierno .flex-50 > div{width: 100%;}
	
	#crecimiento .intro-crecimiento .tres .linea{width: 70%; bottom: 48%;}
	#crecimiento .intro-crecimiento .tres .linea .circulo4{display: none;}
	#crecimiento .intro-crecimiento{height: 450px;}
	#crecimiento .intro-crecimiento h2{font-size: 45px; left: 30px; bottom: 0px;}
	
	#fibra .intro-fibra .tres .linea{width: 70%; bottom: 48%;}
	#fibra .intro-fibra .tres .linea .circulo4{display: none;}
	#fibra .intro-fibra{height: 450px;}
	#fibra .intro-fibra h2{font-size: 45px; left: 30px; bottom: 0px;}
	#fibra .intro-fibra h2 br{display: none;}
	
	#innovacion .intro-innovacion .tres .linea{width: 70%; bottom: 48%;}
	#innovacion .intro-innovacion .tres .linea .circulo4{display: none;}
	#innovacion .intro-innovacion{height: 450px;}
	#innovacion .intro-innovacion h2{font-size: 45px; left: 30px; bottom: 0px;}
	
	#resumen .flex-50{flex-wrap: wrap;}
	#resumen .flex-50 > div{width: 100%;}
	
	#resumen .flex-graficas{flex-wrap: wrap;}
	#resumen .flex-graficas > div{width: 55%; margin:0 auto 40px;}
	
	#contacto .intro{padding: 140px 0 40px; overflow: hidden; height: 200px; margin-bottom: 40px;}
	#contacto .intro .cinta{width: 28px; top:31%; bottom: 0; position: absolute; right: -16px; background: url("../images/bg-degradado.jpg") no-repeat; background-size: contain;}
	#contacto .intro p{font-size: 40px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; left: 30px; bottom: 60px;}
}

@media screen and (max-width:690px) {
	#intro .tres .cinta{left: 17%; width: 24px;}
	#intro .tres{width: 100%; height: 68%; max-height: 300px;}
	#intro .tres .intro .intro-1{width: 42%;}
	#intro .tres .intro .intro-2{width: 500px;}
	#intro .tres .intro .intro-3{width: 42%;}
	
	#intro .intro-blue h3 .quitar{display: none;}
}

@media screen and (max-width:650px) {
	#inversionistas .intro{height: 180px;}
	#inversionistas .intro .cinta{width: 25px; top:35%; position: absolute; bottom: 0; left: -15px; background: url("../images/bg-degradado.jpg") no-repeat; background-size: contain;}
	#inversionistas .intro p{color:#ffffff; font-size: 40px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; right: 60px; bottom: 40px;}
}

@media screen and (max-width:580px) {
	#intro .intro-blue h3{font-size: 35px; font-weight: 700; line-height: 1.2; color: #ffffff; margin: 45px auto 15px; display: table;}
	#intro .intro-blue h3 span{font-size: 16px; color: #fdb933; letter-spacing: 8px; display: block; margin-top: 20px;}
	
	#semblanza .mapa .referencias{width: 100%; display: flex; position: relative; right: 0; left: 0; top:auto; margin: 0px 0 0px; padding-bottom: 20px;}
	#semblanza .mapa .tooltip .txt{padding: 0 0px 0 0;}
	#semblanza .sitios .cifra .foto{right: -30%;}
}

@media screen and (max-width:560px) {
	#intro .intro-blue h3{font-size: 30px; font-weight: 700; line-height: 1.2; color: #ffffff; margin: 45px auto 15px; display: table;}
	
	#semblanza .flex-antenas p{font-size: 12px !important;}
	#semblanza .flex-antenas p span{font-size: 26px !important;}
	
	#crecimiento .intro-crecimiento > .circle{font-size: 16px; right: 20px; bottom: 90px; padding: 15px; width: 100px; height:100px;}
	#crecimiento .intro-crecimiento > .circle span{color: #3155a6; font-size: 35px;}
	
	#fibra .intro-fibra > .circle{font-size: 14px; right: 20px; bottom: 90px; padding: 15px; width: 110px; height:110px;}
	#fibra .intro-fibra > .circle span{color: #3155a6; font-size: 35px;}
	
	#innovacion .intro-innovacion > .circle{font-size: 16px; right: 20px; bottom: 90px; padding: 15px; width: 100px; height:100px;}
	#innovacion .intro-innovacion > .circle span{color: #3155a6; font-size: 35px;}
	
	#contacto .intro{padding: 140px 0 40px; overflow: hidden; height: 100px; margin-bottom: 40px;}
	#contacto .intro .bg-inversionistas{background: url("../images/contacto/bg.jpg"); background-size: cover; width: 100%; height: 100%; top:0; left: -18%;}
	#contacto .intro .cinta{width: 22px; top:34%; bottom: 0; position: absolute; right: -14px; background: url("../images/bg-degradado.jpg") no-repeat; background-size: contain;}
	#contacto .intro p{font-size: 30px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; left: 30px; bottom: 30px;}

}

@media screen and (max-width:450px) {
	#intro .tres .cinta{left:20%; width: 18px;}
	#intro .tres{width: 100%; height: 68%; max-height: 200px;}
	#intro .tres .intro .intro-1{width: 42%;}
	#intro .tres .intro .intro-2{width: 375px;}
	#intro .tres .intro .intro-3{width: 42%;}
	
	#intro .intro-blue h3{font-size: 29px; font-weight: 700; line-height: 1.2; color: #ffffff; margin: 45px auto 15px; display: table;}
	#intro .intro-blue h3 span{font-size: 15px; color: #fdb933; letter-spacing: 8px; display: block; margin-top: 20px;}
	
	#semblanza .sitios .cifra .foto{right: -40%;}
	
	#societarias .titulo h2{font-size: 30px !important;}
	
	#inversionistas .intro .bg-inversionistas{background: url("../images/inversionistas/bg.jpg"); background-size: cover; width: 75%; height: 100%; top:0; right: -22%;}
	#inversionistas .intro{height: 160px;}
	#inversionistas .intro .cinta{width: 25px; top:35%; position: absolute; bottom: 0; left: -15px; background: url("../images/bg-degradado.jpg") no-repeat; background-size: contain;}
	#inversionistas .intro p{color:#ffffff; font-size: 30px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; right: 40px; bottom: 30px;}

	#resumen .flex-graficas > div{width: 70%; margin:0 auto 70px;}

}

@media screen and (max-width:425px) {
	.idioma {
		background: #3155a6;
		display: flex;
		justify-content: center;
		align-content: center;
		align-items: center;
	}
	.idioma a {
		font-family: acumin-pro, sans-serif; 
		font-weight: 400;
		text-transform: uppercase;
		color: #fff;
		text-decoration: none;
		font-size: 10px;
		transition: 400ms ease;
		padding: 6px 20px;
		text-align: center;
	}
	
	#semblanza .mapa .tooltip p.indicacion{font-size: 10px; margin-bottom: 5px;}
	#semblanza .mapa .tooltip .region p.titulo-region{font-size: 12px; color:#666666; margin-bottom: 10px;}
	#semblanza .mapa .tooltip .region .numero-region{font-size: 18px; font-weight: 600;  margin:0 auto; display: flex; justify-content: center; align-content: center; align-items: center; width: 40px; height: 40px;}

	#semblanza .sitios .cifra h5{padding: 25px 30px 35px; font-size: 22px;}
	#semblanza .sitios .cifra h5 span{font-size: 45px;}
	
	#semblanza .flex-antenas .txt{padding: 0 10px;}
	#semblanza .flex-antenas p{font-size: 12px !important;}
	
	#societarias .titulo h2{font-size: 24px !important;}
	
	#crecimiento .intro-crecimiento .tres .linea{width: 70%; bottom: 56%;}
	#crecimiento .intro-crecimiento .tres .linea2{right: 17%;}
	#crecimiento .intro-crecimiento{height: 360px;}
	#crecimiento .intro-crecimiento h2{font-size: 36px; left: 30px; bottom: 0px;}
	
	#crecimiento .intro-crecimiento > .circle{font-size: 13px; right: 20px; bottom: 90px; padding: 15px; width: 80px; height:80px;}
	#crecimiento .intro-crecimiento > .circle span{color: #3155a6; font-size: 26px;}
	
	#fibra .intro-fibra .tres .linea{width: 70%; bottom: 56%;}
	#fibra .intro-fibra .tres .linea2{right: 17%;}
	#fibra .intro-fibra{height: 360px;}
	#fibra .intro-fibra h2{font-size: 36px; left: 30px; bottom: 0px;}
	#fibra .intro-fibra > .circle sup{font-size: 18px;}
	
	#fibra .intro-fibra > .circle{font-size: 12px; right: 20px; bottom: 90px; padding: 15px; width: 90px; height:90px;}
	#fibra .intro-fibra > .circle span{color: #3155a6; font-size: 26px;}
	
	#innovacion .intro-innovacion .tres .linea{width: 70%; bottom: 56%;}
	#innovacion .intro-innovacion .tres .linea2{right: 17%;}
	#innovacion .intro-innovacion{height: 360px;}
	#innovacion .intro-innovacion h2{font-size: 36px; left: 30px; bottom: 0px;}
	#innovacion .intro-innovacion > .circle sup{font-size: 18px;}
	
	#innovacion .intro-innovacion > .circle{font-size: 13px; right: 20px; bottom: 90px; padding: 15px; width: 80px; height:80px;}
	#innovacion .intro-innovacion > .circle span{color: #3155a6; font-size: 26px;}
	
	#contacto .intro{padding: 140px 0 40px; overflow: hidden; height: 100px; margin-bottom: 40px;}
	#contacto .intro .bg-inversionistas{background: url("../images/contacto/bg.jpg"); background-size: cover; width: 108%; height: 100%; top:0; left: -18%;}
	#contacto .intro .cinta{width: 20px; top:38%; bottom: 0; position: absolute; right: -14px; background: url("../images/bg-degradado.jpg") no-repeat; background-size: contain;}
	#contacto .intro p{font-size: 28px; line-height: 1.2; font-weight: 300; position: absolute; width: auto; left: 30px; bottom: 30px;}
	
	#contacto p.f18{font-size: 14px !important;}
	#contacto p .f20{font-size: 16px !important;}
}

@media screen and (max-width:360px) {
	#semblanza .sitios .cifra h5{padding: 25px 30px 35px; font-size: 18px;}
	#semblanza .sitios .cifra h5 span{font-size: 32px;}
	
	#inversionistas .intro p{color:#ffffff; font-size: 24px; line-height: 1.2; font-weight: 300; position: absolute; width: 45%; right: 40px; bottom: 30px;}
	#contacto p.f18 a{font-size: 12px !important;}
}


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

/* iPad screen size rules */
@media only screen and (device-width: 768px) {
	
}

/* Portrait iPad display */
@media only screen and (min-device-width: 720px) and (max-device-width: 1020px) and (orientation:landscape) {
	
}

/* Landscape iPad display */
@media only screen and (min-device-width: 320px) and (max-device-width: 720px) and (orientation:landscape) {

}