@font-face {
	font-family: 'Denk One';
	src: url('../fonts/DenkOne-Regular.ttf') format('truetype');
}


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

#sanmaboto1 {
    position: absolute;
    bottom: 75.5%;
    left: 28%;
    width: 7%;
}

#TTM5 {
    position: absolute;
    bottom: 46%;
    left: 68.4%;
}

}

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

				/********************************************************
								SECTION 1 SAN MARTIN
				********************************************************/

				.close {
			    background: url(../img/S1/cerrar.png) center 100%/70% no-repeat;
			    color: #FFFFFF;
			    position: absolute;
			    right: -1%;
			    text-align: center;
			    top: -5%;
			    width: 18%;
			    height: 13%;
			}

				.container {
				    position: relative;
				    max-width: 29%;
				    margin: 31px auto;
				    padding: 5%;
				}

				#menu ul, li {
				    margin: 0;
				    padding: 0;
				    list-style-type: none;
				    padding-left: 7%;
				    font-family: 'Denk One';
				    font-size: 84%;
				}

				#menu {
			    z-index: 999999999999999999999999999999999;
			    position: absolute;
			    /* background-color: grey; */
			    background: url(../img/S1/menu_sup1.png) no-repeat left;
			    padding: 0.5%;
			    width: 63%;
			    height: 2%;
			    top: 8%;
			    left: 23%;
				}

				.modalDialog > div {
				    width: 400px;
				    height: 74%;
				    position: relative;
				    margin: 9% auto;
				    padding: 5px 20px 13px 20px;
				    background: #fff;
				    background: -moz-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
			  background: -webkit-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
			  background: -o-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
				    overflow-y: scroll;
				    overflow-x: hidden;
				}


				/********************************************************
								SIDE
				********************************************************/

				#flecha {
			    position: absolute;
			    top: 39%;
			    left: -37px;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background: url(../img/S1/arrow-left.png)  no-repeat center;
			    background-size: 60px;
			    list-style: none;
			     width: 128px; 
			     height: 128px; 
				}

				#flecha:hover {
			    -moz-transform: scale(1);
			    -webkit-transform: scale(1);
			    -o-transform: scale(1);
			    -ms-transform: scale(1);
			    transform: scale(1);
			}

					/********************************************************
									SECTION 2 Columnas
					********************************************************/

					.carousel-wrapper1 {
					    position: absolute;
					    height: 68%;
					    width: 28%;
					    right: 36%;
					    top: 5%;

					}

					.carousel-wrapper1 .carousel-itema .arrow.arrow-next {
				    position: absolute;
				    left: 344px;
				  }

					#ruta {
				    position: absolute;
				    top: -3%;
				    left: -130%;
				    width: 135%;
					}

					.carousel-wrapper1 {
				    position: absolute;
				    height: 70%;
				    width: 27%;
				    right: 36%;
				    top: -3%;
				}

					#cuanto {
					    position: absolute;
					    top: 50%;
					    left: 134%;
					    width: 59%;
					}

					#avion {
				    position: absolute;
				    top: 85%;
				    left: 123%;
				    width: 18%;
					}

					#auto {
				    position: absolute;
				    top: 99%;
				    left: 124%;
				    width: 18%;
					}

					.avionposition {
				    position: absolute !important;
				    top: 83% !important;
				    left: 142% !important;
				    width: 56%;
					}

					.autoposition {
				    position: absolute !important;
				    top: 97% !important;
				    left: 143% !important;
				    width: 56% !important;
					}

						/********************************************************
									SECTION 3 Ejercito
					********************************************************/

					.carousel-wrapper {
				    position: absolute;
				    height: 22.5em;
				    width: 19em;
				    left: 12%;
				    top: -10%;
					}

					.carousel-wrapper .carousel-item .arrow.arrow-next {
				    position: absolute;
				    top: 180px;
				    left: 200px;
				   }

				   .carousel-wrapper .carousel-item .arrow.arrow-prev {
				    position: absolute;
				    left: -74px;
				    top: 178px;
				  }

					.tortas img {
				    width: 73%;
					}

					.division {
				    position: absolute;
				    top: 1%;
				    left: 38%;
				    width: 40%;
					}

					.bombonera #bombo {
				    width: 38%;
				    position: absolute;
				    top: 46%;
				    left: 9%;
					}

					.bombonera #bombotitulo {
				    position: absolute;
				    top: 44%;
				    left: 44%;
				    width: 27%;
					}

					#tortita1 {
				    position: absolute;
				    top: 5%;
				    left: 27%;
				    width: 44%;
					}


				#TTG1 {
				  position: absolute;
				  top: -12%;
				  left: 26%;
				  z-index: 999999999999999999999999999999999999999999999;
					cursor:pointer;
				}
				#TTG2 {
				    position: absolute;
				    top: 199%;
				    left: 40%;
				    cursor:pointer;
				}
				#TTG3 {
				    position: absolute;
				    top: 220%;
				    left: 33%;
				    cursor:pointer;
				}
					#TTG4 {
					    position: absolute;
					    top: 181%;
					    left: 43%;
					    cursor:pointer;
					}
				#TTG5 {
				    position: absolute;
				    top: 211%;
				    left: 4%;
				    cursor:pointer;
				}
				#TTG6 {
				    position: absolute;
				    top: 113%;
				    left: -9%;
				    cursor:pointer;
				}
					#TTG7 {
					  position: absolute;
					  top: -12%;
					  left: 26%;
					}
					
					.tamanoTorta img {
						width: 7%
					}


					#tortita1 {
				    position: absolute;
				    top: 19%;
				    left: 58%;
				    width: 70%;
				}

					#tortita2 {
				    position: absolute;
				    top: 19%;
			    left: 58%;
			    width: 70%;
					}

						#tortita3 {
				    position: absolute;
				    top: 19%;
			    left: 58%;
			    width: 70%;
					}

						#tortita4 {
				    position: absolute;
				    top: 19%;
			    left: 58%;
			    width: 70%;
					}

						#tortita5 {
				    position: absolute;
				    top: 19%;
			    left: 58%;
			    width: 70%;
					}

						#tortita6 {
				    position: absolute;
				    top: 19%;
			    left: 58%;
			    width: 70%;
					}

				#bombo1 {
				    position: absolute;
				    top: 51%;
				    left: 26%;
				    cursor: pointer;
				    width: 5%;
				}
				#bombo2 {
				    position: absolute;
				    top: 59%;
				    left: 37%;
				    cursor: pointer;
				    width: 5%;
				}

				#sectorN {
			    position: absolute;
			    left: 47%;
			    top: 56%;
			    width: 32%;
			}

			#sectorL {
			    position: absolute;
			    left: 48%;
			    top: 56%;
			    width: 31%;
			}

			.carousel-wrapper .carousel-item .arrow.arrow-infante {
			    position: absolute;
			    top: 317px;
			    left: 238px;
			    background: url("../img/S3/infantes.png") no-repeat 55%/71%;
			    width: 25% -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			}

			.carousel-wrapper .carousel-item .arrow.arrow-arti {
			    position: absolute;
			    top: 368px;
			    left: 235px;
			    background: url("../img/S3/artilleros.png") no-repeat 44%/69%;
			    width: 25% -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    width: 78%;
			}

			.carousel-wrapper .carousel-item .arrow.arrow-grana {
			    position: absolute;
			    left: 240px;
			    top: 418px;
			    background: url("../img/S3/granaderos.png") no-repeat 33%/71%;
			    width: 25% -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    width: 100%;
			    height: 18%;
			}
			#TTI1{
			    position: absolute;
			    top: 145%;
			    left: 16%;
			}


			#TTI2{
			    position: absolute;
			    top: 27%;
			    left: 57%;
			}


			#TTI3{
			    position: absolute;
			    top: 56%;
			    left: 5%;
			}

			#TTI4{
			    position: absolute;
			    top: 145%;
			    left: 77%;
				
			}
			.grafico {
			    position: absolute;
			    top: 10%;
			    left: 16%;
			}

			#TTMA1{
				position: absolute;
				top: 93%;
				left: 10%;
			}

			#TTMA2{
				position: absolute;
			    
				top: 93%;
			    left: 68%;
			}

			#TTMA3{
				position: absolute;
			    
				top: 148%;
			    left: 64%;
			}

			#TTGra1{
			    position: absolute;
			    top: 145%;
			    left: 16%;
			}


			#TTGra2{
			    position: absolute;
					
			    top: 30%;
			    left: 56%;
			}


			#TTGra3{
			    position: absolute;
			    top: 23%;
			    left: 18%;
			}

			#TTGra4{
			    position: absolute;
			    top: 82%;
			    left: 10%;
			}

						/********************************************************
										SECTION 4 Armas
						********************************************************/


					.carousel-wrapper2 {
				    position: absolute;
				    height: 24%;
				    width: 52%;
				    left: 18%;
				    top: -10px;
					}

					.estadis {
					  position: absolute;
				    left: -14%;
				    top: 247%;
				    width: 146%;
					}

					div.tooltip span img {
					    position: absolute;
					    top: -34px;
					    left: -37px;
					    z-index: 999999999999999999999999999999;
					}

					.carousel-wrapper2 .carousel-itemb .arrow.arrow-next {  
				    left: 108%;
				  }

				  #Bauto{
				  	width: 89%;
				  }

						/********************************************************
										SECTION 5 Geografia
						********************************************************/
					.montanas5 {
				    width: 80%;
				    height: auto;
				    position: absolute;
				    bottom: 8px;
				    left: 7%;
					}

					#temp img {
					    position: absolute;
					    bottom: 20%;
					    left: 77%;
					    cursor: pointer;
					    transition: opacity .5s;
					    -webkit-transition: opacity .5s;
					    -moz-transition: opacity .5s;
					    width: 12%;
					}

					#TTM1 {
					    position: absolute;
					    	bottom: 15%;
								left: 9%;
					}

					#TTM2 {
					    position: absolute;
				    bottom: 16.4%;
				    left: 15%;
					}

					#TTM3 {
					    position: absolute;
				    bottom: 16%;
				    
					    left: 16%;
					}

					#TTM4 {
					    position: absolute;
				    bottom: 26.5%;
				    left: 27%;
					}
					#TTM5 {
					    position: absolute;
				  
					    top: 37%;
				  left: 68.4%;
					}

					#TT1, #TT2, #TT3, #TT4, #TT5{
						width: 88%
					}


					/********************************************************
									SECTION 6 HOMBRE
					********************************************************/

				.hombresan {
				    position: absolute;
				    bottom: 4%;
				    left: 21%;
				    width: 29%;
				}

					a.tooltip6 span img {
					    position: absolute;
					    top: -29px;
					    left: -24px;
					    z-index: 999999999999999999999999999999;
					    WIDTH: 805%;
					}

				.carousel-wrapper3 {
			    position: absolute;
			    /* height: 0%; */
			    width: 46%;
			    left: 40%;
			    top: 455px;
				}

				#biblio {
			    position: absolute;
			    top: 47%;
			    left: 64%;
			    width: 26%;
			}

			.carousel-wrapper4 {
			    position: absolute;
			    /* height: 0%; */
			    width: 47%;
			    left: 26%;
			    top: -88px;
			}

			.carousel-wrapper3 .carousel-itemc .arrow.arrow-prev {
			    position: absolute;
			    left: 3%;
			    top: 40%;
			    background: url("../img/S3/a-l.png") 50% 50%/35% no-repeat;
			    width: 25%;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			}

			.carousel-wrapper3 .carousel-itemc .arrow.arrow-next {
			    position: absolute;
			    top: 45%;
			    left: 85%;
			    background: url("../img/S3/a-r.png") 50% 50%/35% no-repeat;
			    width: 25%;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			}

			.libros {
			    position: absolute;
			    top: -350%;
			    left: 28%;
			    width: 57%;
			}

			.mapas1 {
			    position: absolute;
			    top: 208%;
			    left: -10%;
			    width: 77%;
			}

			.carousel-wrapper5 .carousel-iteme .arrow.arrow-1 {
			    position: absolute;
			    left: 59%;
			    top: 443%;
			    background: url("../img/S5/boton1.png") center no-repeat;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background-size: 77%;
			}

			#arrowselect{
			  background: url("../img/S5/boton2.png") center no-repeat;
			  background-size: 77%;
			}

			.carousel-wrapper5 .carousel-iteme .arrow.arrow-2 {
			    position: absolute;
			    top: 483%;
			    left: 59%;
			    background: url("../img/S5/boton1.png") center no-repeat;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background-size: 77%;
			}

			.carousel-wrapper5 .carousel-iteme .arrow.arrow-3 {
			    position: absolute;
			    top: 525%;
			    left: 59%;
			    background: url("../img/S5/boton1.png") center no-repeat;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background-size: 77%;
			}

			.carousel-wrapper5 .carousel-iteme .arrow.arrow-4 {
			    position: absolute;
			    top: 568%;
			    left: 59%;
			    background: url("../img/S5/boton1.png") center no-repeat;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background-size: 77%;
			}

			.carousel-wrapper5 .carousel-iteme .arrow.arrow-5 {
			    position: absolute;
			    top: 612%;
			    left: 59%;
			    background: url("../img/S5/boton1.png") center no-repeat;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			    background-size: 77%;
			}

			#cadenaM {
			    position: absolute;
			    top: 17%;
			    left: 10%;
			    width: 17%;
			    z-index: 99;
			}

			.mapascartel {
			    position: absolute;
			    top: 289%;
			    left: 68%;
			    width: 22%;
			}


			.recursos {
			/*    position: absolute;
			    bottom: 11%;
			    z-index: 9999;
			    left: 16%;
			    width: 37%;*/
			    display: none;
			}

			.carousel-wrapper4 .carousel-itemd .arrow.arrow-prev {
			    position: absolute;
			    left: 3%;
			    top: 565%;
			    background: url("../img/S3/a-l.png") 50% 50%/35% no-repeat;
			    width: 25%;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			}

			.carousel-wrapper4 .carousel-itemd .arrow.arrow-next {
			    position: absolute;
			    top: 550%;
			    left: 90%;
			    background: url("../img/S3/a-r.png") 50% 50%/35% no-repeat;
			    width: 25%;
			    -webkit-transition: all .5s ease;
			    -moz-transition: all .5s ease;
			    -ms-transition: all .5s ease;
			    -o-transition: all .5s ease;
			    transition: all .5s ease;
			}




				/********************************************************
								MENUESSSSS
				********************************************************/

			.menu-side{
			  overflow: auto;
			}

			.menu-side1{
			  overflow: auto;
			}

			.menu-side2{
			  overflow: auto;
			}

			.menu-side3{
			  overflow: auto;
			}

			.menu-side4{
			  overflow: auto;
			}


}



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

	/********************************************************
					SECTION 1 SAN MARTIN
	********************************************************/
	
	.close {
    background: url(../img/S1/cerrar.png) center 100%/70% no-repeat;
    color: #FFFFFF;
    position: absolute;
    right: -1%;
    text-align: center;
    top: -5%;
    width: 18%;
    height: 13%;
}
	

	.onepage-pagination {
    position: absolute;
    left: -0.8%;
    top: 2%;
    z-index: 15;
    list-style: none;
    padding: 3.3%;
    background: url(../img/S1/menu_bloque1.png) center no-repeat;
    padding-top: 3%;
	}

	.container {
	    position: relative;
	    max-width: 29%;
	    margin: 31px auto;
	    padding: 5%;
	}

	#menu ul, li {
	    margin: 0;
	    padding: 0;
	    list-style-type: none;
	    padding-left: 5.5%;
	    font-family: 'Denk One';
	    font-size: 84%;
	}

	#menu {
    z-index: 999999999999999999999999999999999;
    position: absolute;
    /* background-color: grey; */
    background: url(../img/S1/menu_sup2.png) no-repeat center;
    padding: 0.5%;
    width: 50%;
    height: 4%;
    top: 8%;
    left: 26%;
	}

	.modalDialog > div {
	    width: 400px;
	    height: 74%;
	    position: relative;
	    margin: 9% auto;
	    padding: 5px 20px 13px 20px;
	    background: #fff;
	    background: -moz-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
  background: -webkit-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
  background: -o-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
	    overflow-y: scroll;
	    overflow-x: hidden;
	}

