html, body {
	background-color:#3a4047;
}

.contenedor {
	max-width: 1124px;
}

.section_p{
	font-family:"Campton Light", "Century Gothic";
	font-size:16px;
	text-align:justify;
	padding-bottom:15px;
	max-width:780px;
	margin:0 auto;
}
.section_p strong{
	font-family:"Campton SemiBold", "Century Gothic";
}

.separador{
	position:relative;
	margin:0 auto;
	transition:all .3s linear;
}

#linea_tiempo{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-0.5px;
	transition:all	1s;
}

.separador,
#linea_tiempo{
	width:1px;
	height:0;
	transition-delay:0.2s;
	background-color:#f1f6fa;
}

.separador:before,
.separador:after,
#linea_tiempo:before,
#linea_tiempo:after{
	content:"";
	position:absolute;
	width:7px;
	height:7px;
	border:1px solid #f1f6fa;
	border-radius:10px;	
	left:-4px;
	transition:all .2s;
	opacity:0;
}

.separador:before,
#linea_tiempo:before{
	top:-8px;
	background-color:#73acde;
}

.separador:after,
#linea_tiempo:after{
	bottom:-8px;
	transition-delay:0.5s;
}
.separador.visible_linea:before,
.separador.visible_linea:after,
#linea_tiempo.visible_linea:before,
#linea_tiempo.visible_linea:after{
	opacity:1;
}

#separador1{
	margin-bottom:60px;
}
#separador2.visible_linea,
#separador3.visible_linea{
	margin-bottom:120px;
}
#linea_tiempo.visible_linea{
	margin-bottom:100%;
}
#separador1.visible_linea{
	height:60px;	
	margin-bottom:0;
}
#separador2.visible_linea,
#separador3.visible_linea{
	height:120px;	
	margin-bottom:0;
}
#linea_tiempo.visible_linea{
	height:100%;
	margin-bottom:0;
}

.animated_thing{
	transition:transform .5s, opacity .5s;
}
.pieza_grafico_oculta,
.pieza_oculta_header,
.pieza_oculta{
	transform:translateY(20px);
	opacity:0;
}
.tdelay_3{
	transition-delay:.3s;
}
.tdelay_6{
	transition-delay:.6s;
}
.tdelay_9{
	transition-delay:.9s;
}
.tdelay_12{
	transition-delay:1.2s;
}
.tdelay_15{
	transition-delay:1.5s;
}

header #video_header{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

header{
	text-align:center;
	margin-bottom:20px;
}


header #header_claim h1{
	font-family:"Campton Bold", "Century Gothic";
	text-transform:uppercase;
	padding-bottom:20px;
}
header #header_claim p{
	font-family:"Campton Medium", "Century Gothic";
	font-size:23px;
}
header #header_description{
	padding-top:17vh;
	font-size:0;
}

header #header_description h2{
	font-family:"Campton Light", "Century Gothic";
	font-size:25px;
	position:relative;
	padding-right:50px;
	display:inline-block;
	vertical-align:middle;
	min-height:40px;
	line-height:40px;
}

header #header_description h2:after{
	content:"";
	display:block;
	width:35px;
	height:40px;
	background:url(../img/brain.png) right center no-repeat;
	position:absolute;
	right:0;
	top:0;
}
header #header_description p{
	font-family:"Campton Medium", "Century Gothic";
	font-size:18px;
	vertical-align:middle;
	min-height:40px;
}

header #scroll_down{
	position:absolute;
	bottom:25px;
	width:100%;
	left:0;
}

header #scroll_down a{
	font-family:"Campton Book", "Century Gothic";
	font-size:10px;
	position:relative;
	padding-top:35px;
	color:#ffffff;
}
header #scroll_down a:after{
	content:"";
	display:block;
	width:100%;
	height:31px;
	background:url(../img/scroll_down.png) top center no-repeat;
	position:absolute;
	left:0;
	top:0;
}

#inteligencia{
	text-align:center;
	padding:50px 0 90px;
}

#inteligencia .slider_zone{
	padding-top:60px;
}

