/*	Index of styles for Irene Style by Marciobarrios ~ marciobarrios.com
--------------------------------------------------------------------------
	- General (titles, generic links, preformatting, some classes)
	- Layout
		- Header
		- Content
		- Footer
	- Forms
*/

/*	%General
--------------------------------------------------------------------------*/
:link,:visited{text-decoration:none}
ul,ol{list-style:none}
table {border-collapse:collapse}
h1,h2,h3,h4,h5,h6,pre,code,input,select,textarea{font-size:1em}
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0;padding:0}
fieldset,img,a img,:link img,:visited img{border:0}

* html{height:100%;}
body{
	font: 81%/1.6em arial, sans-serif;
	color:#ccc;
	text-align:center;
	background: #970065 url(../img/bg-pink.png) repeat-x top;
	height:100%;
	padding:25px 0;
}
.hidden,
hr{
	display:none;
}
/*a{
	outline:none;
}*/
a:link,
a:visited{
	color:#FF2A7D;
	border-bottom:1px solid #A91D55;
	text-decoration:none;
	padding:0 1px;
}
a:hover,
a:active{
	color:#fff;
	background-color:#4A1E30;
	text-decoration:none;
	border-bottom:1px solid #A91D55;
	padding:0 1px;
}

p{
	margin-bottom:10px;
}
.clear{
	clear:both;
}
ul.special{
	margin:20px 0;
}
	ul.special li{
		line-height:25px;
		background:url(../img/li.png) no-repeat;
		padding-left:25px;
		margin-bottom:20px;
		height:1%;
	}
		ul.special li strong{
			text-transform:uppercase;
			color:#8AC733;/*1EA2E1,8AC733*/
			display:block;
		}
		ul.special li a:link,
		ul.special li a:visited,
		ul.special li a:hover,
		ul.special li a:active{
			color:#fff;
			border:0;
			text-decoration:none;
			background:none;
		}

	/* titles ---------------------------------*/
	h2{
		font:bold 1.7em arial,sans-serif;
		color:#fff;
		margin:20px 0 10px;
	}
	h2.first-child{
		margin-top:0;
	}
	h3{
		font:bold 1.4em arial,sans-serif;
		color:#fff;
		margin:40px 0 10px;
	}
	h3.clear{
		margin-top:0;
	}
	