#menu a {
    display: block;
    color: white;
    font-size: 0.7em;
    margin-top: 2%;
}


	/********************************************************
					SIDE
	********************************************************/

	#flecha {
    position: absolute;
    top: 38%;
    left: -37px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background: url(../img/S1/arrow-left.png) no-repeat center;
    background-size: 55px;
    list-style: none;
    /* width: 20%; */
    /* height: 20%; */
 	}


		/********************************************************
						SECTION 2 Columnas
		********************************************************/

		.carousel-wrapper1 {
		    position: absolute;
		    height: 68%;
		    width: 28%;
		    right: 36%;
		    top: 5%;

		}

		.carousel-wrapper1 .carousel-itema .arrow.arrow-next {
	    position: absolute;
	    left: 291px;
	  }

		#ruta {
	    position: absolute;
	    top: -3%;
	    left: -130%;
	    width: 135%;
		}

		.carousel-wrapper1 {
	    position: absolute;
	    height: 70%;
	    width: 27%;
	    right: 36%;
	    top: -3%;
	}

		#cuanto {
		    position: absolute;
		    top: 42%;
		    left: 134%;
		    width: 59%;
		}

		#avion {
	    position: absolute;
	    top: 85%;
	    left: 123%;
	    width: 18%;
		}

		#auto {
	    position: absolute;
	    top: 99%;
	    left: 124%;
	    width: 18%;
		}

		.avionposition {
	    position: absolute !important;
	    top: 83% !important;
	    left: 142% !important;
	    width: 46% !important;
		}

		.autoposition {
	    position: absolute !important;
	    top: 97% !important;
	    left: 143% !important;
	    width: 46% !important;
		}

		.column img.proser {
    width: 143%;
    height: auto;
}

			/********************************************************
						SECTION 3 Ejercito
		********************************************************/

		.carousel-wrapper {
	    position: absolute;
	    height: 22.5em;
	    width: 13em;
	    left: 14%;
	    top: -11%;
		}

		.carousel-wrapper .carousel-item .arrow.arrow-next {
	    position: absolute;
	    top: 180px;
	    left: 200px;
	   }

	   .carousel-wrapper .carousel-item .arrow.arrow-prev {
	    position: absolute;
	    left: -74px;
	    top: 178px;
	    width: 25%;
	  }

		.tortas img {
	    width: 50%;
		}

		.division {
    position: absolute;
    top: 12%;
    left: 26%;
    width: 43%;
		}

		.bombonera #bombo {
	    width: 38%;
	    position: absolute;
	    top: 47%;
	    left: -6%;
		}

		.bombonera #bombotitulo {
    position: absolute;
    top: 45%;
    left: 33%;
    width: 28%;
	}

		#tortita1 {
	    position: absolute;
	    top: 5%;
	    left: 27%;
	    width: 44%;
		}


	#TTG1 {
	  position: absolute;
	  top: -17%;
	  left: 16%;
	  z-index: 999999999999999999999999999999999999999999999;
		cursor:pointer;
	}
	#TTG2 {
	    position: absolute;
	    top: 135%;
	    left: 24%;
	    cursor:pointer;
	}
	#TTG3 {
	    position: absolute;
	    top: 145%;
	    left: 17%;
	    cursor:pointer;
	}
		#TTG4 {
		    position: absolute;
		    top: 117%;
		    left: 28%;
		    cursor:pointer;
		}
	#TTG5 {
	    position: absolute;
	    top: 131%;
	    left: -1%;
	    cursor:pointer;
	}
	#TTG6 {
	    position: absolute;
	    top: 71%;
	    left: -9%;
	    cursor:pointer;
	}
		#TTG7 {
		  position: absolute;
		  top: -17%;
		  left: 16%;
		}
		
		.tamanoTorta img {
			width: 7%
		}


		#tortita1 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
	}

		#tortita2 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita3 {
	    position: absolute;
	   top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita4 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita5 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita6 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

	#bombo1 {
	    position: absolute;
    top: 50%;
    left: 11%;
	    cursor: pointer;
	    width: 5%;
	}
	#bombo2 {
	    position: absolute;
	    top: 60%;
    	left: 22%;
	    cursor: pointer;
	    width: 5%;
	}

