@charset "UTF-8";
/* CSS Document */
/*................................................................................................................GENERALS*/
body { background-color:#010000; color:#a38153; font-family:Arial, Helvetica, sans-serif; }
body.bertha { background-image:url(../img/background_bertha.gif); background-repeat:no-repeat; background-position:top center; }
body.joyeria { background-image:url(../img/background_bertha02.gif); background-repeat:no-repeat; background-position:top center; background-color:#3a3a3a }
body.jovenes { background-image:url(../img/background_bertha03.gif); background-repeat:no-repeat; background-position:top center; background-color:#234558 }
a { color:#c0a062; text-decoration:underline }
a:hover { color:#c0a062; text-decoration:none }
h1 { color:#FFF; margin:0.4em 0 0 2em; padding:0; font-size:1.7em; float:left; font-weight:lighter; font-family:Arial, Helvetica, sans-serif }
.limpiar { clear:both }
#container { width:50em; height:40.63em; margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */ text-align: left; /* esto anula text-align: center en el elemento body. */ overflow:hidden }
#container02 { width:56em; height:33.63em; margin: 2em auto 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */ text-align: left; /* esto anula text-align: center en el elemento body. */ overflow:hidden; border:1px solid #999; z-index:3; position:relative }
#peu02 { width:70em; height:33.63em; margin: 0.4em auto 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */ text-align: right; /* esto anula text-align: center en el elemento body. */ overflow:hidden; color:#CCC; z-index:4; position:relative; font-size:0.8em }
#containe03r { width:50em; height:30.63em; margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */ text-align: left; /* esto anula text-align: center en el elemento body. */ overflow:hidden }


.adreces { float:left; text-align:left; font-size:0.8em; width:11em; margin-right:3em; }
div.adreces a { display:block; padding:1em; cursor:pointer; text-decoration:none }
div.adreces a:hover { background-color:#333; display:block; padding:1em; cursor:pointer }
.titol { font-size:1.4em; font-weight:bold }

.fons_transparent { filter:alpha(opacity=50); -moz-opacity:.50; opacity:.50; width:56em; height:33.63em; background-color:#000 }
.header { position:absolute; z-index:5; margin:1em }
#cuadres_nuvies { width:17em; height:11.5em; float:left; display:block; z-index:0; background-color:#FFF; filter:alpha(opacity=50); -moz-opacity:.50; opacity:.50; }
/*.............................................................................................................FI...GENERALS*/


/*................................................................................................................INICI MENUS*/
.menu_horitzontal { float:left; margin-left:14.4em; font-size:0.8em; margin-top:5em }
.menu_horitzontal ul { margin:0; padding:0; list-style-type:none }
.menu_horitzontal li { float:left; display:block; border-right:1px solid #CCC; padding:0 0.8em }
.menu_horitzontal li a { float:left; display:block; text-decoration:none }
.menu_horitzontal li a:hover { float:left; display:block; text-decoration:underline }

.menujoieria { margin-top:1em; margin-left:2.3em; float:left; width:27em; color:#FFF; padding-bottom:0.5em; border-bottom:1px solid #999; padding:0 -0.5em 0 -0.5em }
.menujoieria ul { margin:0; padding:0; list-style-type:none; }
.menujoieria li { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.5em; font-size:1.1em }
.menujoieria li a { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.5em; font-size:0.9em; text-decoration:none }

.menujoieria2 { margin-top:1em; margin-left:3.3em; float:left; width:26em; color:#FFF; padding-bottom:0.5em; border-bottom:1px solid #999; padding:0 -0.5em 0 -0.5em }
.menujoieria2 ul { margin:0; padding:0; list-style-type:none; }
.menujoieria2 li { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.5em; font-size:1.1em }
.menujoieria2 li a { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.5em; font-size:0.9em; text-decoration:none }
.menujoieria3 { margin-top:1em; margin-left:3.3em; float:left; width:26em; color:#FFF; padding-bottom:0.5em; border-bottom:1px solid #999; padding:0 -0.5em 0 -0.5em }
.menujoieria3 ul { margin:0; padding:0; list-style-type:none; }
.menujoieria3 li { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.2em; font-size:1.1em }
.menujoieria3 li a { list-style-type:none; display:block; float:left; color:#FFF; margin-right:0.5em; font-size:0.75em; text-decoration:none; }
/*................................................................................................................FI MENUS*/

/*................................................................................................................TEXTES*/
.txtbundo { position:absolute; margin-left:1em; margin-top:1.5em;  *margin-left:-44em !important;*margin-top:-11em !important;z-index:8; width:17em; height:11em; display:block }
.txtpeiro { position:absolute; margin-left:19em; margin-top:1.5em;  *margin-left:-23em !important; *margin-top:-11em !important;z-index:8; width:17em; height:11em; display:block }
.txtjenny { position:absolute; margin-left:37em; margin-top:1.5em;  *margin-left:-52.5em !important; *margin-top:1.5em !important;z-index:8; width:17em; height:11em; display:block }
.txtpatricia { position:absolute; margin-left:1em; margin-top:14em;  *margin-left:-34.5em !important; *margin-top:1.5em !important;z-index:8; width:17em; height:11em; display:block; }
.txtvictorio { position:absolute; margin-left:19em; margin-top:14em;  *margin-left:-16.5em !important; *margin-top:1.5em !important;z-index:8; width:17em; height:11em; display:block }
.txtaltres { position:absolute; margin-left:37em; margin-top:14em;  *margin-left:-16.5em !important; *margin-top:1.5em !important;z-index:8; width:17em; height:11em; display:block }
.txtbundo img, .txtpeiro img, .txtjenny img, .txtpatricia img, .txtvictorio img, .txtaltres img { border:1px solid #fff; float:left; margin-right:0.5em }
.txtbundo a, .txtpeiro a, .txtjenny a, .txtpatricia a, .txtvictorio a, .txtaltres a { width:17em; height:11em; display:block; text-decoration:none; color:#FFF; font-size:1.1em }
.txtbundo a:hover, .txtpeiro a:hover, .txtjenny a:hover, .txtpatricia a:hover, .txtvictorio a:hover, .txtaltres a:hover { text-decoration:none; color:#000 }
.txt_fitxa { position:absolute; margin-left:15.5em;  *margin-left:-19.5em !important; margin-top:2em; font-size:1.1em; color:#FFF; z-index:100 }
.txt_mas { position:absolute; font-size:1.1em; color:#FFF; z-index:100; margin-left:43em }
.txt_joyeria { position:absolute; margin-left:23em;  *margin-left:4.5em !important; margin-top:1em; font-size:1.1em; color:#FFF; z-index:100; width:25em; line-height:2em }
.txt_contactar { position:absolute; margin-left:2em;  *margin-left:2.5em !important; *margin-top:1em !important; margin-top:2em; font-size:1em; color:#FFF; z-index:100; width:25em }
.txt_contactar ul { margin:1em 0 0 0; padding:0; }
.txt_contactar li { margin-left:4em; display:block; float:left }
.email{float:right; margin-top:-2em; margin-right:18em; width:26em;  *margin-left:12.5em !important;}
/*............................................................................................................FI....TEXTES*/

.flash_joies { float:right; margin-top:1em; margin-right:1em;  *margin-right:3em !important;}
.flash_joies2 { float:left; margin-top:1em; margin-left:1em;  *margin-left:1.2em !important;}
.flash_joies3 { float:left; margin-top:1.4em;  *margin-left:1.2em !important;}
.flash_moda { margin-top:1em; margin-left:0.6em;  *margin-left:1em !important;}
.img_joieria { float:left; margin:1em 1em 0 0.6em;  *margin-left:1em !important;}
.img_comunion { float:left; margin:1em 1em 0 0.6em;  *margin-left:1em !important; width:52em; color:#FFF}
.img_relojeria { float:right; margin:1em 0.8em 0 0.6em;  *margin-right:3em !important;}
.imagen_mas{ position:absolute; background-color:#a38153; margin-top:-2em; font-size:0.8em; padding:0.2em; margin-left:0.6em; color:#FFF}

/*.............................................................................................GALERIA*/
* { margin: 0; padding: 0; }
/* begin gallery styling */
#jgal { list-style: none; position:relative; float:left; left:260px; margin-top:2em }
#jgal ul { width:610px; float:left; margin-top:4.5em; margin-left:0.5em }
#jgal li { opacity: 1; display: block; width: 77px; height: 135px; background-position: 50% 50%; cursor: pointer; border: 1px solid #fff; margin-bottom: 5px; margin-right:5px; float:left }
#jgal li img { position:absolute; top: 0px; left:-255px; display: none; border: 1px solid #fff; }
#jgal li.active img { display: block; margin-left:0em }
#jgal li.active, #jgal li:hover { outline-color: #bbb; opacity: .99 /* safari bug */; }
/* styling without javascript */
#gallery { list-style: none; display: block; border:none; position:relative; float:left; }
#gallery li { float: left; margin: 0 5px 5px 10em; border:none; }
/*...........................................................................................FI..GALERIA*/

/*FORMULARI..................................................................................*/
form {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */ margin: 0; padding: 0; font-size:0.7em }
form fieldset { border-color: #000; border-width: 1px; border-style: NONE; padding: 5px;        /* padding in fieldset support spotty in IE */ margin: 0; }
form label { display: block;  /* block float the labels to left column, set a width */ float: left; width: 100px; padding: 0; margin: 8px 0 0; /* set top margin same as form input - textarea etc. elements */ font-size:1.1em }
form fieldset legend { font-size:0.9em; /* bump up legend font size, not too large or it'll overwrite border on left *//* be careful with padding, it'll shift the nice offset on top of border  */}
form input, form textarea { /* display: inline; inline display must not be set or will hide submit buttons in IE 5x mac */
	width:auto;      /* set width of form elements to auto-size, otherwise watch for wrap on resize */ margin:5px 0 0 10px; /* set margin on left of form elements rather than right of
                              label aligns textarea better in IE */ }
form input#reset { margin-left:0px; margin-top:0.3em /* set margin-left back to zero on reset button (set above) */ }
textarea { overflow: auto; font-family:Arial, Helvetica, sans-serif; font-size:0.9em }
form .required { font-weight:bold; } /* uses class instead of div, more efficient */
form br { clear:left; /* setting clear on inputs didn't work consistently, so brs added for degrade */ }

/*FI FORMULARI...........................................................................................................*/

/*INICI SLIDESHOW...........................................................................................................*/
#slideshow {
	margin-top:1em;
	margin-left:1em;
  width: 400px;
  height: 370px;
  border:1px solid #CCC
}
#palceholder {
	margin-top:1em;
	margin-left:1em;
  width: 700px;
  height: 100px;
  border:1px solid #CCC
}
/*FI SLIDESHOW...........................................................................................................*/

/*INICI SLIDESHOW...........................................................................................................*/
#slideshow2 {
	margin-top:1em;
	margin-left:1em;
  width: 830px;
  height: 370px;
  border:1px solid #CCC
}
#palceholder2 {
	margin-top:1em;
	margin-left:1em;
  width: 700px;
  height: 100px;
  border:1px solid #CCC
}
/*FI SLIDESHOW...........................................................................................................*/