body{
	background-color: #DDDDDD;
}

a{
	color: white;
}

ol{
	float: left;
	position: relative;
	left: 50px;
}

table{
	float: right;
	position: relative;
	right: 50px;
}

#contenedor {
	margin:auto;
	width: 968px;
}

/* menu de navegacion horizontal */
#menu {
	background-color: lightsalmon;
	width: 968px;

}

#menu ul{
	list-style:none;
	padding:0px;
	margin:0px;
	overflow:auto;
}

#menu ul li{
	float:left;
	width: 20%;
	height: 55px;
	text-align:center;
	box-sizing:border-box;
	padding-top: 15px;
}

#menu ul li:last-child{	/* con el last-child afecta solo al ultimo elemento al ultimo elemento */
	border-right:none;
}

#menu ul li a{
	text-decoration:none;
	display:block;
	padding:2px;
}

#menu ul li:hover{
	background-color: white;
	transition:0.4s all;
	background-repeat:no-repeat;
	background-size:contain;
}

#menu ul li a:hover{
	color: black;
}

/* foto principal de la cabecera de la pagina*/
#slices {
	height: 250px;
	width: 968px;
}

/* contenido de index.html, confirmar.html, invitaciones.html */
#contenido {
	background-color: lightsalmon;
	height: 750px;
	color: white;
}

#fotos_inicio{
	position: relative;
	top: 80px;
	text-align: center;
}

#fotos_inicio img{
	border: 10px solid white;
	width: 30%;
}

#confirmar a{
	text-decoration: none;
	background-color: #DDDDDD;
	color: black;
	border-radius: 10px;
	padding: 20px;
	position: relative;
	top: 135px;
	left: 395px;
}

#confirmar a:hover{
	background-color: white;
}

#calendario{
	text-align: center;
	position: relative;
	top: 100px;
}

#formulario{
	text-align: center;
}

/* contenido lista.html */
#contenido_lista{
	background-color: lightsalmon;
	color: white;
}

/* contenido foto.html */
#contenido_fotos {
	background-color: lightsalmon;
	color: white;
}

#fotos{
	text-align: center;
}

#fotos img{
	border: 10px solid white;
	width: 30%;
}

#foto6{
	height: 193px;
}

/* contenido informacion.html */
#contenido_informacion {
	background-color: lightsalmon;
	color: white;
}

.ceremonia{
	position: relative;
	top: 105px;
	left: 50px;
}

#ceremonia_foto{
	text-align: center;
	position: relative;
	top: 100px;
}

#ceremonia_foto img{
	border: 10px solid white;
	width: 45%;
}

#botones a{
	text-decoration: none;
	background-color: #DDDDDD;
	color: black;
	border-radius: 10px;
	padding: 20px;
	position: relative;
	top: 65px;
	left: 220px;
	margin: 30px;
}

#botones a:hover{
	background-color: white;
}

/* contenido invitaciones.html */
/* GALERIA */
#galeria {
  padding:0;
  margin:40px auto 0 auto;
  list-style-type:none;
  height:300px;
  width:774px;
}

#galeria li {
  width:60px;
  height:300px;
  float:left;
  border-left:2px solid #000;
}

#galeria li img {
  height:300px;
  width:60px;
  border:0;
}

#galeria li:hover {
  background:#eee;
  width:400px;
}

#galeria li:hover img {
  width:400px;
}

/* pie principal */
#footer {
	position: relative;
	bottom: 16px;
	background-color: lightsalmon;
	height: 50px;
	width: 968px;
	color: white;
	text-align: center;
}