#inteligencia article{
	padding:190px 0 20px;
	position:relative;
}

#inteligencia article:before{
	display:block;
	position:absolute;
	top:0;
	left:50%;
	margin-left:-75px;
	width:150px;
	height:150px;
	border:2px solid;
	border-radius:100px;
	font-family:ico_panda;
	content:"";
}
#inteligencia article#next-generation:before{
	border-color:#fd9d56;
	background:url(../img/escudo.png) center no-repeat;
}

#inteligencia article#endpoint-detection:before{
	border-color:#51d4a3;
	background:url(../img/ad.png) center no-repeat;
}

#inteligencia article#malware-intelligence:before{
	border-color:#7eb8eb;
	background:url(../img/atomo.png) center no-repeat;
}

#inteligencia article h4{
	font-family:"Campton Light", "Century Gothic";
	font-size:22px;
	max-width:250px;
	margin:0 auto;
	padding-bottom:25px;
}
#inteligencia article#next-generation h4{
	color:#fd9d56;
}

#inteligencia article#endpoint-detection h4{
	color:#51d4a3;
}

#inteligencia article#malware-intelligence h4{
	color:#7eb8eb;
}

#inteligencia article p{
	font-family:"Campton Light", "Century Gothic";
	font-size:16px;
	color:#ffffff;
}
#inteligencia article p strong{
	font-family:"Campton SemiBold", "Century Gothic";
}
#inteligencia .button_zone a{
	padding:9px 40px;
}


#existen{
	background:url(../img/parallax.png) left top repeat;
	background-attachment:fixed;
	padding:60px 0;
}

#numeros{
	padding:45px 0 250px;
}

#numeros #numeros_animados{
	padding:80px 0 120px;
	position:relative;
}

#numeros #numeros_animados article{
	height:220px;
	margin-bottom:-17.5px;	
	font-size:0;
}
#numeros #numeros_animados article p{
	font-family:"Campton Book", "Century Gothic";
	font-size:15px;
	color:#ffffff;
	display:inline-block;
	vertical-align:middle;
	position:relative;	
	max-width:150px;
}

#numeros #numeros_animados article p.parrafo_grande{
	max-width:215px;
}

#numeros #numeros_animados article p:after{
	content:"";
	position:absolute;
	bottom:-15px;
	width:150px;
	height:1px;
	background-color:#cdd5db;
}

#numeros #numeros_animados article .grafico{
	display:inline-block;
	vertical-align:middle;
	width:220px;
	height:220px;
	text-align:center;
	border:1px solid #cdd5db;
	border-radius:150px;
	position:relative;
}
#numeros #numeros_animados article .grafico.percent_text:after{
	content:"%";
}

#numeros #numeros_animados article .grafico.grafico_sinborde{
	border:0;
}

#numeros #numeros_animados article .grafico .texto_grafico{
	line-height:220px;	
	font-family:"Campton Thin", "Century Gothic";
	font-size:60px;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
}
#numeros #numeros_animados article .grafico .texto_grafico.percent_text:after{
	content:"%";
}
#numeros #numeros_animados article .grafico .texto_grafico.k_text:after{
	content:"K";
}

/*animaciones linea vida */
#numeros #numeros_animados article#servidores .grafico #canvas_grafico{
	position:absolute;
	top:50%;
	left:50%;
	width:130px;
	height:98px;
	margin-top:-49px;
	margin-left:-65px;
}

#numeros #numeros_animados article#servidores .grafico #texto_servidores{
	font-family:"Campton Thin", "Century Gothic";
	font-size:9px;
	position:absolute;
	display:block;
	top:55px;
	left:75px;
	border:1px solid rgba(255,255,255,.5);
	border-radius:25px;
	width:25px;
	height:25px;
	line-height:25px;
	opacity:1;
	transition-delay:1.5s;
}

#numeros #numeros_animados article#servidores .grafico #texto_servidores:after{
	content:"";
	position:absolute;
	right:-65px;
	top:12px;
	width:60px;
	height:1px;
	background-color:rgba(255,255,255,.5);
	opacity:1;
}

