@charset "UTF-8";
/*----------------------------------------------------------------------------->>
ESSIE [12/2010]
Essie República Dominicana

>>-----------------------------------------------------------------------------*/

/** reset **/
ul, li, p, h1, h2, h3, h4, h5 {
	margin: 0;
	padding: 0;
	list-style: none;
}
/***-------------link al index--------------***/


h1 {
	position: absolute;
	top: 25px;
	left: 0;
	text-indent: -9999px;
}

h1 a {
	width: 238px;
	height: 73px;
	display: block;
	
}



/*  GENERAL
----------------------------------------------------*/

body {
	font-family: Arial, "Helvetica", sans-serif;
	/*background:  #dadada;*/
	font-size: 10px;
	margin: 0;
	padding: 0;
	
}

#wrap {
	width: 720px;
	height: 700px;
	border: #FFF;
	margin: 0 auto;
	position: relative;
}
#header {width: 720px; height: 30px; position: relative; z-index: 12;}

.bg_index {background: url(../images/bg_index.jpg) top left no-repeat;}

.bg_2 {	background: #dadada url(../images/bg_2.jpg) top left no-repeat;}


ul#menu {
	width: 385px;
	height: 50px;
	margin-left: 350px;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
	background: url(../images/rayitas_menu.png) -10px 5px no-repeat;
}

ul#menu li {
	font-size: 10px;
	float: left;
	text-transform: uppercase;
	margin-right: 10px;
	margin-left: 10px;
	font-weight: normal;
}
ul#menu li a{
	color: #000000;
	padding: 5px;
	padding-top: 10px;
	text-decoration: none;
	display: block;
}

ul#menu li a:hover {
	background: #e70023;
	text-decoration: none;
	color: #FFF;
}
ul#menu li a.select { /* para dejar seleccionado el link en k este en el menu */
	background: #e70023;
	color: #FFF;
}


/****------------------- drop down --------------****/

ul#menu li ul.drop_down {
	width: 121px;
	position: absolute;
	margin-top: 5px;
	display: none;
	z-index: 10;
	
}

ul#menu li ul.drop_down li {
	background-color: #FFF;
	width: 121px;
	height: 20px;
	float: none !important;
	margin: 0px !important;
	padding: 0px !important;
}

ul#menu li ul.drop_down li a{
	color: #666;
	padding: 0px;
	text-decoration: none;
	display: block;
	border-bottom: 1px solid #CCC;
	padding-top: 5px;
	padding-left: 5px;
}

ul#menu li ul.drop_down li a:hover {
	background: #e70023;
	text-decoration: none;
	color: #FFF;
}

.productos_dd {
	height: 40px;
}

/* ---------------- menu colores ------------------------*/

#frase_1 {
	width: 171px;
	margin-left: 490px;
	margin-top: 25px;
	height: 70px;
	float: left;
	position: absolute;
}


#buscador {
	width: 490px;
	height: 32px;
	margin-left: 240px;
	padding-top: 100px;
	background: url(../images/frase_colores.jpg) no-repeat;
	background-position: 265px 30px;
}

.nombre {
	width: 130px;
	height: 15px;
	background-color: #efefef;
	border: none;
}

.boton {
	height:17px;
	background-color: #e70023;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	border: none;
	margin-left:5px;
	font-size: 11px;
}

.boton:hover {
	background: #7d0013;
	text-decoration: none;
	color: #FFF;
}

.seleccion {
	color: #333;
	height: 17px;
	background-color: #efefef;
	text-align: center;
	text-decoration: none;
	border: none;
	margin-left: 15px;
	border: 0px;
	
}

/*-------- cuadritos productos ----------------*/
.contenedor {
	width: 410px;
	height: 435px; 
	overflow: auto;
	margin: 30px 20px 0 15px;
}

ul#cuadritos {
	width: 410px;
	height: 370px;
	/*margin-left: 30px;
	margin-top: 45px;*/
	}

ul#cuadritos li {
	float: left;
	margin: 0 5px;
	height: 100px;
	text-align: center;
	width: 70px;
}

ul#cuadritos li p {
	text-transform: uppercase;
	font-size: 9px;
	margin-top: 3px;	
}

ul#cuadritos li a img {
	border: 0px;
}

#scroll {
	margin-left: 30px;
	margin-top: 25px;
}

/**------------- productos ---------------**/

#productos {
	width: 264px;
	height: 299px;
	margin-left: 450px;
	margin-top: -450px;
}

.nombre_producto {
	width: 130px;
	height: 40px;
	margin-left: 120px;
	margin-top: -170px;
	text-transform: uppercase;
}

