/*MSN*/
.Msn H4 { color: #003E7E;}
.Msn H2 { color: #003E7E;}
.Msn BLOCKQUOTE P { color: #003E7E;}
.Msn {
	background: #FFFFFF url(../../images/work/msn/bg1@1x.jpg) no-repeat center top;
	background-image: -webkit-image-set (
            url("../../images/work/msn/bg1@1x.jpg") 1x,
            url("../../images/work/msn/bg1@2x.jpg") 2x );
}
.Msn SECTION { width: 100%; float: left; transition: none;}
.Msn2 {
	height: auto;
	background: url(../../images/work/msn/bg2@1x.jpg) no-repeat center /*184px*/60px;
	background-image: -webkit-image-set (
            url("../../images/work/msn/bg2@1x.jpg") 1x,
            url("../../images/work/msn/bg2@2x.jpg") 2x );
}
.Msn3 { height: auto; margin-bottom:3%;}
.Msn4 { height: auto; background: url(../../images/work/msn/bg3@1x.jpg) no-repeat center 49px; }
/**/
.Msn4 FIGURE IMG { float: left;}/* nuevo: funcion de banderitas*/
/**/
.Msn2 .Block2 { width: 100%; float: left;}
.Msn2 .Block2 FIGURE { width: 18%; position: absolute; margin-top: -115px; max-width: 190px; right: 28%; }
/**/
.Msn2 .Block3 .LeftCol { width: 65%; float: left;}
.Msn2 .Block3 .RightCol { width: 32%; float: left; margin-top:15%; margin-left:3%;}
/**/
.Msn3 .Block4 { clear: left; float: none;}
.Msn3 .Fig1, .Msn3 .Fig2 { width: 44%; float: left;}
.Msn3 .Fig1 { margin-left: 5%;}
.Msn3 .Fig2 { margin-left: 1%;}
/**/
.Msn4 .Block5 .LeftCol { float: left; width: 37%;}
.Msn4 .Block5 .RightCol { float: right; width: 60%;}
.Msn4 .Block5 .RightCol-2 { display: none;}
.Msn4 .Video {height: 0; padding-bottom: 56.25%; position: relative;}
.Msn4 IFRAME {height: 100%; left: 0; position: absolute; top: 0; width: 100%;}
/**/
.Msn4 .Block6 { width: 53.7037037037037%; float: left; margin-left: 5%; margin-top: 130px;}
/**/
.Panoramica { height: 551px; width: 100%; float: left; position: relative;}
.Panoramica IMG { float: left;}
.scroll-pane { width: 100%; height: 551px; overflow: auto;}
.scroll-pane .Figs { width: 1920px;}
.jspCap {display: block;}
.jspTrack { background: transparent;}
.jspDrag { background: transparent;}
.jspHorizontalBar { bottom: 50%; background: transparent; height: 36px;}
.jspHorizontalBar .jspCap {width: 24%; height: 100%;}
.jspArrow.jspArrowLeft, .jspArrow.jspArrowLeft.jspDisabled { background: transparent url(../../images/work/msn/arrows.png) no-repeat 0px 0px; }
.jspArrow.jspArrowRight, .jspArrow.jspArrowRight.jspDisabled { background: transparent url(../../images/work/msn/arrows.png) no-repeat 0px -50px; }
.Panoramica .MsnPanel { width: 100%; height: 90px; background: url(../../images/work/msn/panoramica-panel@1x.png) no-repeat center top; position: absolute; left: 0; bottom: 0px; z-index: 100 }
/**/
.Panoramica2 { 
	background: #FFFFFF url(../../images/work/msn/imagen-microsoft-separada@1x.jpg) no-repeat center top;
	background-image: -webkit-image-set (
            url("../../images/work/msn/imagen-microsoft-separada@1x.jpg") 1x,
            url("../../images/work/msn/imagen-microsoft-separada@2x.jpg") 2x );
	height: 462px;
	width: 100%;
	float: left;
	position: relative;
}
/**/
.Msn4 .Block7 .LeftCol { width: 45%; float: left; margin-top: 9%;}
.Msn4 .Block7 .RightCol { width: 55%; float: left; position: relative; margin-top: 45px;}
.Msn4 .Block7 .Fig1 { position: absolute; top: 45px; max-width: 146px; right: 0;}
.Msn4 .Block7 .Fig2 { width: 76.94915254237288%; margin-left: 11.01694915254237%;}
.Msn4 .Block7 LI IMG { width: 8.64406779661017%; position: absolute; /*nuevo*/max-width: 51px;}
/**/
#arg { left: 45.25423728813559%; top: 450px;}
#bol { left: 44.74576271186441%; top: 295px;}
#chi { left: 32.88135593220339%; top: 469px;}
#col { left: 34.57627118644068%; top: 122px;}
#cos { left: 15.08474576271186%; top: 90px;}
#dom { left: 40.50847457627119%; top: -5px;}
#ecu { left: 23.05084745762712%; top: 162px;}
#sal { left: 8.64406779661017%; top: 54px;}
#gua { left: 6.10169491525424%; top: 11px;}
#hon { left: 19.15254237288136%; top: 11px;}
#nic { left: 22.03389830508475%; top: 55px;}
#pan { left: 25.76271186440678%; top: 92px;}
#par { left: 55.42372881355932%; top: 344px;}
#per { left: 28.13559322033898%; top: 247px;}
#uru { left: 58.8135593220339%; top: 428px;}
#ven { left: 43.38983050847458%; top: 75px;}

@media screen and (max-width: 1030px) {
    .jspHorizontalBar .jspCap { width: 5%;}
	.Msn SECTION.Msn2 { height: auto;}
	.Msn SECTION.Msn3 { height: auto; padding-bottom: 20px;}
	.Msn SECTION.Msn4 { height: auto;}
	.Msn2 .Block3 { clear: both;}
	.Msn3 .Fig2 { margin-left:2%;}
	.Msn4 .Block6 { width: 57%;}
	#arg {top: 410px;}
	#bol {top: 255px;}
	#chi {top: 429px;}
	#col {top: 122px;}
	#cos {top: 90px;}
	#dom {top: -5px;}
	#ecu {top: 162px;}
	#sal {top: 54px;}
	#gua {top: 11px;}
	#hon {top: 11px;}
	#nic {top: 55px;}
	#pan {top: 92px;}
	#par {top: 304px;}
	#per {top: 227px;}
	#uru {top: 388px;}
	#ven {top: 75px;}
}

@media screen and (max-width: 1009px) {
    .Msn SECTION.Msn2 { background-position: center 140px;}
    .Msn2 .Block2 FIGURE { margin-top: -5px;}
	.Msn2 .Block2, .Msn2 .Block3, .Msn2 .Block5 { clear: both;}
	.Msn4 .Block6 { width: 64%; margin-left: 3%;margin-top: 150px; padding-bottom: 20px;}
	.Msn2 .Block3 .LeftCol { width: 52%;}
	.Msn2 .Block3 .RightCol {width: 45%;}
	.Panoramica2 { background-size: 1280px; height: 308px; margin:3% 0;}
}

@media screen and (max-width: 959px) {
    .Msn SECTION.Msn2 { background-position: center 110px;}
}

@media screen and (max-width: 879px) {
    .Msn3 .Block4 { margin-top: 0px;}
	.Msn4 .Block6 { margin-left: 3%; margin-top: 170px; padding-bottom: 20px; width: 60%;}
	#arg {top: 400px;}
	#bol {top: 245px;}
	#chi {top: 419px;}
	#col {top: 112px;}
	#cos {top: 80px;}
	#dom {top: -15px;}
	#ecu {top: 152px;}
	#sal {top: 44px;}
	#gua {top: 1px;}
	#hon {top: 1px;}
	#nic {top: 45px;}
	#pan {top: 82px;}
	#par {top: 294px;}
	#per {top: 217px;}
	#uru {top: 378px;}
	#ven {top: 65px;}
}

@media screen and (max-width: 850px) {
    #arg {top: 390px;}
	#bol {top: 235px;}
	#chi {top: 409px;}
	#col {top: 102px;}
	#cos {top: 70px;}
	#dom {top: -25px;}
	#ecu {top: 142px;}
	#sal {top: 34px;}
	#gua {top: -11px;}
	#hon {top: -11px;}
	#nic {top: 35px;}
	#pan {top: 72px;}
	#par {top: 284px;}
	#per {top: 207px;}
	#uru {top: 368px;}
	#ven {top: 55px;}
}

@media screen and (max-width: 800px) {
    #arg {top: 370px;}
	#bol {top: 225px;}
	#chi {top: 389px;}
	#col {top: 172px;}
	#cos {top: 60px;}
	#dom {top: -35px;}
	#ecu {top: 132px;}
	#sal {top: 24px;}
	#gua {top: -21px;}
	#hon {top: -21px;}
	#nic {top: 25px;}
	#pan {top: 62px;}
	#par {top: 274px;}
	#per {top: 197px;}
	#uru {top: 348px;}
	#ven {top: 45px;}
}

@media screen and (max-width: 770px) {
    #ecu { top: 112px;}
	#col { top: 152px;}
	#per { top: 187px;}
	#bol { top: 205px;}
	#par { top: 254px;}
	#uru { top: 318px;}
	#arg { top: 330px;}
	#chi { top: 360px;}
}

@media screen and (max-width: 700px) {
    .Msn { background: #FFFFFF url(../../images/work/msn/bg1-tablet@1x.jpg) no-repeat center 0; background-image: -webkit-image-set ( url(../../images/work/msn/bg1-tablet@1x.jpg) 1x, url(../../images/work/msn/bg1-tablet@1x.jpg) 2x ); }
	.Msn2 .Block2 {padding-bottom: 20px;}
	.Msn2 .Block2 H3 { width: 100%; margin-left: 0; float: none}
	.Msn2 .Block2 FIGURE { width: 50%; margin: 0 auto; position: relative; right: auto;}
	.Msn2 .Block3 .LeftCol { width: 100%; margin-left: 0; clear: both;}
	.Msn2 .Block3 .RightCol { margin: 3% 0 0 0; clear: both; width:100%; }
	.Msn SECTION.Msn3 { padding-bottom: 20px;}
	.Msn3 .Fig1, .Msn3 .Fig2 { width: 100%; margin-left: 0; margin-right: 0; }
	.Msn3 .Fig1 { margin-bottom: 3%;}
	.Msn4 .Block5 .LeftCol { width:100%; margin:0px; float:none;}
	.Msn4 .Block5 .RightCol { display: none;}
	.Msn4 .Block5 .RightCol-2 { width: 100%; margin-left: 0; float: none; display: block;}
	.Msn4 .Block7 .LeftCol { float: none; width: 100%; margin-left: 0; margin-top:20px;}
	.Msn4 .Block7 .RightCol { float: none; width: 100%; margin-top: 50px;}
	#Banderas { top: 80px; position: relative}
	.Msn SECTION.Msn2, .Msn4 { background: none;}
	.Panoramica { display: none}
	.Panoramica2 { background-size: 1024px; height: 246px; margin:6% 0;}
}

@media screen and (max-width: 500px) {
	.Panoramica2 { background-size: 720px; height: 173px;}
}

@media screen and (max-width: 450px) {
    .Msn { background: #FFFFFF url(../../images/work/msn/bg1-mobile@1x.jpg) no-repeat center 0; background-image: -webkit-image-set ( url(../../images/work/msn/bg1-mobile@1x.jpg) 1x, url(../../images/work/msn/bg1-mobile@1x.jpg) 2x ); }
	#Banderas { top: 40px}
	.Msn4 .Block7 LI IMG { height: auto}
	#chi { top: 260px;}
	#arg { top: 230px;}
	#uru { top: 218px;}
	#par { top: 154px;}
	#bol { top: 125px;}
	#per { top: 107px;}
	#col { top: 72px;}
	#ecu { top: 52px;}
	#pan {top: 12px;}
	#sal {top: 4px;}
	#nic {top: 5px;}
}