@font-face {
  font-family: 'Roboto';
  src: url('../fonts/Roboto-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Denk One';
  src: url('../fonts/DenkOne-Regular.ttf') format('truetype');
}

html{
	overflow-y:hidden;
	overflow-x:hidden;
}

body,html{
	height: 100%
}

body,p{
	margin: 0;
	font-family: 'Roboto', sans-serif;
	color: #fff;
}

h1{
	font-family: 'Denk One';
	font-size: 2em;
}



h2{
  text-transform: uppercase;
}

section,div.main{
	height: 100%;
}

.clear{
	clear: both;
}

br {
   display: block;
   line-height:22px;
}

/********************************************************

					MENU  SECTION1

********************************************************/
#menu{
    z-index: 9999;
    position: absolute;
    background: url(../img/S1/menu_sup.png) no-repeat center;
    padding: 0.5%;
    width: 66%;
    height: 3%;
    top: 6%;
    left: 19%;
}
#menu ul,li{
	margin: 0;
	padding: 0;
	list-style-type: none;
  padding-left: 7%;
  font-family: 'Denk One';
  font-size: 112%;
}

#menu li{
	display: inline-block;
}
#menu a{
	display: block;
	color: white;
}

#menu a.normal {
  text-decoration: none !important;
  font-size: 1.2em !important;
  text-transform: uppercase;
}
/********************************************************

				SECTION 1 SAN MARTIN

********************************************************/
#section1{
	background: url(../img/fondosection1a.jpg) center no-repeat !important;
	background-size: cover !important;
	position: relative !important;
	overflow: hidden !important;
}
.parallax div img{
	width: 100%;
}
.container {
  position: relative;
  max-width: 600px;
  margin: 0 auto;
  padding: 5%;
}
.scene {
  padding: 0;
  margin: 0;
}
ul img{
	width: 100%;
}
#san_martin {
	padding-top: 10%;
	z-index: 10;
	width: 90%;
}
#montanas{
	top:20% !important;
	left:-125% !important;
/*  	transform:scale(3.5) !important;
	-webkit-transform:scale(3.5) !important;
	-moz-transform:scale(3.5) !important;*/
	width: 350%;
}
#nodo_izq{
	
	left: -100% !important;
}
#nodo_der{
	right: -100% !important;
}


/********************************************************

				SECTION 2 CRUCE COLUMNAS

********************************************************/
#section2{
	background: url(../img/S2/fondo.jpg) center no-repeat;
	background-size: cover !important;
	overflow: hidden !important;
	width: 100%;
}

.column img.proser {
	width: 125%;
	height: auto;
}

.column img.proser1 {
	width: 125%;
	height: auto;
}

#ruta{
    position: absolute;
    top: -14%;
    left: -162%;
    width: 162%;
}

#cuanto{
    position: absolute;
    top: 44%;
    left: 146%;
    width: 70%;

}

#avion{
position: absolute;
    top: 80%;
    left: 135%;
    width: 20%;
}

#auto{
    position: absolute;
    top: 94%;
    left: 136%;
    width: 20%;
}

.avionposition{
	position: absolute !important;
	top: 79% !important;
	left: 159% !important;
}

.autoposition{
	position: absolute !important;
	top: 93% !important;
	left: 159% !important;
}




/********************************************************

				SECTION 3  INFANTERIA

********************************************************/
#section3{
	background: url(../img/fondosection2a.jpg) center no-repeat;
	background-size: cover !important;
	overflow: hidden !important;
	width: 100%;
}

.articulo_contenedor{
	position: relative;
	width: 100%;
	height: 100%;
}

#militar img#artillero{
  position: absolute;
    
  top: 17%;
    
  left: -14%;
    
  width: 87%;
}

#militar img#infante{
	  position: absolute;
    top: 13%;
    left: 16%;
    width: 74%;
}

#militar img#granadero{
	  position: absolute;
    top: 13%;
    left: 16%;
    width: 51%;
}

.bombonera #bombo {
	width: 38%;
	position:absolute;
  top: 51%;
  left: -4%;
}