.sugerencia {
	margin-top: 130px;
	margin-left: 15px;
}


/**----------------novedades -----------*/

#frase_summer {
	width: 242px;
	height: 87px;
	float: left;
	position: absolute;
	margin-left: 380px;
	margin-top: 50px;
	background: #ff0000 url(../images/frase_novedades.jpg) top left no-repeat;
}

#nueva_coleccion {
	width: 710px;
	height: 308px;
}

.foto_coleccion_1 {
	margin-left: 572px;
	margin-top: 30px;
}

.foto_coleccion_summer {
	margin-left: 550px;
	margin-top: 120px;
}

ul#new_col {
	width: 545px;
	height: 231px;
	margin-left: 25px;
	margin-top: -190px;
}

ul#new_col li {
	float: left;
	margin-right: 16px;
	text-align: center;
}
ul#new_col li p {
	color: #666;
	margin-top: 0px;
}
#pasada_coleccion {
	width: 710px;
	height: 308px;
	vertical-align:top;
}
.foto_coleccion_2 {
	margin-left: 15px;
	margin-top: 0px;
}
.foto_coleccion_wedding {
	margin-left: 15px;
	margin-top: 20px;
}
ul#pass_col {
	width: 675px;
	height: 231px;
	margin-left: 210px;
	margin-top:-170px;
}
ul#pass_col li {
	float: left;
	margin-right: 14px;
	text-align: center;
}
ul#pass_col li p {
	color: #666;
	margin-top: 0px;
}


/*******------------- tratamientos ---------*****/
#frase_4 {
	width: 200px;
	height: 70px;
	position: absolute;
	right: 130px;
	top: 60px;
	z-index: 1;
	background: url(../images/tratamientos.jpg) top left no-repeat;
}

ul#prod_tratamientos {
	width: 680px;
	height: 565px;
	margin-left: 40px;
	margin-top: 25px;
	padding-top: 75px;
}
ul#prod_tratamientos li img {
	float: left;
	margin-right: 10px;
}

ul#prod_tratamientos li {
	width: 311px;
	height: 164px;
	color: #333;
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
	position: relative;
}
ul#prod_tratamientos li img.posx {position: absolute; bottom: 0; left: 0; z-index: 2;}

ul#prod_tratamientos li p {
	color: #666;
}

.prod_orden1 {
	margin-top: -198px;
	margin-left: 330px;
}

.categoria {
	margin-top: 20px;
}

.categoria2 {
	margin-top: 20px;
	margin-left: -325px;
}



/*** -------------------- soluciones ------------------ ***/

#frase_3 {
	width: 171px;
	height: 70px;
	position: absolute;
	top: 60px;
	right: 130px;
}

ul#soluciones_recuadro {
	width: 662px;
	height: 525px;
	padding-top: 70px;
	margin-top: 30px;
	margin-left: 50px;
}


ul#soluciones_recuadro li {
	width: 194px;
	float: left;
	margin-right: 20px;
	margin-bottom: 10px;
}
ul#soluciones_recuadro li p {
	margin-top: -50px;
	color: #666;
	margin-left: 5px;
}

/******------------- pens --------------------*/

#frase_5 {
	width: 171px;
	margin-left: 500px;
	margin-top: 50px;
	height: 70px;
	float: left;
	position: absolute;
}
ul#pens {
	width: 680px;
	height: 565px;
	margin-left: 70px;
	padding-top: 160px;
}

ul#pens li {
	width: 194px;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	
}

ul#pens li p {
	margin-top: -15px;
	color: #666;
	margin-left: 20px;
}

/*** ----------------- naturally --------------***/

.naturally {background: url(../images/naturally/1.jpg) top left no-repeat;}


/*** ----------------- ejuvenate --------------***/

.ejuvenate {background: url(../images/ejuvenate/1.jpg) top left no-repeat;}

/*** ----------------- essiespa --------------***/

.spa {background: url(../images/spa/1.jpg) top left no-repeat;}


/*** ----------------- ubicacion --------------***/

.ubicacion {background: url(../images/ubicacion.jpg) top left no-repeat;}

/******-------------- ubicacion ----------***/

#box1, #box2 {
	margin-top: 130px;
	padding-left: 30px;
	width: 210px;
	float: left;
}
#box1 h3, #box2 h3 {
	margin-bottom: 10px;
	margin-top: 10px;
}

#box1 ul li, #box2 ul li{
	margin-bottom: 5px;
}

.titulo_ubicacion {
	text-transform: uppercase;
	color: #C00;
}