.carousel-wrapper .carousel-item .arrow.arrow-infante {
    position: absolute;
    top: 178px;
    left: 179px;
    background: url("../img/S3/infantes.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 87%;
    width: 71%;
    height: 11%;
}
.carousel-wrapper .carousel-item .arrow.arrow-arti {
    position: absolute;
    top: 228px;
    left: 179px;
    background: url("../img/S3/artilleros.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 83%;
    height: 9%;
    width: 78%;
}

.carousel-wrapper .carousel-item .arrow.arrow-grana {
    position: absolute;
    left: 182px;
    top: 270px;
    background: url("../img/S3/granaderos.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 74%;
    height: 14%;
    width: 101%;
}

.carousel-wrapper .carousel-item .arrow {
    position: absolute;
    top: 0;
    /* display: block; */
    width: 107%;;
    height: 20%;
    -webkit-tap-highlight-color: transparent;
}

.grafico {
    position: absolute;
    top: 14%;
    left: 3%;
}

#sectorN {
    position: absolute;
    left: 35%;
    top: 57%;
    width: 32%;
}

#sectorL {
    position: absolute;
    left: 35%;
    top: 57%;
    width: 31%;
}

#TTI1{
    position: absolute;
    top: 92%;
    left: 10%;
}


#TTI2{
    position: absolute;
    top: 27%;
    left: 57%;
}


