@charset "UTF-8";
/* CSS Document */



body,td,th {
    font-family: 'Thasadith', sans-serif;
    font-size: 100%;
    color: rgba(158,158,158,1.00);
}
body {
    background-color: rgba(0,0,0,1.00);
    font-family: 'Thasadith', sans-serif;
}
	
header { 
	position: relative;
	font-size: 300%; 
    font-weight: bolder;
	color: rgba(173,173,173,1.00); 
	top: -10px;  
	letter-spacing: 5px;
	}

#Titulo{
	position: relative;
	font-size: 300%; 
    font-weight: bolder;
	color: rgba(57,57,57,1.00);  
	top: 53px; 
	left:4px;
	letter-spacing: 5px;
}
	
menu { 
	position: relative;
	height: 10px;
}

a:link {
color: rgba(244,201,0,1.00);
}

a:active {
color: rgba(240,189,222,1.00);
}

a:visited {
color: rgba(209,88,29,1.00);
}


.fuente1 {font-family:'Thasadith', sans-serif; }	

.nav { 	
	position: relative; 
	top: 40px;
	width: 9%;  
	color: rgba(0,255,255,1.00);
	float: left; font-size: 120%;  text-decoration: none;
	letter-spacing: 5px;
	}
	
.nav:hover { background-color: rgba(57,57,57,1.00);   }
	
.navinc {
	color: rgba(239,249,111,1.00);
	text-decoration: none;
}
	
.nav:hover, .navinc:hover {
	color: rgba(251,249,179,1.00); 
	cursor: pointer;
}
	
	
#contenedor {
    width: 1200px;
    height: 820px;
	margin-top: 3%;
	background-color: rgba(0,0,0,1.00);
	font-family:'Thasadith', sans-serif;
		
}
	
#contenedor::after {
  content: "";
  clear: both;
  display: table;
}
	
	
#Infoinicio {
	position: relative;
	top: 70px;
	left: 175px;
	width: 350px;
	font-family:'Thasadith', sans-serif;
	letter-spacing: 2px;
	font-size: 150%;
	text-align: center;
}
#InfoPet {
	position: absolute;
	top: 70px;
	left: 100px;
	width: 410px;
	font-family:'Thasadith', sans-serif;
	letter-spacing: 2px;
	font-size: 110%;
	text-align: left;
	color: rgba(219,219,219,1.00);
}

#Inicio1 {
	position: absolute;
	top: 93px;
	left: 585px;
	width: 440px;
	z-index: 1;
}
#Inicio2{
	position: absolute;
	top: 490px;
	left: 385px;
	height: 300px;
	z-index: 2;
}
#Inicio3 {
	position: absolute;
	top: 490px;
	left: 140px;
	height: 300px;
    z-index: 3;
}
#Inicio4{
	position: absolute;
	top: 390px;
	left: 575px;
	height:400px;
	z-index: 4;
}
	
#AliTeo {	
	position: absolute;
	top:250px;
	left: 152px;
	width: 400px;
	z-index: 5;
}
#MarcieTeo {	
	position: absolute;
	left:820px;
	top:390px;
    height: 400px;
    z-index: 6;
}
#Visuales{
	position: absolute;
	top:0px;
	filter: blur(10px) grayscale(100%);
	transition: 2s;
}

#Visuales:hover {
filter: blur(0px) grayscale(0%);

}


#Petimg{
	position: absolute;
	top: 25px;
	left: 700px;
	width: 400px;
	z-index: 1;
}
#Petimg2{
	position: absolute;
	top: 25px;
	left: 600px;
	width: 400px;
	z-index: 1;
}
#Petimg3{
	position: absolute;
	top: 25px;
	left: 550px;
	width: 400px;
	z-index: 1;
}
#Petimg4{
	position: absolute;
	top: 25px;
	left: 740px;
	width: 400px;
	z-index: 1;
}
#PetVidVert {
	position: absolute;
	top: 55px;
	left: 600px;
	height: 290px;
	z-index: 5;
	transition: 2s;
	filter: blur(3px);
		
}

#PetVidVert:hover {
	filter: blur(0px);
}

#PetVidVert2 {
	position: absolute;
	top: 55px;
	left: 930px;
	height: 290px;
	z-index: 5;
	transition: 2s;
	filter: blur(3px);
}