/*	%Layout
--------------------------------------------------------------------------*/
#wrapper{
	width:830px;
	padding:0 25px;
	margin:0 auto;
	text-align:left;
	/*border-left:5px solid #151515;
	border-right:5px solid #151515;
	background:#251119 url(../img/ornaments_content.png) no-repeat right top;*/
	background-color:#000;
	border:5px solid #151515;
}
* html #wrapper{
	height:1%;
}
	
	/*	%Header
	--------------------------------------------------------------------------*/
	#header{
		padding-top:25px;
		width:830px;
		float:left;
	}
		#header h1{
			display:block;
			float:left;
			margin: 0;
			padding: 0;
			text-indent: -9999px;
			width: 218px;
			height: 65px;
			position: relative;
			background:url(../img/title.png) no-repeat top;
			margin-bottom:40px;
		}
		#header h1 a{
			position: absolute;
			display: block;
			top: 0;
			left: 0;
			width: 218px;
			height: 65px;
			border: 0;
			background: transparent;
			overflow: hidden;
		}
		#header h1 .fake-hover {
			position: absolute;
			display: block;
			top: 0;
			left: 0;
			margin: 0;
			padding: 0;
			width: 218px;
			height: 65px;
			background: url(../img/title.png) no-repeat bottom;
		}
		
		#header #contacto{
			float:right;
			width:135px;
			text-align:left;
			color:#fff;
			background-color:#151515;
			padding:5px 10px;
		}
			#header #contacto li{
				margin-bottom:2px;
			}
			#header #contacto li.nombre{
				/*font-variant:small-caps;*/
				font-size:1.1em;
				letter-spacing:1px;
			}
			#header #contacto li.mail{
				padding-left:20px;
				background:url(../img/ico-mail.gif) no-repeat left;
			}
			#header #contacto li.tel{
				padding-left:20px;
				background:url(../img/ico-phone.gif) no-repeat left;
			}
				/*#header #contacto li a:link,
				#header #contacto li a:visited,
				#header #contacto li a:hover,
				#header #contacto li a:active{
					color:#fff;
					text-decoration:underline;
					background:0;
					border:0;
				}*/
		
		#header #menu{
			float:left;
			clear:both;
			width:830px;
			padding:0 0 5px;
			border-bottom:1px solid #333;
		}
			#header #menu li{
				float:left;
				position:relative;
			}			
				#header #menu li a{
					display:inline;
					float:left;
					text-indent:-9999px;
					border:none;
					height:22px;
					margin-left:10px;
					outline:none;
				}
				#header #menu li.first-child a{
					margin-left:0;
				}
				#header #menu li#menu-inicio a{
					width:48px;
					background:url(../img/menu-inicio.png) no-repeat 0 0;
				}
				#header #menu li#menu-asesoria a{
					width:155px;
					background:url(../img/menu-asesoria.png) no-repeat 0 0;
				}
				#header #menu li#menu-maquillaje a{
					width:185px;
					background:url(../img/menu-maquillaje.png) no-repeat 0 0;
				}
				#header #menu li#menu-novios a{
					width:166px;
					background:url(../img/menu-novios.png) no-repeat 0 0;
				}
				#header #menu li#menu-fotos a{
					width:133px;
					background:url(../img/menu-fotos.png) no-repeat 0 0;
				}
				#header #menu li#menu-contacto a{
					width:79px;
					background:url(../img/menu-contacto.png) no-repeat 0 0;
				}
				
				#header #menu li a:hover,
				#header #menu li.current a{
					background-position:0 -22px !important;
				}
				#header #menu li.current a{
					cursor:default;
				}
				
	/*	%Content
	--------------------------------------------------------------------------*/
	#content{
		padding-top:20px;
		clear:left;
	}
		#content img.sec{
			float:right;
			margin:0 0 30px 30px;
			border:5px solid white;
		}
		
		#content #links{
			clear:right;
			float:right;
			width:350px;
			margin:0 0 30px 35px;
		}
			#content #links h3{
				margin:0 0 10px;
			}
			#content #links ul{
				list-style:disc;
			}
				#content #links li{
					margin:0 0 5px 20px;
				}
		
		#image-gallery{
			/*display: inline-block;*/
			float:left;
			width:100%;
			position:relative;
			left:-25px;
			margin-bottom:30px; /* a 0 en ie.css */
		}
			#image-gallery li{
				/*display: -moz-inline-box;*/  /* Moz */
				/*display: inline-block;*/  /* Op, Saf, IE \*/
				/*vertical-align: top;*/  /* IE Mac bug fixed */
				float:left;
				margin: 25px 0 0 25px;
			}
				#image-gallery li a{
					display:block;
					border:0;
					background:none;
					outline:none;
				}
				#image-gallery li a img{
					padding:3px;
					border:1px solid #fff;
					background:none;					
				}
				#image-gallery li a:hover img{
					padding:0;
					border:4px solid #fff;
				}
				
		
	/*	%Footer
	--------------------------------------------------------------------------*/
	#footer{
		clear:both;
		margin-top:30px;
		border-top:1px solid #333;
		padding:5px 0 10px;
		color:#666;
		font-size:.9em;
	}
		#footer ul{
			float:right;
			text-align:right;
		}
			#footer ul li{
				display:inline;
				margin-left:8px;
			}
				#footer ul li a:link,
				#footer ul li a:visited,
				#footer ul li a:hover,
				#footer ul li a:active{
					color:#666;
					text-decoration:underline;
					border:0;
					background:none;
				}



				
/*	%Formularios
--------------------------------------------------------------------------*/
form{
	margin:20px 0;
}
form label{
	display:block;
}
	form label em{
		font-size:1.1em;
		font-style:normal;
		font-weight:bold;
		color:#AD0836;
	}
form input,
form textarea{
	width:350px;
	border:1px solid #fff;
	border-top-width:2px;
	background:#ccc;
	color:black;
	font:1.1em Arial, sans-serif;
	padding:3px 4px;
	margin-bottom:15px;
}
form textarea{
	width:600px;
	margin-bottom:25px;
	height:100px;
}
button {
	display:block;
	width:150px;
	height:24px;
	font:1em arial, sans-serif;
	line-height:22px;
    background: transparent url(../img/button.png) no-repeat top;
    color: #000;
	border:0;
	text-align:center;
	cursor:pointer;
}
button:active {
    background-position: bottom;
	outline:none;
}

/* mensajes de error/exito */
div.msg_ok,
p.msg_ok,
div.msg_ko,
p.msg_ko{
	width:400px;
	padding:10px 0;
	font-size:1.2em;
}
div.msg_ok,
p.msg_ok{
	color:#ffc;
}
div.msg_ko,
p.msg_ko{
	color:#F92544;
}
div.msg_ko ul,
p.msg_ko ul{
	margin:10px 0 0 20px;
	list-style:disc;
}