.bombonera #bombotitulo {
	position:absolute;
    top: 47%;
    left: 33%;
    width: 27%;
}

#sectorL {
    position: absolute;
    left: 35%;
    top: 60%;
    width: 31%;
}

#sectorN {
    position: absolute;
    left: 35%;
    top: 60%;
    width: 32%;
}


.grafico{
	position: absolute;
	top: 15%;
	left: 3%;
}

#columnaD{
	float: right;
	position: relative;
	width: 50%;
	height: 100%;
}

.division{
	position: absolute;
    top: 13%;
    left: 31%;
}


.bajas{
		position: absolute;
    bottom: 2%;
    left: 8%;
    width: 80%;
	}

#TTGra1{
    position: absolute;
    top: 105%;
    left: 16%;
}


#TTGra2{
    position: absolute;
		top: 20%;
    left: 50%;
}


#TTGra3{
    position: absolute;
    top: 12%;
    left: 23%;
}

#TTGra4{
    position: absolute;
    top: 52%;
    left: 10%;
}

#TTI1{
    position: absolute;
    top: 105%;
    left: 16%;
}


#TTI2{
    position: absolute;
    top: 27%;
    left: 60%;
}


#TTI3{
    position: absolute;
    top: 36%;
    left: 5%;
}

#TTI4{
    position: absolute;
    top:105%;
    left: 77%;
	
}

#TTG1 {
    position: absolute;
    top: 2%;
    left: 47%;
    z-index: 999999999999999999999999999999999999999999999;
    cursor: pointer;
}

#TTG2 {
    position: absolute;
    top: 280%;
    left: 58%;
    cursor: pointer;
}

#TTG3 {
    position: absolute;
    top: 307%;
    left: 46%;
    cursor: pointer;
}
#TTG4 {
    position: absolute;
    top: 259%;
    left: 62%;
    cursor: pointer;
}

#TTG5 {
    position: absolute;
    top: 291%;
    left: 9%;
    cursor: pointer;
}

#TTG6 {
    position: absolute;
    top: 157%;
    left: -7%;
    cursor: pointer;
}

#TTG7 {
    position: absolute;
    top: 2%;
    left: 47%;
    z-index: 0;
}


#TTMA1{
	position: absolute;
	top: 59%;
	left: 10%;
}

#TTMA2{
	position: absolute;
    top: 73%;
    left: 68%;
}

#TTMA3{
	position: absolute;
    top: 102%;
    left: 64%;
}

#bombo1{
		position: absolute;
    top: 55%;
    left: 13%;
    cursor: pointer;
}

#bombo2{
		position: absolute;
    top: 64%;
    left: 25%;
    cursor:pointer;
  }

  #bombo3{
		position: absolute;
    top: 64%;
    left: 25%;
    cursor:pointer;
  }

#tortita1 {
    position: absolute;
    top: 89%;
    left: 79%;
}

#tortita2 {
    position: absolute;
    top: 83%;
    left: 79%;
}

#tortita3 {
    position: absolute;
    top: 91%;
    left: 78.5%;
}
#tortita4 {
    position: absolute;
    top: 92%;
    left: 78%;
}

#tortita5 {
    position: absolute;
    top: 94%;
    left: 78%;
}

#tortita6 {
    position: absolute;
    top: 92%;
    left: 79%;
}

/*#tortita7 {
    position: absolute;
    top: 92%;
    left: 79%;
}*/


/********************************************************

				SECTION 4 ARMAMENTO

********************************************************/
#section4{
	background-size: cover !important;
	overflow: hidden !important;
	background: url(../img/fondosection4.jpg) center no-repeat;
	width: 100%;
}

#section4 div #proser1 img{
	width: 90%;
	margin-bottom: 1%;
}

.estadis{
    position: absolute;
    left: -45%;
    top: 259%;
    width: 203%;
}

#cannon{
	width:988px;
	height:482px;
	margin:2% auto;
	background: url(../img/S4/cannon.png) left center;
}

