@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: 'Myriad-Pro';
	src:url(../fonts/MYRIADPROREGULAR.eot);/* IE */  
	src: local('MYRIADPROREGULAR'), url(../fonts/MYRIADPROREGULAR.ttf) format('truetype'); /* non-IE */
	src: local('MYRIADPROREGULAR'), url(../fonts/MYRIADPROREGULAR.woff) format('woff'); /* Modern Browsers */
}

.animar
{
  animation-duration: 1s;
    animation-name: aumentar;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  -webkit-animation-name: aumentar;
  -webkit-animation-iteration-count: infinite;
}

@keyframes aumentar{
  50% { transform: scale(1.1);}
  100% {transform: scale(1);}
}

@-webkit-keyframes aumentar{
  50% { transform: scale(1.1);}
  100% {transform: scale(1);}
}

.animarPared
{
  animation-duration: 1s;
    animation-name: aumentar;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 1s;
  -webkit-animation-name: aumentar;
  -webkit-animation-iteration-count: infinite;
}

@keyframes aumentar{
  50% { transform: scale(1.03);}
  100% {transform: scale(1);}
}

@-webkit-keyframes aumentar{
  50% { transform: scale(1.03);}
  100% {transform: scale(1);}
}

.cajasTextArea{
	position:absolute; 
	width:246px;
	height:60px;
	background: #FFF;
	border-radius: 10px;
	font-size: 17pt;
	resize: none;
	outline: 0;
	display: none;
}

.cajaDrag{
	background: #009245;
	  width: 252px;
  height: 50px;
  left: 1076px;
	position: absolute;
}

.cajaDrop{
	border:dashed;
	border-radius: 10px;
	width: 252px;
	height: 50px;
	position: absolute;
}

.textoCaja{
	font-family: Myriad-Pro, sans-serif;
	font-size: 19pt;
	color:#FFF;
	text-align: center;
	margin-top: 10px;
}

.nucleo{
	background: url(../img/S_G05_U03_L01_03_01_dropNucleo.png) no-repeat;
	background-size: 100%;
	  width: 82px;
  height: 82px;
  position: absolute;
  top: 484px;
  left: 586px;
  z-index: 4;
}

#golgiVegetal{
	background: url(../img/S_G05_U03_L01_03_01_dropGolgi1.png) no-repeat;
	background-size: 100%;
	  width: 80px;
  height: 51px;
  position: absolute;
    top: 420px;
  left: 401px;
  z-index:5;
}

#reticuloEndo1{
	background: url(../img/S_G05_U03_L01_03_01_DROPENDO1.png)no-repeat;
	background-size: 100%;
	  width: 77px;
  height: 69px;
  position: absolute;
    top: 369px;
  left: 612px;
  z-index:5;
}

#reticuloEndo2{
	background: url(../img/S_G05_U03_L01_03_01_DROPENDO2.png)no-repeat;
	background-size: 100%;
	  width: 88px;
  height: 48px;
  position: absolute;
    top: 425px;
  left: 599px;
  z-index:5;
}

.vacuola{
	background: url(../img/S_G05_U03_L01_03_01_VACUOLA.png) no-repeat;
	background-size: 100%;
	  width: 104px;
  height: 128px;
  position: absolute;
  top: 368px;
  left: 496px;
  z-index:5;
}

#mitocondriaAzul5{
  background: url(../img/S_G05_U03_L01_03_01_dropMitocondriaAzul.png) no-repeat;
  background-size: 100%;
    width: 42px;
  height: 46px;
  position: absolute;
    top: 335px;
  left: 406px;
  z-index: 5;
}

#mitocondriaAzul6{
  background: url(../img/S_G05_U03_L01_03_01_dropMitocondriaAzul.png) no-repeat;
  background-size: 100%;
    width: 40px;
  height: 46px;
  position: absolute;
   top: 330px;
  left: 643px;
  z-index: 5;
}

#mitocondriaAzul7{
  background: url(../img/S_G05_U03_L01_03_01_dropMitocondriaAzul.png) no-repeat;
  background-size: 100%;
  width: 47px;
  height: 49px;
  position: absolute;
  top: 455px;
  left: 426px;
  z-index: 5;
}

#mitocondriaAzul8{
  background: url(../img/S_G05_U03_L01_03_01_dropMitocondriaAzul.png) no-repeat;
  background-size: 100%;
    width: 40px;
  height: 45px;
  position: absolute;
    top: 469px;
  left: 643px;
  z-index: 5;
}

#mitocondria4{
  background: url(../img/S_G05_U03_L01_03_01_MITOCONDRIAA.png) no-repeat;
  background-size: 100%;
    width: 21px;
  height: 27px;
  position: absolute;
    top: 386px;
  left: 425px;
  z-index: 5;
}
#mitocondria5{
  background: url(../img/S_G05_U03_L01_03_01_MITOCONDRIAA.png) no-repeat;
  background-size: 100%;
    width: 37px;
  height: 44px;
  position: absolute;
    top: 462px;
  left: 472px;
  z-index: 5;
}

#paredCelula{
  background: url(../img/S_G05_U03_L01_05_01_PAREDCELULA.png) no-repeat;
  background-size: 100%;
    width: 473px;
  height: 416px;
  position: absolute;
  top: 224px;
  left: 306px;
  z-index: 1;
}

.celulaInterno{
	background: url(../img/S_G05_U03_L01_05_01_CELULAINTERNO.png) no-repeat;
  background-size: 100%;
      width: 334px;
  height: 225px;
  position: absolute;
  top: 312px;
  left: 379px;
  z-index: 2;
}

.lisosomas{
	background: url(../img/S_G05_U03_L01_05_01_LISO.png) no-repeat;
  background-size: 100%;
    width: 267px;
  height: 209px;
  position: absolute;
  top: 326px;
  left: 409px;
  z-index: 3;
}

.botonNext{
	background-image: -webkit-linear-gradient(left, #006837, #398E63);
  background-image: -moz-linear-gradient(top, #006837, #398E63);
  background-image: -ms-linear-gradient(top, #006837, #398E63);
  background-image: -o-linear-gradient(left, #006837, #398E63);
  background-image: linear-gradient(to left, #1F6620, #42A834);
  border-bottom: solid #006837 7px;
	width:80px;
	height:80px;
	border-radius:50%;
	cursor:pointer;
	position:absolute;
}

.botonNext:active{
	border-bottom: none;
	bottom: 33px;
	right: 32px;
}

.botonPrev{
	background-image: -webkit-linear-gradient(left, #006837, #398E63);
  background-image: -moz-linear-gradient(top, #006837, #398E63);
  background-image: -ms-linear-gradient(top, #006837, #398E63);
  background-image: -o-linear-gradient(left, #006837, #398E63);
  background-image: linear-gradient(to left, #42A834, #1F6620);
	width:80px;
	height:80px;
	border-radius:50%;
	cursor:pointer;
	position:absolute;
	border-bottom: solid #006837 7px;
}

.botonPrev:active{
	border-bottom: none;
	bottom: 33px;
	left: 36px;
}

.fondoTitulo{
	background:url(../img/S_G05_U03_L01_05_01_FONDOTITULO.png) no-repeat;
	background-size:100%;
	  width: 990px;
  height: 99px;
  position: absolute;
  top: 128px;
  left: 183px;
}

.textoTitulo{
	  font-family: Myriad-Pro, sans-serif;
  font-size: 23pt;
  font-weight: 600;
  font-style: italic;
  color: #FFF;
  text-align: center;
  margin-top: 13px;
}