#numeros #numeros_animados article#servidores.pieza_grafico_oculta .grafico #texto_servidores{
	opacity:0;
}

#numeros #numeros_animados article#categoriza .grafico #canvas_cuadricula{
	position:absolute;
	top:50%;
	left:50%;
	width:163px;
	height:130px;
	margin-left:-81px;
	margin-top:-65px;
}


#numeros #numeros_animados article#breachs .grafico #columnas_breachs{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	display:block;
	text-align:center;
}

#numeros #numeros_animados article#breachs .grafico #columnas_breachs .column_graf{
	bottom:50px;
	width: 28px;
	background-color:#525860;
	position:absolute;
}
#numeros #numeros_animados article#breachs .grafico #columnas_breachs .column_graf:nth-child(1){
	height:95px;
	left:60.5px;
}
#numeros #numeros_animados article#breachs .grafico #columnas_breachs .column_graf:nth-child(2){
	height:120px;
	left:93.5px;
}
#numeros #numeros_animados article#breachs .grafico #columnas_breachs .column_graf:nth-child(3){
	height:135px;
	left:126.5px;
	background-color:#80b8e4;
}
#numeros #numeros_animados article#breachs .grafico #columnas_breachs .column_graf:nth-child(3):before{
	content:"2016";
	font-family:"Campton Book", "Century Gothic";
	font-size:9px;
	color:#ffffff;
	position:absolute;
	top:-15px;
	left:0;
	width:100%;
	text-align:center;
	opacity:1;
	transition:all .3s;
	transition-delay:1.2s;
}

#numeros #numeros_animados article#breachs.pieza_grafico_oculta .grafico #columnas_breachs .column_graf{
	height:0;
}
#numeros #numeros_animados article#breachs.pieza_grafico_oculta .grafico #columnas_breachs .column_graf:nth-child(3):before{
	opacity:0;
}

#numeros #numeros_animados article#impacto .grafico #circle_grafico{
	width:100%;
	height:100%;
	border:none;	
	border-radius:100%;
	transform:scale(.2);
	border:1px solid #393f47;
}

#numeros #numeros_animados article#impacto.pieza_grafico_oculta .grafico #circle_grafico{
	transform:scale(1);
	transition:all .5s;
	border:1px solid #cdd5db;
}

#numeros #numeros_animados article#malware .grafico #circulo_malware{
	position:absolute;
	width:150px;
	height:150px;
	top:50%;
	left:50%;
	margin:-75px 0 0 -75px;
	background-color:#575f69;
	border-radius:100%;
}
	

#numeros #numeros_animados article#malware.pieza_grafico_oculta .grafico #circulo_malware{
	transform:scale(0);
}

#numeros #numeros_animados article#malware .grafico #circulo_malware{
	transform:scale(1);	
}


#numeros #numeros_animados article#modo-lock .grafico #canvas_relleno_inverso{
	position:absolute;
	top:50%;
	left:50%;
	width:170px;
	height:170px;
	margin-left:-85px;
	margin-top:-85px;
	border-radius:50%;	
	background-color:#575f69;
}


#numeros #numeros_animados article#amenazas .grafico #canvas_circulo_puntos{
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-95px;
	margin-left:-95px;
	width:190px;
	height:190px;
	border-radius:50%;
	transform: rotateZ(90deg);
}


#numeros #numeros_animados article#categorizado .grafico #canvas_circulo_cart{
	position:absolute;
	top:50%;
	left:50%;
	width:190px;
	height:190px;
	margin-left:-95px;
	margin-top:-95px;
	border-radius:50%;
}

#numeros .button_zone a{
	padding:9px 60px;
}


.owl-dots .owl-dot span {
	border:1px solid #c6d0db;
}
.owl-dots .owl-dot.active span, 
.owl-dots .owl-dot:hover span {
    background-color: #85aadb;
}


