@charset "UTF-8";
/* CSS Document */

/* Default style, feel free to remove if not needed. */
body, body * {
    vertical-align: baseline;
    border: 0 none;
    outline: 0;
    padding: 0;
    margin: 0;
}


#container_dc {
    position: absolute;
    top: 0;
    left: 0;
    margin: auto;
    width: 726px;
    height: 96px;

}

#collapse_container_dc
{
    position: absolute;
    width: 726px;
    height: 88px;
    top: 0;
    left: 0;
    border: 1px solid #666666;
    z-index: 100;

}

#collapse-left-container
{
    position: absolute;
    width: 433px;
    height: 88px;
    top: 0; left: 0;
    overflow: hidden;
}

#collapse-flashes-container
{
    position: absolute;
    width: 436px;
    height: 88px;
    top: 0; left: 0;
}

#collapse-flashes-container .flash
{
    position: absolute;
    width: 21px;
    height: 21px;
    background-image: url(flash.png);
}


#collapse-right-content
{
    position: absolute;
    width: 294px;
    height: 88px;
    top: 0; right: 0;
}

#collapse-bg
{
    position: absolute;
    width: 433px;
    height: 88px;
    top: 0;
    left: 0;
    background-color: black;

}


#collapse-isi
{
    position: absolute;
    width: 294px;
    height: 88px;
    right: 0;
    top: 0px;
    z-index: 100;
    background-color: white;

}

#collapse_background_exit_dc {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0; left: 0;
    cursor:  pointer;
    opacity: 0;
    z-index: 50;
}

#collapse-footer
{
    position: absolute;
    width: 282px;
    height:13px;
    left: 0;
    bottom: 0px;
    background-image: url(collapsed_footer.gif);
    display: block;
    z-index: 160;
}


#dark-bg
{
    position: absolute;
    left: 0;
    top: 0;
}

#light-bg
{
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;

}
#end-screen-bg
{
    position: absolute;
    width: 433px; height: 180px;
    left: 0; top: 0px;
    opacity:0;
    background-image: url(collapse_end_bg.jpg);
}



#text-1
{
    position: absolute;
    width: 393px; height: 90px;
    left: 0; left: 0;
    opacity: 0;
    background-image: url(txt0.png);
}

#text-2
{
    position: absolute;
    width: 302px; height: 90px;
    left: 0; left: 0;
    opacity: 0;
    background-image: url(txt1.png);
}

#text-3
{
    position: absolute;
    width: 325px; height: 90px;
    left: 0; top: 0;
    opacity: 0;
    background-image: url(txt2.png);
}

#text-4
{
    position: absolute;
    width: 302px; height: 90px;
    left: 0; left: 0;
    opacity: 0;
    background-image: url(txt3.png);
}

#blast
{
    position: absolute;
    width: 291px; height: 90px;
    right: 0; top: 0;
    opacity: 0;
    background-image: url(blast.png);
}

#bell
{
    position: absolute;
    width: 176px; height: 259px;
    top: 180px;
    left: 80px;
    background-size: cover;
    background-image: url(bell.png);
}

#hammer
{
    position: absolute;
    transform-origin: 10% 20%;

    width: 142px;
    height: 57px;
    left: 45px;
    top: 17px;
    padding: -80px;
    background-size: cover;
    background-image: url(hammer.png);
}


#inlayta-logo
{
    position: absolute;
    width: 119px; height: 90px;
    right: 0; top: 0;
    opacity: 0;
    background-image: url(inlayta_logo.png);
}

#flash1
{
    left: 112px;
    top: 10px;
    opacity: 0;
}

#flash2
{
    left: 181px;
    top: 39px;
    opacity: 0;

}

#flash3
{
    left: 138px;
    top: 58px;
    opacity: 0;

}

#flash4
{
    left: 240px;
    top: 7px;
    opacity: 0;

}

#flash5
{
    left: 267px;
    top: 62px;
    opacity: 0;

}

#flash6
{
    left: 65px;
    top: 62px;
    opacity: 0;

}

#flash7
{
    left: 21px;
    top: 44px;
    opacity: 0;

}

#flash8
{
    left: 232px;
    top: 80px;
    opacity: 0;

}


#flash9
{
    left: 215px;
    top: 31px;
    opacity: 0;

}

#flash10
{
    left: 144px;
    top: 40px;
    opacity: 0;

}



/* Invisible button for background clickthrough. */
#background_exit_dc {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	cursor: pointer;
	opacity: 0;
	z-index: 400;

}


/* Invisible button for background clickthrough. */
#expanded_background_exit_dc {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	cursor: pointer;
	opacity: 0;

}

#previous-btn
{
    position: absolute;
    width: 65px;
    height: 81px;
    left: 0;
    top: 121px;
    background-color: transparent;
    cursor: pointer;
}

#next-btn
{
    position: absolute;
    width: 98px;
    height: 81px;
    right: 0;
    top: 121px;
    cursor: pointer;
    background-color: transparent;

}

#reference-btn
{
    position: absolute;
    width: 70px;
    height: 11px;
    left: 255px;
    bottom: 7px;
    background-color: transparent;
    cursor: pointer;
}

#sd-btn
{
    position: absolute;
    width: 90px;
    height: 11px;
    left: 328px;
    bottom: 7px;
    cursor: pointer;
    background-color: transparent;

}

#close-btn
{
    position: absolute;
    width: 24px;
    height: 24px;
    left: 380px;
    top:25px;
    cursor: pointer;
    background-color: transparent;

}

