html,body {font-weight: 300;margin:0;padding:0;font-size:16px; overflow-x: hidden;color: #454f5c;}
img {border:0;}
h1,h2,h3,h4,h5,th {margin:0;padding:0; }
.contenedor {max-width:1190px;margin-left:auto;margin-right:auto;box-sizing:border-box;text-align:center;}
main *,.main * {transition:transform .5s, opacity .5s, border .5s;}
.pieza_oculta{	transform:translateY(20px);	opacity:0;}
.tdelay_3{	transition-delay:.3s;}
.tdelay_6{	transition-delay:.6s;}
.tdelay_9{	transition-delay:.9s;}

#header_section{	text-align:center;background-image:url("../img/header_back.jpg"); background-attachment:fixed;background-repeat:no-repeat;background-size:cover; }
#header_section {position: relative; color: #ffffff; padding: 8em 0 6.3em; }
#header_section .contenedor {position: relative; z-index: 2;font-weight: 400; text-align: left; padding-top: 40px;}
#header_section .product_name{ font-size: 1.24em; margin: 1.4em 0 0.2em;}
#header_section .product_name .icon-ic-adaptive{ font-size: 2.8em; position: relative; top: 18px; left: -15px;}
#header_section .product_name .name{ position: relative; left: -25px;}
#header_section .back_opacity{ background-color:#2dbc89;opacity:0.85; position: absolute; top: 0; bottom: 25px; left: 0; right: 0; z-index: 1;}
#header_section h1{ font-weight: 700; font-size: 3em; width: 54%;  padding-top: 0.47em; position: relative; font-weight: 400;}
#header_section p.tdelay_6{ width: 69%; margin: 3em 0 3.3em; font-size: 1.25em; line-height: 1.4em; min-height: 2.8em;}
#header_section  .button_zone a{ color:#ffffff; background-color: #fd9d56; letter-spacing: 0.09em;    border-radius: 25px;    display: inline-block;    font-weight: 400;    font-size: 0.9em;    margin-right: 6em;    padding: 16px 0;    text-align: center;    width: 300px;}
.button_zone a span {    text-decoration: underline;}

.svgicon{ font-size: 3.5em;}
#ep .icon-ico-endpoint-b2b,#sm .icon-ico-systems-management-b2b,#fusion .icon-ico-fusion-b2b,#email .image .icon-ico-email-b2b,#aether .icon-ico-aether-b2b{ font-size: 6.5em; color: #72dda3; left: -20px;}

#stories{ margin:4em auto 6em;}
.resources_header{border-bottom:1px solid #9f9d9f;padding-bottom:2.5em;font-weight: 700;margin:2.5em auto;}
.resources_header h2{text-align:left;font-weight:normal;font-size:1.5em;color:#1c1b20}
.resources_header .viewall{text-align:right;display:block;margin-top:-25px;font-weight:normal;font-size:0.875em;color:#fd9d56}

.storie{ display: inline-block; width: 380px; text-align: left;vertical-align: top; margin-right: 0.8em;margin-bottom:2em;}
#datasheet1 .image{background-image: url("../img/datasheet1.jpg");}
#datasheet2 .image{background-image: url("../img/datasheet2.jpg");}
#datasheet3 .image{background-image: url("../img/datasheet3.jpg");}
#whitepaper1 .image{background-image: url("../img/whitepaper1.jpg");}
#whitepaper2 .image{background-image: url("../img/whitepaper2.jpg");}
#whitepaper3 .image{background-image: url("../img/whitepaper3.jpg");}
#pandalabs1{ width:780px; margin-bottom:1.8em;}
#pandalabs2{margin-bottom: 1.8em;}
#pandalabs1 .image{background-image: url("../img/pandalabs1.jpg");width: 780px;}
#pandalabs2 .image{background-image: url("../img/pandalabs2.jpg");}
#goverment .image{background-image: url("../img/goverment.jpg");}
#aeronautics .image{background-image: url("../img/aeronautics.jpg");}
#retail .image{background-image: url("../img/retail.jpg");}
#construction .image{background-image: url("../img/construction.jpg");}
.storie .image{ background: url("../img/services.jpg") no-repeat ;  width: 380px;height: 224px;background-size:102%; position: relative;  transition: all .5s;}
.storie:not(.selected) .image:hover{background-size:100%;}
.storie .image div{ background-color: rgba(0,0,0,0.5); width: 100%; height: 100%;opacity:0;}
.storie .image a{ position: absolute;    top: 50%; margin-top: -2.3em; border-radius: 2em;color: #ffffff; border: 2px solid #ffffff;padding: 0.92em 3.2em;font-weight: 400; font-size: 0.75em; letter-spacing: 0.09em; left: 50%; margin-left: -6.65em; opacity:0;}
.storie .image a:hover{background-color:#fff;color:inherit;}
.storie p{ width: 96%; line-height: 1.4em; }
.storie .subtitle{ font-size: 1.25em; color:#1fa4fb;font-weight: 400; margin-top: 0.8em;}
#education .subtitle{color: #72dda3;}
#goverment .subtitle{color: #1fa4fb;}
#services .subtitle{color: #0098a6;}
#aeronautics .subtitle{color: #856ca6;}
#construction .subtitle{color: #1fa4fb;}
#retail .subtitle{color: #0098a6;}
.storie a{ color: #6dacde;margin: 1em 0; display: block;}
.storie h4{ color: #101010;font-weight: 700;font-weight: normal; font-size: 1.25em; margin: 0.4em 0 0.7em; letter-spacing: 0.015em;}
.storie.video{width:100%;display:none;text-align:center;}
.storie.video .image{background-image: url("../img/video1.jpg");width:781px;height:437px;display:inline-block;margin-right:3em;}
.storie.video .introtxt{display:inline-block;max-width:350px;vertical-align:top;text-align:left;}
.storie.video.selected{display:inherit;}
#video0 .image{background-image: url("../img/video0.jpg");}
#video2 .image{background-image: url("../img/video2.jpg");}
#video3 .image{background-image: url("../img/video3.jpg");}
#video4 .image{background-image: url("../img/video4.jpg");}
#video5 .image{background-image: url("../img/video5.jpg");}
.storie.video .subtitle{margin-top:0;margin-bottom:2.5em;}
.storie.video h4{margin-bottom:1.7em;}
.storie.video a{background: url("../img/play_button_XL.png") center center no-repeat rgba(255,255,255,0.1);width:80px;height:80px;padding:0;border-radius:4em;margin-top:-40px;margin-left:-40px;}
.thumbnails{clear:both;text-align:left;padding-bottom:3em;}
.storie.thumbvideo{width:201px;margin-right:1.8em}
.storie.thumbvideo .image{background-image: url("../img/thumbvideo1.jpg");width:201px;height:114px;}
#thumbvideo2 .image{background-image: url("../img/thumbvideo2.jpg");}
#thumbvideo3 .image{background-image: url("../img/thumbvideo3.jpg");}
#thumbvideo4 .image{background-image: url("../img/thumbvideo4.jpg");}
#thumbvideo5 .image{background-image: url("../img/thumbvideo5.jpg");}
#thumbvideo6 .image{background-image: url("../img/thumbvideo6.jpg");}
#thumbvideo7 .image{background-image: url("../img/thumbvideo7.jpg");}
#thumbvideo8 .image{background-image: url("../img/thumbvideo8.jpg");}
#thumbvideo9 .image{background-image: url("../img/thumbvideo9.jpg");}
#thumbvideo10 .image{background-image: url("../img/thumbvideo10.jpg");}
.storie.thumbvideo h4{font-weight: 400;font-size:1em;margin-top:0.8em;}
.storie.thumbvideo a{background: url("../img/play_button.png") center center no-repeat rgba(255,255,255,0.1);width:50px;height:50px;padding:0;border-radius:3em;margin-top:-25px;margin-left:-25px;}
.storie.thumbvideo a:hover{ background-color: transparent;}
.storie.thumbvideo.selected .image a {background:rgba(118,177,224,0.8);width:100%;height:100%;padding:0;margin:0;border-radius:0;border:0;display:block !important;top:0;left:0; opacity: 1;}
.storie.thumbvideo.selected .image a:hover{cursor:default;}


@media screen and ( max-width: 1200px ){	
	#header_section .contenedor { padding-left: 30px;}
	#header_section  h1 { width: 70%;}
	#stories .contenedor{padding-left: 30px;padding-right:30px}
	.storie {    display: block; margin: 4em auto 0;}
	.storie p {    width: 100%;}
	.storie.video {display:inherit;}
	.storie.video .image{width:560px;height:315px;margin-right:2em;}
	.storie.video .subtitle{margin-bottom:0;}
	.storie.video h4 {margin:0.4em 0 0.7em;}
	.thumbnails{display:none;}
}
@media screen and ( max-width: 1023px ){	
	#header_section p.tdelay_6 { width: 95%;}
	.resources_header{margin:5em auto 2.5em; padding: 0 1em 2.5em;}
	.storie.video{width:380px}
	.storie.video .image{width:380px;height:224px;}
	.storie.video .subtitle{margin-top:0.8em;}
	.storie.video .introtxt{max-width:inherit;}
	#pandalabs1{width:380px;}
	#pandalabs1 .image{width:inherit;background-size:cover;}
}
@media screen and ( max-width: 900px ){	
	#header_section h1 { width: 96%;}
}
@media screen and ( max-width: 800px ){	
	.storie .image,#education .image,#goverment .image,#services .image,#aeronautics .image  ,#it .image  {  display: none;}
	#pandalabs1,#pandalabs1 .image{width:auto}
	.storie{ margin-left: 1em; width: 90%;}
	#it { width: auto;}
}
@media screen and ( max-width: 640px ){	
	#header_section .button_zone a { margin: 0 auto;}
	#header_section .button_zone{text-align: center;}
		#header_section .button_zone {	margin-left: -30px;}
}

@media screen and ( max-width: 600px ){	
	#header_section h1 {    width: 93%; font-size: 2.4em;}
	.storie.video{width:100%}
	.storie.video .image{width:90%;height:auto;}
	.storie.video .introtxt{max-width:95%;}
}
@media screen and ( max-width: 400px ){		
	#stories .contenedor{padding-left:10px;padding-right:10px}
}
@media screen and ( max-width: 350px ){	
	#header_section h1 {    font-size: 2em;}
}