/******************************************************************
------------------------------------------------------------------

Estilos para la linea de tiempo (#demoContenido) en Bodaclick.com

AUTOR
Txomin Bengoa - txomin@alvaroweb.com 
Acuarela Digital SL - http://www.acuareladigital.com
15 mayo 2010 

CONTENIDO DEL DOCUMENTO
conteniene todos los estilos que existen dentro dentro deel div id="demoContenido":
- Acordeones de contenido

NOMENCLATURA
- Todas las clases e ids de este documento empiezan por "demo" 
- Ids y clases tipo "upperCase"

------------------------------------------------------------------
/*****************************************************************/

#demoContenido{
 /* div - contiene todos los estilos de este documento */
 margin: 0;
 padding: 0;
 z-index:1000;
 position:relative;
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-imagen-fondo.jpg) no-repeat 34px 39px;
}
#demoContenedorFormulario {
 /* div - contiene el formulario completo  */
 width: 393px;
 height: 450px;
 margin-left: 502px;
}
#demoContenedorMiniaturas {
 /* div - contiene las miniaturas y textos */
 overflow: hidden;
 padding-top: 100px;
}
.demoTextoMiniaturas {
 /* div - texto de miniaturas (titulo y parrafo) */
 width: 200px;
 padding-top: 98px;
 margin-left: 25px;
 float: left;
}
#demoTextoIzq {
 /* div - texto Izquierda en miniaturas */
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-miniatura-izq.jpg) no-repeat left top;
 margin-left: 10px;
}
#demoTextoCentroIzq {
 /* div - texto Centro Izquierda en miniaturas */
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-miniatura-centro-izq.jpg) no-repeat left top;
}
#demoTextoCentroDcha {
 /* div - texto Centro Derecha en miniaturas */
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-miniatura-centro-der.jpg) no-repeat left top;
}
#demoTextoDcha {
 /* div - texto Derecha en miniaturas */
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-miniatura-der.jpg) no-repeat left top;
}
#tapiz .demoTextoMiniaturas h3 {
 /* h3 - texto de todas las miniaturas */
 font-size: 18px;
 font-weight: normal;
 color: #4D4D4D;
 margin-bottom: 8px;
}
#tapiz .demoTextoMiniaturas p {
 /* p - texto de todas las miniaturas */
 font-size: 11px;
 line-height: 14px;
 font-weight: normal;
 color: #585858;
 padding-right: 10px;
}
#demoContenedorFormulario h2 {
 /* h2 - titulo formulario */
 font-size: 30px;
 font-weight: normal;
 color: #EC008C;
 padding-top: 24px;
 display: block;
}
#demoContenedorFormulario p.demoParrafoCabecero {
 /* p - parrafo cabecero formulario */
 font-size: 12px;
 font-weight: normal;
 color: #666666;
 margin-top: 15px;
 margin-bottom: 15px;
}
.demoBloqueInput {
 /* div - contiene un label y un input */
 position: relative;
}
.demoBloqueInput label {
 /* label */
 width: 124px;
 display: block;
 float: left;
 padding-top: 7px;
 padding-right: 6px;
 font-size: 11px;
 font-weight: normal;
 color: #666666;
 text-align: right;
}
.demoBloqueInput .demoInputNormal {
 /* input text normal */
 width: 150px;
 height: 15px;
}
.demoBloqueInput .demoInputPeque {
 /* input text normal */
 width: 65px;
 height: 15px;
}
.demoBloqueInput .demoInputFecha {
 /* input text fecha boda */
 display: inline;
}
.demoCalendario {
 /* a - enlace a calendario en input "Fecha boda" */
 display: block;
 position: absolute;
 left: 203px;
 top: 5px;
 width: 16px;
 height: 15px;
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-calendario.gif) no-repeat left top;
 font-size: 0.0001em;
 text-indent: -10000px;
}
#tapiz .demoBloqueInput select {
 height: 18px;
}
.demoBloqueCheckbox {
 /* div - continee dos checkbox y dos labels al final del formulario */
 margin-top: 20px;
}
.demoBloqueCheckbox label {
 /* label */
 padding-left: 3px;
 font-size: 11px;
 font-weight: normal;
 color: #666666;
}
.demoSubmit {
 /* submit */
 display: block;
 background: url(http://media.bodaclick.com/css/gfx/tapiz/demo/demo-submit.jpg) no-repeat left top;
 width: 176px;
 height: 35px;
 border: none;
 text-indent: -10000px;
 font-size: 0.0001em;
 color: #EEEEEE;
 margin-top: 16px;
 margin-left: 210px;
}