#CTP1{
	position: absolute;
    top: 88%;
    left: 79%;
}

#CTP2{
	Position: absolute;
  top: 178%;
  left: 24%;
}

#CTP3{
	position: absolute;
  top: 126%;
  left: 61%;
}


#FTP1{
	position: absolute;
    top: 103%;
    left: 93%;
}

#FTP2{
	Position: absolute;
    top: 108%;
    left: 45%;
}

#FTP3{
	position: absolute;
    top: 158%;
    left: 48%;
}

#PTP1{
	position: absolute;
    top: 78%;
    left: 89%;
}

#PTP2{
    Position: absolute;
    top: 95%;
    left: 41%;
}

#PTP3{
    position: absolute;
    top: 121%;
    left: 70%;
}

#STP1{
	position: absolute;
    top: 131%;
    left: 95%;
}

#STP2{
    Position: absolute;
    top: 110%;
    left: 27%;
}

#STP3{
    position: absolute;
    top: 118%;
    left: 36%;
}

#STP4{
    position: absolute;
		top: 130%;
    left: 53%;
}


.texto1{
	background: url(../img/S1/text1.png) left no-repeat;
	margin-top: 5%;
	width: 95%;
	height: auto;
}

.texto1 p{
    margin-left: 12%;
    font-size: 12px;
    padding: 8% 7% 7% 6%;
}

.texto2{
    background: url(../img/S1/text2.png) left no-repeat;
    margin-top: 7%;
    width: 95%;
    height: auto;
}

.texto3{
  background: url(../img/S1/text3.png) left no-repeat;
  margin-top: 7%;
  width: 95%;
  height: auto;
  position: relative;
  PADDING-TOP: 0.1%;
}


.texto2 p, .texto3 p{
    margin-left: 12%;
    font-size: 12px;
    padding: 4% 4% 4% 6%;
}

.lateralsanma{
	width: 65%;
	height: auto;
	margin-left: 13%;
}
/********************************************************

				TOOLTIP 5 GEOGRAFIA

********************************************************/
div.tooltip5 {
	outline:none; 
  cursor: pointer;
}

div.tooltip5 span {
    z-index:9999;
    display:none;
    margin-top:-28px;
    margin-left:30px;
    width:auto;
    line-height:16px;
}

div.tooltip5 span img{
	position: absolute;
  top: -9px;
  left: -24px;
  z-index: 999999999999999999999999999999;
}
/********************************************************

				SECTION 5 GEOGRAFIA

********************************************************/
#section5{
	background: url(../img/S5/FondoGeo.jpg) center no-repeat;
	width: 100%;
	background-size: cover !important;
	overflow: hidden !important;
}

.montanas5{
    width: 75%;
    height: auto;
    position: absolute;
    bottom: 38px;
    left: 11%;
}

#TTM1{
	position: absolute;
	bottom: 16%;
	left: 13%;
}

/*#TTM2{
  position: absolute;
  bottom: 20%;
  left: 20%;
}*/

#TTM3 {
    position: absolute;
    bottom: 16%;
    left: 19.5%;
}

#TTM4{
  position: absolute;
    
  bottom: 23.5%;
    left: 30.5%;
}

#TTM5{
	position: absolute;
  
	bottom: 51%;
  left: 69.4%;
}

#cadenaM{
    position: absolute;
    top: 17%;
    left: 10%;
    width: 17%;
    z-index: 99;
}

#temp img {
	position: absolute;
  bottom: 21%;
  left: 78%;
  cursor: pointer;
  transition:opacity .5s;
  -webkit-transition:opacity .5s;
  -moz-transition:opacity .5s;
  width: 10%;
}

#noche{
	position: absolute;
    bottom: 33.5%;
    left: 82.5%;
  z-index: 999999999999999;
}

#noche img{
	width: 80%;
}

.temp img{
	width:80%;
}

/********************************************************

				SECTION 6 HOMBRE

********************************************************/