#PetVidVert2:hover {
	filter: blur(0px);
}

#PetVidHor {
	position: absolute;
	top: 180px;
	left: 840px;
	width: 290px;
	z-index: 5;
	transition: 2s;
	filter: blur(3px);
}
#PetVidHor:hover {
	filter: blur(0px);
}
#PetVidHor2 {
	position: absolute;
	top: 180px;
	left: 550px;
	width: 290px;
	z-index: 5;
	transition: 2s;
	filter: blur(3px);
}
#PetVidHor2:hover {
	filter: blur(0px);
}

.boton {
	position: absolute;
	top: 480px;
	font-size: 150%;
	letter-spacing: 3px;
	text-align: right;
	font-weight: bolder;
	color: rgba(244,201,0,1.00);
	transition: 2s;
	-webkit-animation: animt1;
    animation: animt1;
    -webkit-animation-duration: 4s;
    animation-duration: 4s;
	-webkit-animation-itineration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}
@keyframes animt1 {
	0% {color: rgba(244,201,0,1.00);}	
    25% {color: rgba(209,88,29,1.00);}	
	50% {color: rgba(244,201,0,1.00);}	
	100% {color: rgba(209,88,29,1.00);}

}
.boton2 {
	position: absolute;
	top: 630px;
	font-size: 150%;
	letter-spacing: 3px;
	text-align: right;
	width: 200px;
	font-weight: bolder;
	color: rgba(209,88,29,1.00);
	transition: 2s;
	-webkit-animation: animt2;
    animation: animt2;
    -webkit-animation-duration: 4s;
    animation-duration: 4s;
	-webkit-animation-itineration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}