#chart-zoom-btn
{
    position: absolute;
    width: 20px;
    height: 20px;
    left: 305px;
    top: 131px;
    cursor: pointer;
    background-color: transparent;

}

#collapse-pi-btn
{
    position: absolute;
    width: 110px;
    height: 12px;
    bottom: 0;
    left: 0;
    z-index: 161;
    cursor: pointer;
    background-color: transparent;

}

#expanded-pi-btn
{
    position: absolute;
    width: 110px;
    height: 12px;
    bottom: 0;
    left: 0;
    z-index: 161;
    cursor: pointer;
    background-color: transparent;
    z-index: 566;

}

.hide
{
    display: none;
}

.show
{
    display: block;
}

.isi {
    position: absolute;
    width: 242px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 10px;
    color: #4E4D4F;
}

.isi p
{
    font-size: 10px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
}

.isi .isi-header
{
    font-size: 10px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 0px;
}


.isi p span
{
    color: #E90B8D;
    font-weight: bold;
}

.isi h3
{
    color: #E90B8D;
    font-size: 10px;
    font-weight: normal;
    margin: 5px 5px 2px;
}

.isi ul
{
    list-style-type: disc;
    list-style-image: none;
}

.isi .pfizer-logo
{
    position: absolute;
    margin: 0;
    padding: 0;
    right: 0;
}

.isi .footer
{
    position: absolute;
    left: 0;
}

.isi ul li
{
    padding-left: 1em;
    text-indent: -.7em;
}


.isi ul li:before
{
    content: "• ";
    color: #C7074F;
    font-weight: bold;
    font-size: 12px;
}


/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */

/*
Your custom scrollbar images do not need to have the same size as in example images.
You do not need to define images for all elements, you may want to have some transparency,
or simply a filled color without using an image. The example images in this archive is optimized
for the least number of http calls, only 2 images are needed for full operation, but you may have
separate images for each element or make different group combinations in the images, or simply
have a color defined for horizontal scrollbar and horizontal scrollbase, and get away with a single
image for vertical bar if you will only use vertical scrollbars.
*/


/* Basic styling with no images starts here */

/* IMPORTANT:
Note that, even if you are not expecting to use horizontal scrollbars,
you should at least define colors for it, e.g. you never know what font size
your users will force on the page
*/

/* .scrollgeneric is required for proper scrollbar display,
not for user customization, and is mandatory*/
.scrollgeneric {
    line-height: 1px;
    font-size: 1px;
    position: absolute;
    top: 0; left: 0;
}

/* For scrollbars, defining a color for background alongside with an image
is always a good idea, this way the scrollbars are visible until images load */
.vscrollerbase {
    /* vscrollerbase is the div that holds the scrollbar (parent of vscrollerbar)
    this represents the whole background of the scrolltrack */
    width: 12px;
    background: url("scroller_track.gif") repeat-y;
}

.vscrollerbar {
    width: 12px;
    /* it is advisable to use a background-color this element for times when there are problems
    loading images or when the user agent does not load them, but since we are using an alpha
    transparent scrollbar body and cap images, we cannot do this for this type of style.*/
    height: 13px !important;

}


/* basic style ends here, this was actually all that is required to run fleXcroll,
but you won't be able to see any scrollbar as we have not provided a background-color
as this example style uses alpha images.
*/


/* styles for scrollbar images start here */

.vscrollerbar {
    /*This information is not used to style the scrollbars, but the value is used to
    get how much scrollbar will be padded against the scrollerbase. The style padding will
    be automatically be turned off by the script. The greater the padding, the further away
    the scrollbar stops away from both ends. This may be used, for example, to provide space
    for our arrow heads. It has to be in px.
    */
    padding: 12px;
}

.vscrollerbarbeg {
    /* Top cap for vertical scrollbar*/

    background: url("scroller_thumb.gif") no-repeat;
    height: 12px;

    width: 12px;
    /* Height of this class is normally set by the script, to fit the scrollbar,
    but we fix it by !important, so that we can see scrollbar middle element */
    height: 12px !important;
}

.vscrollerbarmid {
    /* This is a new element provided by v2.1.0, it can be used mainly for alpha transparent scrollbar images.
    This element spans between vscrollerbarbeg and end: its height is set automatically*/
    width: 12px;
    height: 12px;

    background: url("scroller_thumb.gif") repeat-y;
}

.vscrollerbarend {
    /* Bottom cap for vertical scrollbar*/

    background: url("scroller_thumb.gif")  no-repeat;
    width: 12px;
    height: 12px !important;
}

.vscrollerbasebeg {
    /* Vertical scrollbar's base top-cap */
    /* We can provide the top arrow image here, and v2.1.0 supports seperate movements for these parts.*/
    background: url("up_arrow.gif") no-repeat;
    width: 12px;
    height: 12px;
}

.vscrollerbasemid {
    /*This element is new, and it spans between .vscrollerbasebeg and end, its height is set automatically.*/
    /* We are not using this element in this style, so we do not make any style declerations.*/
    /* width: 20px; */
    height: 12px;

}

.vscrollerbaseend {
    /* Vertical scrollbar's base bottom-cap */
    /* We can provide the bottom arrow image here, and v2.1.0 supports seperate movements for these parts.*/
    background: url("down_arrow.gif") no-repeat;
    width: 12px;
    height: 12px;
}


/* The :hover is not required, but they provide simple css animation when hovering
by showing different parts of our  background images */


/* Scroll Bar Master Styling Ends Here */

