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

*
{
	margin:0%;
	font-family:Century Gothic;
	font-size:18px;
}

body
{
	background-color:#F1F1F1;
}

header
{
	width:100%;
	z-index:auto;
	position:fixed;
}

container
{
	padding:0%;
}

nav
{
	margin-top:3%;
	padding:5px;
	width:13%;
	height:100%;
	position:fixed;
	text-align:left;
	z-index:100;
	left:-50px;
}	

nav ul
{
	list-style:none;
	text-align:center;

}

nav ul li
{

	width:80%;
	list-style:none;
	margin:5px;
	background-color:#94835C;
	border-radius:5px;
	transition:all 0.5;
	color:#000000;
	display:inline-block;
}

nav ul li a
{
	text-decoration:none;
}

nav ul li:hover
{
	box-shadow:5px 5px 5px #000000;
	border-radius:5px;
	background-color:#DC77F8;
	transition:all 0.9;
	opacity:0.6;
	border-radius:20px;
}

h1
{
	font-size:36px;
}

#Biografia
{
 	background-color:#B377F4;	
	margin:auto;
	padding:3%;
	padding-left:10%;
	padding-right:3%;
	padding-top:3%;
	padding-bottom:3%;
	background-attachment:fixed;
}
	
#Oneoftheboys
{
	background-color:#7EBF71;
	margin:auto;
	padding:3%;
	padding-left:10%;
	padding-right:3%;
	padding-top:10%;
	padding-bottom:3%;
	background-attachment:fixed;
}
	
#Teenagedream
{
	background-color:#75B2D9;
	margin:auto;
	padding:3%;
	padding-left:10%;
	padding-right:3%;
	padding-top:10%;
	padding-bottom:3%;
	background-attachment:fixed;
}
	
#Prism
{
	background-color:#F9EDD1;
	margin:auto;
	padding:3%;
	padding-left:10%;
	padding-right:3%;
	padding-top:10%;
	padding-bottom:3%;
	background-attachment:fixed;
}

/* logo */
#img1
{ 
	width:100%;
	height:180px;
	background-image:url("imagenes/2000px-Katy_Perry_logo.svg.png");
	background-position:center;
	background-size:25%;
	background-repeat:no-repeat;
	margin:1%;
}

#img2
{
	width:100%;
	height:180px;
	background-image:url(imagenes/1.png);
	background-position:center;
	background-size:25%;
	background-repeat:no-repeat;
	position:fixed;
	margin:1%;
}

#img3
{
	width:100%;
	height:180px;
	background-image:url(imagenes/2.png);
	background-position:center;
	background-size:25%;
	background-repeat:no-repeat;
	position:fixed;
	margin:1%;
}

#img4
{
	width:100%;
	height:180px;
	background-image:url(imagenes/3.png);
	background-position:center;
	background-size:25%;
	background-repeat:no-repeat;
	position:fixed;
	margin:1%;
}

/* datos */

#datos1
{
	width:100%;
	height:600px;
	background-image:url("oneoftheboys.png");
	background-repeat:no-repeat;
	background-size:auto;
	background-position:center;
}

#datos2
{
	width:100%;
	height:600px;
	background-image:url(teenagedream.png);
	background-repeat:no-repeat;
	background-size:auto;
	background-position:center;
}

#datos3
{
	width:100%;
	height:600px;
	background-image:url(prism.png);
	background-repeat:no-repeat;
	background-size:auto;
	background-position:center;
}