#TTI3{
    position: absolute;
    top: 56%;
    left: 1%;
}

#TTI4{
    position: absolute;
    top: 98%;
    left: 71%;
	
}

#TTMA1{
	position: absolute;
	top: 48%;
	left: 10%;
}

#TTMA2{
	position: absolute;
    
	top: 63%;
    left: 68%;
}

#TTMA3{
	position: absolute;
    
	top: 97%;
    left: 64%;
}

#TTGra1{
    position: absolute;
    top: 98%;
    left: 11%;
}


#TTGra2{
    position: absolute;
		
    top: 30%;
    left: 56%;
}


#TTGra3{
    position: absolute;
    top: 18%;
    left: 14%;
}

#TTGra4{
    position: absolute;
    top: 50%;
    left: 6%;
}

			/********************************************************
							SECTION 4 Armas
			********************************************************/


		.carousel-wrapper2 {
	    position: absolute;
	    height: 24%;
	    width: 52%;
	    left: 18%;
	    top: -10px;
		}

		.estadis {
		  position: absolute;
	    left: -14%;
	    top: 247%;
	    width: 146%;
		}

		div.tooltip span img {
		  position: absolute;
		  top: -34px;
		  left: -37px;
		  z-index: 999999999999999999999999999999;
		  width: 190%;
		}

		div#column div.tooltip span img {
    position: absolute;
    top: -34px;
    left: -37px;
    z-index: 999999999999999999999999999999;
    width: 250%;
		}

		div.tooltip6 span img {
    position: absolute;
    top: -9px;
    left: -24px;
    z-index: 999999999999999999999999999999;
    width: 673%;
		}

		.carousel-wrapper2 .carousel-itemb .arrow.arrow-next {  
	    left: 108%;
	  }

	  #Bauto{
	  	width: 89%;
	  }

	  .masgrande{
	  	width: 385% !important;
	  }

	  .nomasgrande{
	  	width: 285% !important;
	  }

			/********************************************************
							SECTION 5 Geografia
			********************************************************/
		.montanas5 {
	    width: 80%;
	    height: auto;
	    position: absolute;
	    bottom: 8px;
	    left: 7%;
		}

		#temp img {
		    position: absolute;
		    bottom: 20%;
		    left: 77%;
		    cursor: pointer;
		    transition: opacity .5s;
		    -webkit-transition: opacity .5s;
		    -moz-transition: opacity .5s;
		    width: 12%;
		}

		#TTM1 {
		    position: absolute;
		    	bottom: 15%;
					left: 9%;
		}

		#TTM2 {
		    position: absolute;
	    bottom: 16.4%;
	    left: 15%;
		}

		#TTM3 {
    position: absolute;
    bottom: 15%;
    left: 15%;
		}

		#TTM4 {
		    position: absolute;
	    bottom: 26.5%;
	    left: 27%;
		}
		#TTM5 {
		    position: absolute;
	  bottom: 52%;
	  left: 68.4%;
		}

		#TT1, #TT2, #TT3, #TT4, #TT5{
			width: 88% !important;
		}

		div.tooltip5 span img:last-child {
    position: absolute;
    top: -4px;
    left: -25px;
    z-index: 999999999999999999999999999999;
    width: 222%;
	}
		div.tooltip5 span#particular img {
    width: 150% !important;
	}



	.mapas1 {
	    position: absolute;
	    top: 211%;
	    left: -7%;
	    width: 75%;
	}

	.mapascartel {
    position: absolute;
    top: 271%;
    left: 68%;
    width: 23%;
	}
	
	.carousel-wrapper5 .carousel-iteme .arrow.arrow-1 {
    top: 393%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-2 {
    top: 423%;
}


	.carousel-wrapper5 .carousel-iteme .arrow.arrow-3 {
    top: 453%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-4 {
    top: 483%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-5 {
    top: 513%;
}
.carousel-wrapper5 .carousel-iteme .arrow {
    height: 25%;
 }

 #TT3 span img{

	width: 130% !important;
 }

		/********************************************************
						SECTION 6 HOmbre
		********************************************************/

	.hombresan {
	    position: absolute;
	    bottom: 4%;
	    left: 21%;
	    width: 27%;
	}

		a.tooltip6 span img {
		    position: absolute;
		    top: -29px;
		    left: -24px;
		    z-index: 999999999999999999999999999999;
		    WIDTH: 805%;
		}

		.carousel-wrapper3 {
    position: absolute;
    /* height: 0%; */
    width: 40%;
    left: 43%;
    top: 328px;
	}

	#biblio {
    position: absolute;
    top: 47%;
    left: 64%;
    width: 26%;
}

.carousel-wrapper4 {
    position: absolute;
    /* height: 0%; */
    width: 47%;
    left: 26%;
    top: -88px;
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-prev {
    position: absolute;
    left: 3%;
    top: 40%;
    background: url("../img/S3/a-l.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-next {
    position: absolute;
    top: 45%;
    left: 85%;
    background: url("../img/S3/a-r.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.libros {
    position: absolute;
    top: -262%;
    left: 26%;
    width: 63%;
}

.recursos {
    position: absolute;
    bottom: 11%;
    z-index: 9999;
    left: 16%;
    width: 37%;
}


.carousel-wrapper4 .carousel-itemd .arrow.arrow-prev {
    position: absolute;
    left: 3%;
    top: 386%;
    background: url("../img/S3/a-l.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.carousel-wrapper4 .carousel-itemd .arrow.arrow-next {
    position: absolute;
    top: 400%;
    left: 93%;
    background: url("../img/S3/a-r.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}



}

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

	/********************************************************
					SECTION 1 SAN MARTIN
	********************************************************/
	
	.close {
    background: url(../img/S1/cerrar.png) center 100%/70% no-repeat;
    color: #FFFFFF;
    position: absolute;
    right: -1%;
    text-align: center;
    top: -5%;
    width: 18%;
    height: 13%;
}
	

	.onepage-pagination {
    position: absolute;
    left: -0.8%;
    top: 2%;
    z-index: 15;
    list-style: none;
    padding: 3.3%;
    background: url(../img/S1/menu_bloque1.png) center no-repeat;
    padding-top: 3%;
	}

	.container {
	    position: relative;
	    max-width: 29%;
	    margin: 31px auto;
	    padding: 5%;
	}

	#menu ul, li {
	    margin: 0;
	    padding: 0;
	    list-style-type: none;
	    padding-left: 5.5%;
	    font-family: 'Denk One';
	    font-size: 62%;
	}

	#menu {
    z-index: 999999999999999999999999999999999;
    position: absolute;
    /* background-color: grey; */
    background: url(../img/S1/menu_sup2.png) no-repeat center;
    padding: 0.5%;
    width: 50%;
    height: 4%;
    top: 8%;
    left: 26%;
	}

	.modalDialog > div {
	    width: 120px;
	    height: 74%;
	    position: relative;
	    margin: 9% auto;
	    padding: 5px 20px 13px 20px;
	    background: #fff;
	    background: -moz-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
  background: -webkit-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
  background: -o-linear-gradient(rgba(34, 92, 183, 0.44), rgba(34, 92, 183, 0.82));
	    overflow-y: scroll;
	    overflow-x: hidden;
	}

#menu a {
    display: block;
    color: white;
    font-size: 0.7em !important;
    margin-top: -3%;
}


	/********************************************************
					SIDE
	********************************************************/

	#flecha {
    position: absolute;
    top: 38%;
    left: -37px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background: url(../img/S1/arrow-left.png) no-repeat center;
    background-size: 55px;
    list-style: none;
    /* width: 20%; */
    /* height: 20%; */
 	}


		/********************************************************
						SECTION 2 Columnas
		********************************************************/

		.carousel-wrapper1 {
		    position: absolute;
		    height: 68%;
		    width: 28%;
		    right: 36%;
		    top: 5%;

		}

		.carousel-wrapper1 .carousel-itema .arrow.arrow-next {
	    position: absolute;
	    left: 180px;
	  }

		#ruta {
	    position: absolute;
	    top: -3%;
	    left: -116%;
	    width: 135%;
		}

		.carousel-wrapper1 {
	    position: absolute;
	    height: 70%;
	    width: 30%;
	    right: 39%;
	    top: -3%;
	}

		#cuanto {
		    position: absolute;
		    top: 32%;
		    left: 137%;
		    width: 59%;
		}

		#avion {
	    position: absolute;
	    top: 65%;
	    left: 128%;
	    width: 18%;
		}

		#auto {
	    position: absolute;
	    top: 79%;
	    left: 128%;
	    width: 18%;
		}

		.avionposition {
	    position: absolute !important;
	    top: 64% !important;
	    left: 149% !important;
	    width: 46% !important;
		}

		.autoposition {
	    position: absolute !important;
	    top: 78% !important;
	    left: 146% !important;
	    width: 46% !important;
		}

		.column img.proser {
    width: 223%;
    height: auto;
}

			/********************************************************
						SECTION 3 Ejercito
		********************************************************/

		.carousel-wrapper {
	    position: absolute;
	    height: 22.5em;
	    width: 9em;
	    left: 10%;
	    top: -12%;
		}

		.carousel-wrapper .carousel-item .arrow.arrow-next {
	    position: absolute;
	    top: 180px;
	    left: 200px;
	   }

	   .carousel-wrapper .carousel-item .arrow.arrow-prev {
	    position: absolute;
	    left: -74px;
	    top: 178px;
	    width: 25%;
	  }

		.tortas img {
	    width: 50%;
		}

		.division {
    position: absolute;
    top: 12%;
    left: 26%;
    width: 43%;
		}

		.bombonera #bombo {
	    width: 38%;
	    position: absolute;
	    top: 56%;
	    left: -6%;
		}

		.bombonera #bombotitulo {
    position: absolute;
    top: 52%;
    left: 33%;
    width: 28%;
	}

		#tortita1 {
	    position: absolute;
	    top: 5%;
	    left: 27%;
	    width: 44%;
		}


	#TTG1 {
	  position: absolute;
	  top: -17%;
	  left: 16%;
	  z-index: 999999999999999999999999999999999999999999999;
		cursor:pointer;
	}
	#TTG2 {
	    position: absolute;
	    top: 109%;
	    left: 32%;
	    cursor:pointer;
	}
	#TTG3 {
	    position: absolute;
	    top: 122%;
	    left: 26%;
	    cursor:pointer;
	}
		#TTG4 {
		    position: absolute;
		    top: 99%;
		    left: 35%;
		    cursor:pointer;
		}
	#TTG5 {
	    position: absolute;
	    top: 105%;
	    left: -1%;
	    cursor:pointer;
	}
	#TTG6 {
	    position: absolute;
	    top: 61%;
	    left: -9%;
	    cursor:pointer;
	}
		#TTG7 {
		  position: absolute;
		  top: -17%;
		  left: 16%;
		}
		
		.tamanoTorta img {
			width: 7%
		}


		#tortita1 {
	    position: absolute;
	    top: 63%;
    
	    left: 54%;
	    width: 60%;
	}

		#tortita2 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita3 {
	    position: absolute;
	   top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita4 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita5 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

			#tortita6 {
	    position: absolute;
	    top: 60%;
    left: 38%;
	    width: 60%;
		}

	#bombo1 {
	    position: absolute;
    
	    top: 60%;
    left: 11%;
	    cursor: pointer;
	    width: 5%;
	}
	#bombo2 {
	    position: absolute;
	    top: 68%;
    	left: 22%;
	    cursor: pointer;
	    width: 5%;
	}