#section6{
	background: url(../img/S6/HombreFondo.jpg) center no-repeat;
	width: 100%;
	background-size: cover !important;
	overflow: hidden !important;
}

.hombresan{
    position: absolute;
    bottom: 8%;
    left: 22%;
    width: 27.5%;
}

#sanma{
	position: relative;
	width: 50%;
	height: 100%;
}

#sanmaboto1{
	position: absolute;
		
	bottom: 79.5%;
    left: 28%;
    width: 7%;
   
}

#sanmaboto2 {
    position: absolute;
    bottom: 39%;
    left: 43%;
    width: 7%;
}

#sanmaboto3{
	position: absolute;
    bottom: 54%;
    left: 28%;
  width: 7%;
 
}

#sanmaboto4{
	position: absolute;
	    bottom: 46%;
    left: 34%;
  width: 7%;

}

#sanmaboto5{
	position: absolute;
    bottom: 24%;
    left: 26%;
	width: 7%;
 
}

.salud{
	position: absolute;
    bottom: 12%;
    left: 46%;
    width: 35%;
}

#carro6{
	position: absolute;
	top: 0;
	right: 0;
}

#libros{
    position: absolute;
    bottom: -2%;
    left: 54%;
    width: 27%;
}

/********************************************************

				TOOLTIP6 HOMBRE

********************************************************/
div.tooltip6 {
	outline:none; 
    cursor: pointer;
}

div.tooltip6 #ciento{
	width: 100%;
}

div.tooltip6 span {
    z-index:9999;
    display:none;
    margin-top:-28px;
    margin-left:30px;
    width:auto;
    line-height:16px;
}

div.tooltip6 span img{
	position: absolute;
  top: -9px;
  left: -24px;
  z-index: 999999999999999999999999999999;
}

/*******************************************************
				VENTANAS MODALES STYLE
*******************************************************/
.modalDialog {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.4);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
  display: block;
}

.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}

.modalDialog > div {
	width: 500px;
	height: 80%;
	position: relative;
	margin: 6% 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;

}

.close {
  background: url(../img/S1/cerrar.png) center 100% no-repeat;
  color: #FFFFFF;
  position: absolute;
  right: 2%;
  text-align: center;
  top: 1%;
  width: 13%;
  height: 6%;
}