@keyframes animt2 {
	0% {color: rgba(209,88,29,1.00);}	
    25% {color: rgba(244,201,0,1.00);}	
	50% {color: rgba(209,88,29,1.00);}	
	100% {color: rgba(244,201,0,1.00);}
}
#BotonTeo {
	left: 987px;
}
#BotonTeo:hover ~ #Teo2 {
filter: opacity(100%);
}
#BotonTeo:hover ~ #teog1 {
filter: opacity(100%);
}
#BotonTeo:hover ~ #teog2 {
filter: opacity(100%);
}
#BotonTeo:hover ~ #teog3 {
filter: opacity(100%);
}
#BotonTeo:hover ~ #teog4 {
filter: opacity(100%);
}
#BotonTeo2 {
	left: 900px;
}
#BotonTeo2:hover ~ #Teo1 {
filter: opacity(100%);
}
#BotonTeo2:hover ~ #Teo3 {
filter: opacity(100%);
}
#BotonTeo2:hover ~ #teog5 {
filter: opacity(100%);
}
#BotonTeo2:hover ~ #teog6 {
filter: opacity(100%);
}
#BotonTeo2:hover ~ #teog7 {
filter: opacity(100%);
}
#BotonHarry {
	left: 958px;
}
#BotonHarry:hover ~ #Harry2 {
filter: opacity(100%);
}
#BotonHarry:hover ~ #Harry3 {
filter: opacity(100%);
}
#BotonHarry:hover ~ #Harry4 {
filter: opacity(100%);
}
#BotonHarry:hover ~ #harryg1 {
filter: opacity(100%);
}
#BotonHarry:hover ~ #harryg2 {
filter: opacity(100%);
}
#BotonHarry2 {
	left: 900px;
}
#BotonHarry2:hover ~ #Harry5 {
filter: opacity(100%);
}
#BotonHarry2:hover ~ #harryg3{
filter: opacity(100%);
}
#BotonHarry2:hover ~ #harryg4 {
filter: opacity(100%);
}
#BotonDako {
	left: 969px;
}
#BotonDako:hover ~ #Dako1 {
filter: opacity(100%);
}
#BotonDako:hover ~ #Dako2 {
filter: opacity(100%);
}
#BotonDako:hover ~ #dakog1 {
filter: opacity(100%);
}
#BotonDako:hover ~ #dakog2 {
filter: opacity(100%);
}
#BotonDako:hover ~ #dakog3 {
filter: opacity(100%);
}
#BotonDako2 {
	left: 900px;
}
#BotonDako2:hover ~ #Dako3 {
filter: opacity(100%);
}
#BotonDako2:hover ~ #dakog4 {
filter: opacity(100%);
}
#BotonDako2:hover ~ #dakog5 {
filter: opacity(100%);
}
#BotonDako2:hover ~ #dakog6 {
filter: opacity(100%);
}
#BotonMarcie {
	left: 942px;
}
#BotonMarcie:hover ~ #Marcie1 {
filter: opacity(100%);
}
#BotonMarcie:hover ~ #marcieg1 {
filter: opacity(100%);
}
#BotonMarcie:hover ~ #marcieg2 {
filter: opacity(100%);
}
#BotonMarcie:hover ~ #marcieg3 {
filter: opacity(100%);
}
#BotonMarcie:hover ~ #marcieg4 {
filter: opacity(100%);
}
#BotonMarcie2 {
	left: 900px;
}
#BotonMarcie2:hover ~ #Marcie2 {
filter: opacity(100%);
}
#BotonMarcie2:hover ~ #marcieg5 {
filter: opacity(100%);
}
#BotonMarcie2:hover ~ #marcieg6 {
filter: opacity(100%);
}
#BotonSchatz {
	left: 940px;
}
#BotonSchatz:hover ~ #Schatz1 {
filter: opacity(100%);
}
#BotonSchatz:hover ~ #Schatz2 {
filter: opacity(100%);
}
#BotonSchatz:hover ~ #schatzg1 {
filter: opacity(100%);
}
#BotonSchatz:hover ~ #schatzg2 {
filter: opacity(100%);
}
#BotonSchatz:hover ~ #schatzg3 {
filter: opacity(100%);
}
#BotonSchatz2 {
	left: 895px;
}
#BotonSchatz2:hover ~ #Schatz3 {
filter: opacity(100%);
}
#BotonSchatz2:hover ~ #schatzg4 {
filter: opacity(100%);
}
#BotonSchatz2:hover ~ #schatzg5 {
filter: opacity(100%);
}
#BotonSchatz2:hover ~ #schatzg6 {
filter: opacity(100%);
}
#BotonSchatz2:hover ~ #schatzg7 {
filter: opacity(100%);
}
#BotonSnacky {
	left: 940px;
}
#BotonSnacky:hover ~ #Snacky1 {
filter: opacity(100%);
}
#BotonSnacky:hover ~ #snackyg1 {
filter: opacity(100%);
}
#BotonSnacky:hover ~ #snackyg2 {
filter: opacity(100%);
}
#BotonSnacky:hover ~ #snackyg3 {
filter: opacity(100%);
}
#BotonSnacky:hover ~ #snackyg4 {
filter: opacity(100%);
}
#BotonSnacky2 {
	left: 900px;
}
#BotonSnacky2:hover ~ #Snacky2 {
filter: opacity(100%);
}
#BotonSnacky2:hover ~ #snackyg5 {
filter: opacity(100%);
}
#BotonSnacky2:hover ~ #snackyg6 {
filter: opacity(100%);
}
#BotonSnacky2:hover ~ #snackyg7 {
filter: opacity(100%);
}
#BotonSnacky2:hover ~ #snackyg8 {
filter: opacity(100%);
}
#BotonSeth {
	left: 972px;
}
#BotonSeth:hover ~ #Seth1 {
filter: opacity(100%);
}
#BotonSeth:hover ~ #sethg1 {
filter: opacity(100%);
}
#BotonSeth:hover ~ #sethg2 {
filter: opacity(100%);
}
#BotonSeth:hover ~ #sethg3 {
filter: opacity(100%);
}
#BotonSeth:hover ~ #sethg4 {
filter: opacity(100%);
}
#BotonSeth2 {
	left: 892px;
}
#BotonSeth2:hover ~ #Seth2 {
filter: opacity(100%);
}
#BotonSeth2:hover ~ #sethg5 {
filter: opacity(100%);
}
#BotonSeth2:hover ~ #sethg6 {
filter: opacity(100%);
}
#BotonSeth2:hover ~ #sethg7 {
filter: opacity(100%);
}
#BotonSeth2:hover ~ #sethg8 {
filter: opacity(100%);
}
#BotonNala {
	left: 970px;
}
#BotonNala:hover ~ #Nala1 {
filter: opacity(100%);
}
#BotonNala:hover ~ #nalag1 {
filter: opacity(100%);
}
#BotonNala:hover ~ #nalag2 {
filter: opacity(100%);
}
#BotonNala:hover ~ #nalag3 {
filter: opacity(100%);
}
#BotonNala:hover ~ #nalag4 {
filter: opacity(100%);
}
#BotonNala2 {
	left: 890px;
}
#BotonNala2:hover ~ #Nala2 {
filter: opacity(100%);
}
#BotonNala2:hover ~ #nalag5 {
filter: opacity(100%);
}
#BotonNala2:hover ~ #nalag6 {
filter: opacity(100%);
}
#BotonNala2:hover ~ #nalag7 {
filter: opacity(100%);
}
#BotonAli {
	left: 999px;
}
#BotonAli:hover ~ #Ali1 {
filter: opacity(100%);
}
#BotonAli:hover ~ #alig1 {
filter: opacity(100%);
}
#BotonAli:hover ~ #alig2 {
filter: opacity(100%);
}
#BotonAli:hover ~ #alig3 {
filter: opacity(100%);
}
#BotonAli:hover ~ #alig4 {
filter: opacity(100%);
}
#BotonAli2 {
	left: 900px;
}
#BotonAli2:hover ~ #Ali2{
filter: opacity(100%);
}
#BotonAli2:hover ~ #alig5{
filter: opacity(100%);
}
#BotonAli2:hover ~ #alig6{
filter: opacity(100%);
}
#BotonLoki {
	left: 983px;
}
#BotonLoki:hover ~ #Loki1{
filter: opacity(100%);
}
#BotonLoki:hover ~ #Loki2{
filter: opacity(100%);
}
#BotonLoki:hover ~ #lokig1{
filter: opacity(100%);
}
#BotonLoki:hover ~ #lokig2{
filter: opacity(100%);
}
#BotonLoki2 {
	left: 900px;
}
#BotonLoki2:hover ~ #Loki4{
filter: opacity(100%);
}
#BotonLoki2:hover ~ #Loki3{
filter: opacity(100%);
}
#BotonLoki2:hover ~ #lokig3{
filter: opacity(100%);
}
#Teo1{
position: absolute;
width: 290px;
top: 350px;
left: 80px;
filter: opacity(0%);
transition: 1s;
}
#Teo2{
position: absolute;
height: 290px;
top: 380px;
left: 390px;
z-index: 2;
transition: 1s;
filter: opacity(0%);
}
#Teo3{
position: absolute;
height: 290px;
top: 340px;
left: 800px;
filter: opacity(0%);
transition: 1s;
}
#teog1{
position: absolute;
width: 290px;
top: 500px;
left: 520px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#teog2{
position: absolute;
height: 290px;
top: 330px;
left: 100px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#teog3{
position: absolute;
width: 290px;
top: 590px;
left: 140px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#teog4{
position: absolute;
height: 290px;
top: 340px;
left: 800px;
filter: opacity(0%);
transition: 1s;
}
#teog5{
position: absolute;
width: 290px;
top: 490px;
left: 170px;
filter: opacity(0%);
transition: 1s;
}
#teog6{
position: absolute;
width: 290px;
top: 380px;
left: 440px;
filter: opacity(0%);
transition: 1s;
}
#teog7{
position: absolute;
width: 290px;
top: 580px;
left: 540px;
filter: opacity(0%);
transition: 1s;
}