@media screen and ( max-width: 500px ){	
	#numeros #numeros_animados article {
		margin:0 auto 50px;
		position:relative;
		padding:250px 0 0;
		width:100%;
		height:auto;
	}
	#numeros #numeros_animados article .grafico{
		position:absolute;
		top:0;
		left:50%;
		margin-left:-110px;
	}
	#numeros #numeros_animados article p{
		text-align:center;
		width:100% !important;
		max-width:100% !important;
	}
	#numeros #numeros_animados article p:after{
		left:0;
		width:100%;
	}
}

@media screen and ( min-width: 501px ) and ( max-width: 780px ){
	
	#numeros #numeros_animados article{
		margin:0 auto 17.5px;
		position:relative;
		text-align:left;
		padding:0 0 0 250px;
		display:table;
		vertical-align:middle;
		width:465px;	
	}
	
	#numeros #numeros_animados article .grafico{
		position:absolute;
		left:0;
		top:0;
		margin:0;
	}
	#numeros #numeros_animados article p{
		text-align:left;
		display:table-cell;
		vertical-align:middle;
		width:100%;
	}
	
	#numeros #numeros_animados article p:after{
		display:none;
	}
}


@media screen and ( max-width: 780px ) {
	#linea_tiempo{
		display:none;
	}	
	#numeros #numeros_animados{
		padding: 20px 0 !important;
	}
	.contenedor{
		width:90%;
	}
	
	header{
		background:url(../img/header_movil.jpg) center no-repeat;
		background-size:100% auto;
		padding:100px 0 0;
	}
	
	header #video_header{
		display:none;
	}
	header #header_claim h1{
		font-size:30px;
	}
	
	header #header_description h2{
		display:none;
	}
	header #header_description p{
		width:100%;
		margin:0;
		padding:25px 0 0;
	}
	
}

@media screen and ( min-width: 781px ) and ( max-width: 1123px ) {
	.contenedor{
		width:90%;
	}
	#linea_tiempo{
		display:none;
	}	
	#numeros #numeros_animados{
		padding: 20px 0 !important;
	}
	#numeros #numeros_animados article{
		margin-bottom:17.5px;
	}
	#numeros #numeros_animados article:nth-child(2n){
		padding:0;
		text-align:left;
	}
	#numeros #numeros_animados article:nth-child(2n+1){
		padding:0;
		text-align:right;
	}
	#numeros #numeros_animados article p {
		max-width: 215px;
	}
	
	#numeros #numeros_animados article:nth-child(2n) p{
		margin-right: 25px;
    	text-align: right;
	}
	
	#numeros #numeros_animados article:nth-child(2n+1) p{
		margin-left: 25px;
    	text-align: left;
	}
	
	#numeros #numeros_animados article:nth-child(2n) p:after{
		right:0;
	}
	
	#numeros #numeros_animados article:nth-child(2n+1) p:after{
		left:0;
	}
}

@media screen and ( min-width: 781px ) {	
	header{
		min-height:800px;
		height:100vh;
		padding:35vh 0 0;
	}
	header h1{
		font-size:45px;
	}
	
	header #header_description p{
		text-align:left;
		border-left:1px solid #ffffff;
		margin-left:25px;
		padding-left:25px;
		display:inline-block;
		max-width:445px;
	}
	
}

@media screen and ( min-width: 1124px ) {
	#numeros #numeros_animados article:nth-child(2n+1) {
		padding-left:50%;
		text-align:left;
	}
	
	#numeros #numeros_animados article:nth-child(2n+1) .grafico{
		margin-left:25px;
	}
	#numeros #numeros_animados article:nth-child(2n+1) p{
		margin-left:25px;
		text-align:left;
	}
	#numeros #numeros_animados article:nth-child(2n+1) p:after{
		left:0;
	}
	
	#numeros #numeros_animados article:nth-child(2n) {
		padding-right:50%;
		text-align:right;
	}
	
	#numeros #numeros_animados article:nth-child(2n) .grafico{
		margin-right:25px;
	}
	#numeros #numeros_animados article:nth-child(2n) p{
		margin-right:25px;
		text-align:right;
	}
	#numeros #numeros_animados article:nth-child(2n) p:after{
		right:0;
	}
}