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

#contenido1{
	width: 930px;
	height: 400px;
	margin: 0 auto;
}

.tab_container, #mun{
	float: left;
	display: block;
}

#mun{
	margin-top: 38px;
	width: 400px;
}

.tab_content{
	width: 480px;
	height: 400px;
	margin-top: 20px;
	background: red;
}

.btn_content{
	width: 925px;
	margin-top: 10px;
}

#tab1{
	width: 480px;
	height: 400px;
	background: url(../img/personajes.png);
}

#tab2{
	width: 480px;
	height: 400px;
	background: url(../img/personajes1.png);
}

#tab3{
	width: 480px;
	height: 400px;
	background: url(../img/personajes2.png);
}

#tab4{
	width: 480px;
	height: 400px;
	background: url(../img/personajes3.png);
}

#tab5{
	width: 480px;
	height: 400px;
	background: url(../img/personajes4.png);
}

#tab2 p, #tab4 p{
	float: right;
	text-align: center;
	width: 200px;
	margin: 130px 65px;
	font-size: 15px;
	color: #C52C0F;
}

#tab3 p, #tab5 p{
	float: left;
	text-align: center;
	width: 200px;
	margin: 130px 55px;
	font-size: 15px;
	color: #C52C0F;
}

.btn{
	margin: 0 auto;
	margin-top: 20px;
	width: 130px;
	padding: 0px;
}

.btn li{
	float: left;
	list-style: none;
	display: block;
	width: 30px;
	height: 30px;
	padding: 0px 6px;
	margin: 0 auto;
}

.btn li a{
	display: block;
	width: 30px;
	height: 30px;
	background: url(../img/btn.png);
}

.btn li  a:hover{
	background: url(../img/btn1.png);
}

.btn li.active a, .btn li.active a:hover{
	background: url(../img/btn1.png);
}

.tabs, .tabs li{
	padding: 0px;
	margin: 0px;
	float: left;
	list-style: none;
}

.tabs li a{
	width: 110px;
	height: 126px;
	display: block;
}



.tabs li:nth-child(1) a{
	width: 440px;
	height: 4px;
	color: #6f3d8c;
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	text-shadow: #6f3d8c 1px 0px 0px;
	background: none;
	margin-bottom: 15px;
}
.tabs li:nth-child(1) a:hover{
	width: 440px;
	color: #9E60C2;
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	text-shadow: #9E60C2 1px 0px 0px;
	background: none;
	margin-bottom: 15px;
}
.tabs li:nth-child(1).active a, .tabs li:nth-child(1).active a:hover {
    width: 440px;
	color: #6f3d8c;
	font-size: 25px;
	font-weight: bold;
	text-align: center;
	text-shadow: #6f3d8c 1px 0px 0px;
	background: none;
	margin-bottom: 15px;
}

.tabs li:nth-child(3) a{
	background: url(../img/caras-per.png) 0px 0px no-repeat;
}
.tabs li:nth-child(3) a:hover{
	background: url(../img/caras-per1.png) 0px 0px no-repeat;
}
.tabs li:nth-child(3).active a, .tabs li:nth-child(3).active a:hover {
    background: url(../img/caras-per1.png) 0px 0px no-repeat;
}


.tabs li:nth-child(4) a{
	background: url(../img/caras-per.png) -111px 0px no-repeat;
}
.tabs li:nth-child(4) a:hover{
	background: url(../img/caras-per1.png) -111px 0px no-repeat;
}
.tabs li:nth-child(4).active a, .tabs li:nth-child(4).active a:hover {
    background: url(../img/caras-per1.png)-111px 0px no-repeat;
}


.tabs li:nth-child(5) a{
	background: url(../img/caras-per.png) -221px 0px no-repeat;
}
.tabs li:nth-child(5) a:hover{
	background: url(../img/caras-per1.png) -221px 0px no-repeat;
}
.tabs li:nth-child(5).active a, .tabs li:nth-child(5).active a:hover {
    background: url(../img/caras-per1.png)-221px 0px no-repeat;
}


.tabs li:nth-child(6) a{
	background: url(../img/caras-per.png) -331px 0px no-repeat;
}
.tabs li:nth-child(6) a:hover{
	background: url(../img/caras-per1.png) -331px 0px no-repeat;
}
.tabs li:nth-child(6).active a, .tabs li:nth-child(6).active a:hover {
    background: url(../img/caras-per1.png)-331px 0px no-repeat;
}

.tabs li:nth-child(3) a, .tabs li:nth-child(6) a{
	margin-top: 10px;
}

.tabs li:nth-child(4) a, .tabs li:nth-child(5) a{
	margin-top: 40px;
}




#otros span{
	visibility: hidden;
}
#otros{
	width: 180px;
	height: 30px;
	display: block;
	margin: 0 auto;
	margin-top: 20px;
	background: url(../img/otros-per.png)no-repeat;
}
#otros:hover{
	background: url(../img/otros-per.png)0px -30px no-repeat;
}