#Harry2{
position: absolute;
height: 290px;
top: 360px;
left: 780px;
filter: opacity(0%);
transition: 1s;
}
#Harry3{
position: absolute;
width: 290px;
top: 400px;
left: 370px;
filter: opacity(0%);
transition: 1s;
}
#Harry4{
position: absolute;
height: 290px;
top: 500px;
left: 70px;
filter: opacity(0%);
transition: 1s;
}
#harryg1 {
position: absolute;
height: 290px;
top: 450px;
left: 220px;
filter: opacity(0%);
transition: 1s;
}
#harryg2 {
position: absolute;
height: 290px;
top: 520px;
left: 520px;
filter: opacity(0%);
transition: 1s;
}
#Harry5{
position: absolute;
width: 290px;
top: 400px;
left: 150px;
filter: opacity(0%);
transition: 1s;
}
#harryg3 {
position: absolute;
height: 290px;
top: 520px;
left: 420px;
filter: opacity(0%);
transition: 1s;
}
#harryg4 {
position: absolute;
width: 290px;
top: 470px;
left: 630px;
filter: opacity(0%);
transition: 1s;
}

#Dako1 {
position: absolute;
height: 290px;
top: 510px;
left: 520px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Dako2 {
position: absolute;
height: 290px;
top: 350px;
left: 160px;
filter: opacity(0%);
transition: 1s;
}
#dakog1 {
position: absolute;
width: 290px;
top: 390px;
left: 310px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#dakog2 {
position: absolute;
width: 290px;
top: 590px;
left: 0px;
filter: opacity(0%);
transition: 1s;
}
#dakog3 {
position: absolute;
width: 290px;
top: 430px;
left: 660px;
z-index: 3;
filter: opacity(0%);	
transition: 1s;
}
#dakog4 {
position: absolute;
width: 290px;
top: 370px;
left: 660px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#dakog5 {
position: absolute;
width: 290px;
top: 590px;
left: 500px;
z-index: 2;
filter: opacity(0%);	
transition: 1s;
}
#dakog6 {
position: absolute;
width: 290px;
top: 400px;
left: 280px;
z-index: 1;
filter: opacity(0%);	
transition: 1s;
}
#Dako3{
position: absolute;
width: 290px;
top: 550px;
left: 20px;
z-index: 1;
filter: opacity(0%);	
transition: 1s;
}