.modalDialog h2,h3,h4,h5{
    margin: 5% 12% 2% 12% !important;
`
}

.modalDialog a{
	text-decoration: underline !important;
	margin-left: 2%;
}

.modalDialog p{
	font-size: 15px;
	margin:5px 12%;
}

/*******************************************************
				TOOLTIPS STYLE
*******************************************************/
div.tooltip {
	outline:none; 
	cursor: pointer;
}

div.tooltip span {
    z-index:9999;
    display:none;
    margin-top:-28px;
    margin-left:30px;
    width:auto;
    line-height:16px;
}

div.tooltip span img{
	position: absolute;
  top: -34px;
  left: -37px;
  z-index: 999999999999999999999999999999;
}

/*******************************************************
				Tortas
*******************************************************/
	.tortas{
		position: absolute;
		top: -10%;
		left: -6%;
	}

	.tortas img{
		width: 100%;
	}
/*******************************************************
					NAVEGACION
*******************************************************/
.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%;
}

.onepage-pagination li {
  padding: 0;
  text-align: center;
}
.onepage-pagination li a {
    padding: 10px;
    width: 14px;
    height: 11px;
    display: block;
    background: url(../img/S1/boton_01.png) no-repeat center;
    margin-top: 7px;
}

.onepage-pagination li:nth-of-type(2) a {
	background: url(../img/S1/boton_02.png) no-repeat center !important;
}

.onepage-pagination li:nth-of-type(3) a {
	background: url(../img/S1/boton_03.png) no-repeat center !important;
}

.onepage-pagination li:nth-of-type(4) a {
	background: url(../img/S1/boton_04.png) no-repeat center !important;
}

.onepage-pagination li:nth-of-type(5) a {
	background: url(../img/S1/boton_05.png) no-repeat center !important;
}

.onepage-pagination li:nth-of-type(6) a {
	background: url(../img/S1/boton_06.png) no-repeat center !important;
}

/*******************************************************
					SIDE MENU
*******************************************************/
#flecha{
    position: absolute;
    top: 45%;
    left: -64px;
    -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;
    list-style: none;
    width: 128px;
    height: 128px;
}

#flecha:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}


.menu{
	overflow-x:hidden;
	position: relative;
	right:0;
}

.menu-open{
	right: 231px;
}

.menu-open .menu-side{
	right: 0;
}

.menu-side,
.menu {
-webkit-transition: right .2s ease;
-moz-transition: right .2s ease;
-ms-transition: right .2s ease;
-o-transition: right .2s ease;
transition: right .2s ease;
}

.menu-side{
	position:absolute;
	top: 0;
	right:-250px;
	width: 230px;
	height: 100%;
    padding: 10px 10px 10px 60px;
    background-image: url(../img/S1/barra.png);
	background-color: #CDCDCD;
	border-right: 1px solid black;
	color: #fff;
	-webkit-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	-moz-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	z-index: 99999999999999999999999999999999999999999999;
}

/******************************************************
				SIDE-MENU STYLE GENERAL
*****************************************************/


.menu1-color {
    position: absolute;
    bottom: 0;
    left: 55px;
    height: 12%;
    width: 82%;
    background: #Ec01a8;
    padding-top: 5%;
}

.menu1-color p {
    padding-left: 10px;
    padding-top: 7px;
    font-size: 11.5px;
}

 .menu1-color img{
 	width: 10%;
 	height: auto;
 }

.recursos {
    position: absolute;
    top: -13px;
    z-index: 9999;
    left: 0;
    width: 55%;
}

.recuboton{
  width: 9%;
}


/*******************************************************
					SIDE MENU 1
*******************************************************/

.menu1{
	overflow-x:hidden;
	position: relative;
	right:0;
}

.menu-open1{
	right: 231px;
}

.menu-open1 .menu-side1{
	right: 0;
}

.menu-side1,
.menu1 {
	transition: right 0.2s ease;
	-webkit-transition: right 0.2s ease;
	-moz-transition: right 0.2s ease;
}

.menu-side1{
	position:absolute;
	top: 0;
	right:-250px;
	width: 230px;
	height: 100%;
  padding: 10px 10px 10px 60px;
	background-image: url(../img/S1/barra.png);
	background-color: #CDCDCD;
	border-right: 1px solid black;
	color: #fff;
	-webkit-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	z-index: 99999999999999999;
}

/*******************************************************
					SIDE MENU 2
*******************************************************/

.menu2{
	overflow-x:hidden;
	position: relative;
	right:0;
}

.menu-open2{
	right: 231px;
}

.menu-open2 .menu-side2{
	right: 0;
}

.menu-side2,
.menu2 {
-webkit-transition: right .2s ease;
-moz-transition: right .2s ease;
-ms-transition: right .2s ease;
-o-transition: right .2s ease;
transition: right .2s ease;
}

.menu-side2{
	position:absolute;
	top: 0;
	right:-250px;
	width: 230px;
	height: 100%;
    padding: 10px 10px 10px 60px;
	background-image: url(../img/S1/barra.png);
	background-color: #CDCDCD;
	border-right: 1px solid black;
	color: #fff;
	-webkit-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	z-index: 99999999999999999;
}

/*******************************************************
					SIDE MENU 3
*******************************************************/

.menu3{
	overflow-x:hidden;
	position: relative;
	right:0;
}

.menu-open3{
	right: 231px;
}

.menu-open3 .menu-side3{
	right: 0;
}

.menu-side3,
.menu3 {
-webkit-transition: right .2s ease;
-moz-transition: right .2s ease;
-ms-transition: right .2s ease;
-o-transition: right .2s ease;
transition: right .2s ease;
}

.menu-side3{
	position:absolute;
	top: 0;
	right:-250px;
	width: 230px;
	height: 100%;
  padding: 10px 10px 10px 60px;
	background-image: url(../img/S1/barra.png);
	background-color: #CDCDCD;
	border-right: 1px solid black;
	color: #fff;
	-webkit-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	z-index: 99999999999999999;
}
/*******************************************************
					SIDE MENU 4
*******************************************************/

.menu4{
	overflow-x:hidden;
	position: relative;
	right:0;
}

.menu-open4{
	right: 231px;
}

.menu-open4 .menu-side4{
	right: 0;
}

.menu-side4,
.menu4 {
-webkit-transition: right .2s ease;
-moz-transition: right .2s ease;
-ms-transition: right .2s ease;
-o-transition: right .2s ease;
transition: right .2s ease;
}

.menu-side4{
	position:absolute;
	top: 0;
	right:-250px;
	width: 230px;
	height: 100%;
    padding: 10px 10px 10px 60px;
	background-image: url(../img/S1/barra.png);
	background-color: #CDCDCD;
	border-right: 1px solid black;
	color: #fff;
	-webkit-box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	box-shadow: 0 0 50px 2px rgba(0,0,0,.5);
	z-index: 99999999999999999;
}

	/*******************************************************
						CAROUSEL 
	*******************************************************/

.carousel-wrapper {
    position: absolute;
    height: 35.5em;
    width: 22em;
    left: 11%;
    top: 0%;
}

.carousel-wrapper .carousel-item {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper .carousel-item .arrow {
    position: absolute;
    top: 0;
    /* display: block; */
    width: 62%;
    height: 12%;
    -webkit-tap-highlight-color: transparent;
}

.carousel-wrapper .carousel-item .arrow.arrow-grana {
    position: absolute;
    left: 290px;
    top: 437px;
    background: url("../img/S3/granaderos.png")27%/66% 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;
    width: 100%;
    height: 18%;
}

.carousel-wrapper .carousel-item .arrow.arrow-grana:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

.carousel-wrapper .carousel-item .arrow.arrow-arti {
    position: absolute;
    top: 385px;
    left: 298px;
    background: url("../img/S3/artilleros.png") 28%/71% 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;
    width: 78%;
}

.carousel-wrapper .carousel-item .arrow.arrow-arti:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

.carousel-wrapper .carousel-item .arrow.arrow-infante {
  position: absolute;
  top: 323px;
  left: 298px;
  background: url("../img/S3/infantes.png") 40%/76%  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-wrapper .carousel-item .arrow.arrow-infante:hover{
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}


.carousel-wrapper [id^="target-item"] {
  display: none;
}

.carousel-wrapper .item-1 {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper *:target ~ .item-1 {
  opacity: 0;
}

.carousel-wrapper #target-item-1:target ~ .item-1 {
  opacity: 1;
}

.carousel-wrapper #target-item-2:target ~ .item-2,
.carousel-wrapper #target-item-3:target ~ .item-3 {
  z-index: 3;
  opacity: 1;
}

.selec{
  opacity: .3;
  cursor:pointer;
}


/*******************************************************
					CAROUSEL 1
*******************************************************/

.carousel-wrapper1 {
  position: absolute;
  height:600px;
  width:400px;
  right: 38%;
  top: 4%;
}

.carousel-wrapper1 .carousel-itema {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper1 .carousel-itema .arrow {
  position: absolute;
  top: 0;
  display: block;
  width: 50px;
  height: 100px;
  -webkit-tap-highlight-color: transparent;
}

.carousel-wrapper1 .carousel-itema .arrow.arrow-prev {
  position: absolute;
  left: -25px;
  top: 150px;
  background: url("../img/S3/a-l.png") 50%/60% 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-wrapper1 .carousel-itema .arrow.arrow-prev:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

.carousel-wrapper1 .carousel-itema .arrow.arrow-next {
  position: absolute;
  top: 148px;
  left: 390px;
  background: url("../img/S3/a-r.png") 50%/60% 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-wrapper1 .carousel-itema .arrow.arrow-next:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}


.carousel-wrapper1 [id^="target-item"] {
  display: none;
}

.carousel-wrapper1 .item-1a {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper1 *:target ~ .item-1a {
  opacity: 0;
}

.carousel-wrapper1 #target-item-1a:target ~ .item-1a {
  opacity: 1;
}

.carousel-wrapper1 #target-item-2a:target ~ .item-2a,
.carousel-wrapper1 #target-item-3a:target ~ .item-3a, 
.carousel-wrapper1 #target-item-4a:target ~ .item-4a,
.carousel-wrapper1 #target-item-5a:target ~ .item-5a,
.carousel-wrapper1 #target-item-6a:target ~ .item-6a {
  z-index: 3;
  opacity: 1;
}
/*******************************************************
					CAROUSEL 2
*******************************************************/

.carousel-wrapper2 {
    position: absolute;
    height: 20%;
    width: 47%;
    left: 22%;
    top: 0;
}

.carousel-wrapper2 .carousel-itemb {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper2 .carousel-itemb .arrow {
  position: absolute;
  top: 0;
  /*display: block;*/
  width: 50px;
  height: 100px;
  -webkit-tap-highlight-color: transparent;
}

.carousel-wrapper2 .carousel-itemb .arrow.arrow-prev {
    position: absolute;
    left: -11%;
    top: 105%;
    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-wrapper2 .carousel-itemb .arrow.arrow-prev:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

.carousel-wrapper2 .carousel-itemb .arrow.arrow-next {
    position: absolute;
    top: 106%;
    left: 110%;
    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;
}
.carousel-wrapper2 .carousel-itemb .arrow.arrow-next:hover{
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}


.carousel-wrapper2 [id^="target-item"] {
  display: none;
}

.carousel-wrapper2 .item-1b {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper2 *:target ~ .item-1b {
  opacity: 0;
}

.carousel-wrapper2 #target-item-1b:target ~ .item-1b {
  opacity: 1;
}

.carousel-wrapper2 #target-item-2b:target ~ .item-2b,
.carousel-wrapper2 #target-item-3b:target ~ .item-3b,
.carousel-wrapper2 #target-item-4b:target ~ .item-4b {
  z-index: 3;
  opacity: 1;
}

/*******************************************************
                    CAROUSEL 3
*******************************************************/

.carousel-wrapper3 {
    position: absolute;
    /* height: 0%; */
    width: 42%;
    left: 42%;
    top: 520px;
}

.carousel-wrapper3 .carousel-itemc {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper3 .carousel-itemc .arrow {
  position: absolute;
  top: 0;
  /*display: block;*/
  width: 50px;
  height: 100px;
  -webkit-tap-highlight-color: transparent;
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-prev {
    position: absolute;
    left: 3%;
    top: 417%;
    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-prev:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.carousel-wrapper3 .carousel-itemc .arrow.arrow-next {
    position: absolute;
    top: 435%;
    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;
}
.carousel-wrapper3 .carousel-itemc .arrow.arrow-next:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}


.carousel-wrapper3 [id^="target-item"] {
  display: none;
}

.carousel-wrapper3 .item-1c {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper3 *:target ~ .item-1c {
  opacity: 0;
}

.carousel-wrapper3 #target-item-1c:target ~ .item-1c {
  opacity: 1;
}

.carousel-wrapper3 #target-item-2c:target ~ .item-2c,
.carousel-wrapper3 #target-item-3c:target ~ .item-3c,
.carousel-wrapper3 #target-item-4c:target ~ .item-4c,
.carousel-wrapper3 #target-item-5c:target ~ .item-5c,
.carousel-wrapper3 #target-item-6c:target ~ .item-6c,
.carousel-wrapper3 #target-item-7c:target ~ .item-7c,
.carousel-wrapper3 #target-item-8c:target ~ .item-8c,
.carousel-wrapper3 #target-item-9c:target ~ .item-9c,
.carousel-wrapper3 #target-item-10c:target ~ .item-10c,
.carousel-wrapper3 #target-item-11c:target ~ .item-11c,
.carousel-wrapper3 #target-item-12c:target ~ .item-12c,
.carousel-wrapper3 #target-item-13c:target ~ .item-13c {
  z-index: 3;
  opacity: 1;
}


.libros{
    position: absolute;
    top: -230%;
    left: 23%;
    width: 70%;
}

#biblio {
    position: absolute;
    top: 43%;
    left: 61%;
    width: 28%;
}



/*******************************************************
                    CAROUSEL 4
*******************************************************/

.carousel-wrapper4 {
    position: absolute;
    /* height: 0%; */
    width: 48%;
    left: 26%;
    top: -77px;
}

.carousel-wrapper4 .carousel-itemd {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper4 .carousel-itemd .arrow {
  position: absolute;
  top: 0;
  /*display: block;*/
  width: 50px;
  height: 100px;
  -webkit-tap-highlight-color: transparent;
}

.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-prev:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.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;
}
.carousel-wrapper4 .carousel-itemd .arrow.arrow-next:hover{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}


.carousel-wrapper4 [id^="target-item"] {
  display: none;
}

.carousel-wrapper4 .item-1d {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper4 *:target ~ .item-1d {
  opacity: 0;
}

.carousel-wrapper4 #target-item-1d:target ~ .item-1d {
  opacity: 1;
}

.carousel-wrapper4 #target-item-2d:target ~ .item-2d,
.carousel-wrapper4 #target-item-3d:target ~ .item-3d,
.carousel-wrapper4 #target-item-4d:target ~ .item-4d,
.carousel-wrapper4 #target-item-5d:target ~ .item-5d,
.carousel-wrapper4 #target-item-6d:target ~ .item-6d,
.carousel-wrapper4 #target-item-7d:target ~ .item-7d,
.carousel-wrapper4 #target-item-8d:target ~ .item-8d,
.carousel-wrapper4 #target-item-9d:target ~ .item-9d,
.carousel-wrapper4 #target-item-10d:target ~ .item-10d {
  z-index: 3;
  opacity: 1;
}

.mapas {
    position: absolute;
    top: 230%;
    left: 23%;
    width: 79%;
}

#paises {
    position: absolute;
    top: 3%;
    left: 61%;
    width: 20%;
    z-index: 999;
}

/*******************************************************
                    CAROUSEL 5
*******************************************************/

.carousel-wrapper5 {
    position: absolute;
    /* height: 0%; */
    width: 48%;
    left: 26%;
    top: -77px;
}

.carousel-wrapper5 .carousel-iteme {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 25px 50px;
  opacity: 0;
  transition: all 1.1s ease-in-out;
}

.carousel-wrapper5 .carousel-iteme .arrow {
  position: absolute;
  top: 0;
  /*display: block;*/
    width: 4%;
    height: 58%;
  -webkit-tap-highlight-color: transparent;
}

.carousel-wrapper5 .carousel-iteme .arrow.arrow-1 {
    position: absolute;
    left: 59%;
    top: 643%;
    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: 703%;
    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: 763%;
    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: 823%;
    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: 883%;
    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 [id^="target-item"] {
  display: none;
}

.carousel-wrapper5 .item-1e {
  z-index: 2;
  opacity: 1;
}

.carousel-wrapper5 *:target ~ .item-1e {
  opacity: 0;
}

.carousel-wrapper5 #target-item-1e:target ~ .item-1e {
  opacity: 1;
}

.carousel-wrapper5 #target-item-2e:target ~ .item-2e,
.carousel-wrapper5 #target-item-3e:target ~ .item-3e,
.carousel-wrapper5 #target-item-4e:target ~ .item-4e,
.carousel-wrapper5 #target-item-5e:target ~ .item-5e {
  z-index: 3;
  opacity: 1;
}


.mapas1 {
    position: absolute;
    top: 342%;
    left: -7%;
    width: 75%;
}

.mapascartel {
    position: absolute;
    top: 401%;
    left: 68%;
    width: 23%;
}