.carousel-wrapper .carousel-item .arrow.arrow-infante {
    position: absolute;
    top: 178px;
    left: 119px;
    background: url("../img/S3/infantes.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 71%;
    width: 71%;
    height: 11%;
}
.carousel-wrapper .carousel-item .arrow.arrow-arti {
    position: absolute;
    top: 212px;
    left: 124px;
    background: url("../img/S3/artilleros.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 83%;
    height: 9%;
    width: 58%;
}

.carousel-wrapper .carousel-item .arrow.arrow-grana {
    position: absolute;
    left: 117px;
    top: 235px;
    background: url("../img/S3/granaderos.png") no-repeat;
    width: 25% 
 -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    background-size: 65%;
    height: 14%;
    width: 101%;
}

.carousel-wrapper .carousel-item .arrow {
    position: absolute;
    top: 0;
    /* display: block; */
    width: 107%;;
    height: 20%;
    -webkit-tap-highlight-color: transparent;
}

.grafico {
    position: absolute;
    top: 6%;
    left: -17%;
    width: 84%;
}

#sectorN {
    position: absolute;
    left: 35%;
    top: 62%;
    width: 32%;
}

#sectorL {
    position: absolute;
    left: 35%;
    top: 62%;
    width: 31%;
}

#TTI1{
    position: absolute;
    top: 92%;
    left: 10%;
}