#marcieg1 {
position: absolute;
width: 290px;
top: 530px;
left: 0px;
z-index: 1;
filter: opacity(0%);		
transition: 1s;
}
#marcieg2 {
position: absolute;
height: 290px;
top: 330px;
left: 210px;
z-index: 2;
filter: opacity(0%);		
transition: 1s;
}
#Marcie1 {
position: absolute;
height: 290px;
top: 510px;
left: 380px;
z-index: 3;
filter: opacity(0%);		
transition: 1s;
}
#marcieg3 {
position: absolute;
width: 290px;
top: 310px;
left: 490px;
z-index: 4;
filter: opacity(0%);		
transition: 1s;
}
#marcieg4 {
position: absolute;
height: 290px;
top: 360px;
left: 765px;
z-index: 5;
filter: opacity(0%);		
transition: 1s;
}
#Marcie2 {
position: absolute;
height: 290px;
top: 320px;
left: 270px;
z-index: 3;
filter: opacity(0%);			
transition: 1s;
}
#marcieg5 {
position: absolute;
width: 290px;
top: 560px;
left: 420px;
z-index: 5;
filter: opacity(0%);			
transition: 1s;
}
#marcieg6 {
position: absolute;
height: 290px;
top: 360px;
left: 700px;
z-index: 5;
filter: opacity(0%);			
transition: 1s;
}

#Schatz1 {
position: absolute;
width: 290px;
top: 320px;
left: 0px;
z-index: 1;
filter: opacity(0%);			
transition: 1s;
}
#schatzg1 {
position: absolute;
height: 290px;
top: 460px;
left: 190px;
z-index: 5;
filter: opacity(0%);			
transition: 1s;
}
#schatzg2 {
position: absolute;
width: 290px;
top: 310px;
left: 370px;
z-index: 5;
filter: opacity(0%);			
transition: 1s;
}
#Schatz2 {
position: absolute;
height: 290px;
top: 510px;
left: 480px;
z-index: 8;
filter: opacity(0%);			
transition: 1s;
}
#schatzg3 {
position: absolute;
width: 290px;
top: 420px;
left: 630px;
z-index: 7;
filter: opacity(0%);			
transition: 1s;
}
#Schatz3 {
position: absolute;
height: 290px;
top: 420px;
left: 0px;
z-index: 7;
filter: opacity(0%);				
transition: 1s;
} 
#schatzg4 {
position: absolute;
width: 290px;
top: 320px;
left: 100px;
z-index: 6;
filter: opacity(0%);	
transition: 1s;
}
#schatzg5 {
position: absolute;
height: 290px;
top: 500px;
left: 320px;
z-index: 5;
filter: opacity(0%);	
transition: 1s;
}
#schatzg6 {
position: absolute;
height: 290px;
top: 305px;
left: 495px;
z-index: 4;
filter: opacity(0%);	
transition: 1s;
}
#schatzg7 {
position: absolute;
height: 290px;
top: 355px;
left: 708px;
z-index: 3;
filter: opacity(0%);	
transition: 1s;
}

