/* 
    Document   : lineaDeVida
    Created on : 23-sep-2015, 16:04:54
    Author     : ldelmoral
    Description:
        Estilos para la librería de la línea de vida.
*/
.fechaBurbuja{
    position:relative;
    width: 572px;
    font-weight:normal;
    float:right;
    right:/*-28*/0px;
    font-family: garamond;
    font-size: /*18*/15px;
    margin-top:3px;
    text-align: right;
}
.acontecimientoArriba{
    background-image:url(imagenes/acontecimientoArriba.png);
    background-repeat: no-repeat;
    height:300px;
    width:14px;
    float:left;
    position:relative;
     top: -133px;
     margin-top:157px;
}

  .acontecimientoArribaDorado{
    background-image:url(imagenes/acontecimientoArribaDorado.png);
    background-repeat: no-repeat;
    height:300px;
    width:14px;
    float:left;
    position:relative;
     top: -133px;
     margin-top:157px;

}
.separacionPuntos{
    background-image: url("imagenes/1punto.png");
    background-repeat: repeat-x;
    float: left;
    height: 10px;
    margin-top: 0;
    position: relative;
    top: 248px;
    width: 88px;
}

.acontecimientoAbajo{
    background-image:url(imagenes/acontecimientoAbajo.png);
    background-repeat: no-repeat;
    height:240px;
    width:14px;
    float:left;
    margin-top:244px;
    position:relative;

}

.acontecimientoAbajoDorado{
    background-image:url(imagenes/acontecimientoAbajoDorado.png);
    background-repeat: no-repeat;
    height:240px;
    width:14px;
    float:left;
    margin-top:244px;
    position:relative;

}
.Rotate-90
{
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);

  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;

}
.anyoTimelineArriba{
     background-color: #6c9aff;
    color: white;
    font-family: verdana;
    font-size: 9px;
    position: absolute;
    text-align: center;
    top: 204px;
    width: 30px;
    left:18px;

}
.fechaTimelineArriba{

    color: #6c9aff;
    font-family: verdana;
    font-size: 12px;
    left: -109px;
    position: absolute;
    text-align:right;
    top: 91px;
    width: 200px;
}

.fechaTimelineArribaDorada{

    color: #ceb737;
    font-family: verdana;
    font-size: 12px;
    left: -109px;
    position: absolute;
    text-align:right;
    top: 91px;
    width: 200px;
}
.fechaTimelineAbajo{
    color: #6c9aff;
    font-family: verdana;
    left: -108px;
    position: absolute;
    text-align: left;
    bottom:91px;
    width: 200px;
    font-size: 12px;

}

.fechaTimelineAbajoDorada{
    color: #ceb737;
    font-family: verdana;
    left: -108px;
    position: absolute;
    text-align: left;
    bottom:91px;
    width: 200px;
    font-size: 12px;

}
.anyoTimelineAbajo{
     background-color: #6c9aff;
    color: white;
    font-family: verdana;
    font-size: 9px;
    position: absolute;
    text-align: center;
    top: -16px;
    width: 30px;
    left:18px;
}
.textoAcontecimientoArriba{
    cursor:pointer;
    color: #000032;
    font-family: verdana;
    font-size: 11px;
    right: -90px;
    text-align: left;
    top: -2px;
    position: absolute;
    width: 90px;
}
.textoAcontecimientoArribaImagen{
    cursor:pointer;
    color: #000032;
    font-family: verdana;
    font-size: 11px;
    right: -90px;
    text-align: left;
    top: 89px;
    position: absolute;
    width: 90px;
}
.textoAcontecimientoAbajo{
    color: #000032;
    cursor:pointer;
    font-family: verdana;
    font-size: 11px;
    right: -90px;
    text-align: left;
    bottom:0px;
    position: absolute;
    width: 90px;
}

.textoAcontecimientoAbajoImagen{
    color: #000032;
    cursor:pointer;
    font-family: verdana;
    font-size: 11px;
    right: -90px;
    text-align: left;
    bottom:88px;
    position: absolute;
    width: 90px;
}
.imagenAcontecimientoArriba{
    cursor:pointer;
    position: absolute;
    right: -78px;
    text-align: right;
    top: 0px;
    width: 90px;
}
.imagenAcontecimientoAbajo{
    cursor:pointer;
    position: absolute;
    right: -80px;
    text-align: right;
    bottom:1px;
    width: 90px;
}

.imagenAcontecimientoArriba img{
    width: 80px;
}

.imagenAcontecimientoAbajo img{
    width: 80px;
}

.ventanaAcontecimiento{

    box-shadow: 0px 0px 6px 6px #9e9e9e;
    position: absolute;
    background-color: white;
    padding: 20px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
}

.botonCerrarAcontecimiento {
    background-image: url('imagenes/iconoCerrarVentanaGrisOsc.png');
    float: right;
    margin-right: -1px;
    margin-top: 2px;
    height: 10px;
    width: 10px;
    z-index: 152;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}
.tituloAcontecimientoTimeline {
    border-bottom: 1px solid #51646b;
    color: #51646b;
    font-family: garamond;
    font-size: 15px;
    font-weight: bold;
    margin-top: -3px;
    padding-bottom: 21px;
    padding-right: 28px;
    text-align: justify;
    width: 572px;
}