#TTI2{
    position: absolute;
    top: 27%;
    left: 57%;
}


#TTI3{
    position: absolute;
    top: 56%;
    left: 1%;
}

#TTI4{
    position: absolute;
    top: 98%;
    left: 71%;
	
}

#TTMA1{
	position: absolute;
	top: 48%;
	left: 10%;
}

#TTMA2{
	position: absolute;
    
	top: 63%;
    left: 68%;
}

#TTMA3{
	position: absolute;
    
	top: 97%;
    left: 64%;
}

#TTGra1{
    position: absolute;
    top: 98%;
    left: 11%;
}


#TTGra2{
    position: absolute;
		
    top: 30%;
    left: 56%;
}


#TTGra3{
    position: absolute;
    top: 18%;
    left: 14%;
}

#TTGra4{
    position: absolute;
    top: 50%;
    left: 6%;
}

			/********************************************************
							SECTION 4 Armas
			********************************************************/


		.carousel-wrapper2 {
	    position: absolute;
	    height: 24%;
	    width: 64%;
	    left: 9%;
	    top: -10px;
		}

		.estadis {
		  position: absolute;
	    left: -14%;
	    top: 247%;
	    width: 146%;
		}

		div.tooltip span img {
		  position: absolute;
		  top: -34px;
		  left: -37px;
		  z-index: 999999999999999999999999999999;
		  width: 190%;
		}

		div#column div.tooltip span img {
    position: absolute;
    top: -34px;
    left: -37px;
    z-index: 999999999999999999999999999999;
    width: 250%;
		}

		div.tooltip6 span img {
    position: absolute;
    top: -9px;
    left: -24px;
    z-index: 999999999999999999999999999999;
    width: 673%;
		}

		.carousel-wrapper2 .carousel-itemb .arrow.arrow-next {  
	    left: 99%;
	  }

	  #Bauto{
	  	width: 89%;
	  }

	  .masgrande{
	  	width: 385% !important;
	  }

	  .nomasgrande{
	  	width: 285% !important;
	  }

			/********************************************************
							SECTION 5 Geografia
			********************************************************/
		.montanas5 {
	    width: 80%;
	    height: auto;
	    position: absolute;
	    bottom: 8px;
	    left: 7%;
		}

		#temp img {
		    position: absolute;
		    bottom: 20%;
		    left: 77%;
		    cursor: pointer;
		    transition: opacity .5s;
		    -webkit-transition: opacity .5s;
		    -moz-transition: opacity .5s;
		    width: 12%;
		}

		#TTM1 {
		    position: absolute;
		    	
		    bottom: 12%;
					
		    left: 10%;
		}

		#TTM2 {
		    position: absolute;
	    bottom: 16.4%;
	    left: 15%;
		}

		#TTM3 {
    position: absolute;
    bottom: 12%;
    left: 15%;
		}

		#TTM4 {
		    position: absolute;
	    
		    bottom: 21.5%;
	    left: 27%;
		}
		#TTM5 {
		    position: absolute;
	  
		    bottom: 48%;
	  
		    left: 67.4%;
		}

		#TT1, #TT2, #TT3, #TT4, #TT5{
			width: 47% !important;
		}

		div.tooltip5 span img:last-child {
    position: absolute;
    top: -4px;
    left: -25px;
    z-index: 999999999999999999999999999999;
    width: 222%;
	}
		div.tooltip5 span#particular img {
    width: 150% !important;
	}



	.mapas1 {
	    position: absolute;
	    top: 211%;
	    left: -7%;
	    width: 75%;
	}

	.mapascartel {
    position: absolute;
    top: 241%;
    left: 68%;
    width: 23%;
	}
	
	.carousel-wrapper5 .carousel-iteme .arrow.arrow-1 {
    top: 311%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-2 {
    top: 332%;
}


	.carousel-wrapper5 .carousel-iteme .arrow.arrow-3 {
    top: 353%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-4 {
    top: 374%;
}

	.carousel-wrapper5 .carousel-iteme .arrow.arrow-5 {
    top: 393%;
}
.carousel-wrapper5 .carousel-iteme .arrow {
    height: 25%;
 }

 #TT3 span img{

	width: 130% !important;
 }

		/********************************************************
						SECTION 6 HOmbre
		********************************************************/

	.hombresan {
	    position: absolute;
	    bottom: 4%;
	    left: 21%;
	    width: 27%;
	}

		a.tooltip6 span img {
		    position: absolute;
		    top: -29px;
		    left: -24px;
		    z-index: 999999999999999999999999999999;
		    WIDTH: 805%;
		}

		.carousel-wrapper3 {
    position: absolute;
    /* height: 0%; */
    width: 40%;
    left: 43%;
    top: 300px;
	}

	#biblio {
    position: absolute;
    top: 47%;
    left: 64%;
    width: 26%;
}

.carousel-wrapper4 {
    position: absolute;
    /* height: 0%; */
    width: 47%;
    left: 26%;
    top: -88px;
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-prev {
    position: absolute;
    left: 0;
    top: -93px;
    background: url("../img/S3/a-l.png") 100  no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-next {
    position: absolute;
    top: -90px;
    left: 190px;
    background: url("../img/S3/a-r.png") 100  no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.libros {
    position: absolute;
    top: -262%;
    left: 26%;
    width: 63%;
}

.recursos {
    position: absolute;
    bottom: 11%;
    z-index: 9999;
    left: 16%;
    width: 37%;
}


.carousel-wrapper4 .carousel-itemd .arrow.arrow-prev {
    position: absolute;
    left: 3%;
    top: 296%;
    background: url("../img/S3/a-l.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.carousel-wrapper4 .carousel-itemd .arrow.arrow-next {
    position: absolute;
    top: 280%;
    left: 93%;
    background: url("../img/S3/a-r.png") 50% 50%/35% no-repeat;
    width: 25%;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

#sanmaboto1 {
    position: absolute;
    bottom: 64.5%;
    left: 28%;
    width: 7%;
}


}