#snackyg1 {
position: absolute;
width: 290px;
top: 345px;
left: 0px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#snackyg2 {
position: absolute;
height: 290px;
top: 510px;
left: 200px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Snacky1 {
position: absolute;
width: 290px;
top: 390px;
left: 320px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#snackyg3 {
position: absolute;
height: 290px;
top: 480px;
left: 470px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#snackyg4 {
position: absolute;
width: 290px;
top: 430px;
left: 635px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#snackyg5 {
position: absolute;
width: 290px;
top: 580px;
left: 0px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#snackyg6 {
position: absolute;
height: 290px;
top: 330px;
left: 170px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Snacky2 {
position: absolute;
width: 290px;
top: 580px;
left: 350px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#snackyg7 {
position: absolute;
height: 290px;
top: 310px;
left: 480px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#snackyg8 {
position: absolute;
width: 290px;
top: 485px;
left: 630px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}

#sethg1 {
position: absolute;
height: 290px;
top: 500px;
left: 0px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}
#sethg2 {
position: absolute;
width: 290px;
top: 360px;
left: 120px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}
#Seth1 {
position: absolute;
height: 290px;
top: 480px;
left: 350px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}
#sethg3 {
position: absolute;
width: 290px;
top: 400px;
left: 500px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}
#sethg4 {
position: absolute;
height: 290px;
top: 360px;
left: 740px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}
#sethg5 {
position: absolute;
width: 290px;
top: 340px;
left: 0px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#sethg6 {
position: absolute;
height: 290px;
top: 510px;
left: 200px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Seth2 {
position: absolute;
width: 290px;
top: 360px;
left: 350px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#sethg7 {
position: absolute;
height: 290px;
top: 440px;
left: 480px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#sethg8 {
position: absolute;
width: 290px;
top: 430px;
left: 665px;
z-index: 0;
filter: opacity(0%);
transition: 1s;
}

#nalag1 {
position: absolute;
height: 290px;
top: 520px;
left: 20px;
z-index: 1;
filter: opacity(0%);
transition: 1s;
}
#nalag2 {
position: absolute;
width: 290px;
top: 360px;
left: 130px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Nala1 {
position: absolute;
height: 290px;
top: 420px;
left: 350px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#nalag3 {
position: absolute;
width: 290px;
top: 625px;
left: 460px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#nalag4 {
position: absolute;
height: 290px;
top: 360px;
left: 730px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#nalag5 {
position: absolute;
width: 290px;
top: 460px;
left: 640px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#nalag6 {
position: absolute;
height: 290px;
top: 510px;
left: 440px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#Nala2 {
position: absolute;
width: 290px;
top: 410px;
left: 200px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#nalag7 {
position: absolute;
width: 290px;
top: 550px;
left: 40px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}

#Ali1 {
position: absolute;
height: 290px;
top: 500px;
left: 0px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#alig1 {
position: absolute;
width: 290px;
top: 350px;
left: 100px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#alig2 {
position: absolute;
height: 290px;
top: 430px;
left: 350px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#alig3 {
position: absolute;
width: 290px;
top: 600px;
left: 530px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#alig4 {
position: absolute;
height: 290px;
top: 360px;
left: 800px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#alig5 {
position: absolute;
width: 290px;
top: 430px;
left: 220px;
z-index: 2;
filter: opacity(0%);
transition: 1s;
}
#Ali2 {
position: absolute;
height: 290px;
top: 510px;
left: 500px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#alig6 {
position: absolute;
width: 290px;
top: 470px;
left: 650px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}

#Loki1 {
position: absolute;
height: 290px;
top: 510px;
left: 110px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#lokig1 {
position: absolute;
height: 290px;
top: 370px;
left: 320px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#Loki2 {
position: absolute;
height: 290px;
top: 440px;
left: 580px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#lokig2 {
position: absolute;
height: 290px;
top: 350px;
left: 790px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#Loki3 {
position: absolute;
height: 290px;
top: 370px;
left: 300px;
z-index: 3;
filter: opacity(0%);
transition: 1s;
}
#lokig3 {
position: absolute;
height: 290px;
top: 480px;
left: 520px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}
#Loki4{
position: absolute;
height: 290px;
top: 350px;
left: 790px;
z-index: 4;
filter: opacity(0%);
transition: 1s;
}