﻿/* START: Bubble Window callout Styles */

.calloutTopLeft {
    position:absolute;
    top:-50px;
    left:-67px;
}

.calloutTopRight {
    position:absolute;
    top:-50px;
    right:-67px;
}

.calloutBottomLeft {
    position:absolute;
    bottom:-50px;
    left:-67px;
}

.calloutBottomRight {
    position:absolute;
    bottom:-50px;
    right:-67px;
}

/* END: Bubble Window callout Styles */

/* START: Bubble window border Styles */

.bubbleWindow {
    /* Default size and position */
    position:absolute;
    top:0px;
    left:0px;
    z-index:1001; /* This ensures that the bubble is above the overlay */
}

.bubbleWindowGradient {
    position:absolute;
    top:20px;
    left:20px;
    bottom:20px;
    right:20px;
    background-color:#FFFFCA;
    background-image:-moz-linear-gradient(top, #FFFFCA, #FFFFEC); /* FF3.6 */
    background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFCA), color-stop(1, #FFFFEC));         /* Saf4+, Chrome */
    filter:progid:DXImageTransform.Microsoft.gradient(gradientType='0', startColorStr='#FFFFCA', EndColorStr='#FFFFEC');       /* IE6,IE7 */
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(gradientType='0', startColorStr='#FFFFCA', EndColorStr='#FFFFEC')"; /* IE8 */
}

.bubbleWindowContentInnerContainer {
    position:absolute;
    top:30px;
    left:30px;
    right:30px;
    bottom:20px;
    overflow:hidden;
 }

.bubbleWindowContentArea {
    position:absolute;
    top:0px;
    right:0px;
    bottom:0px;
    left:0px; /* This will be 0px in the JavaScript if the image icon is not present */
    overflow:hidden;
}

.bubbleWindowButtons {
    position:absolute;
    left:0px;
    right:0px;
    bottom:0px;
    text-align:center;
}

.bubbleWindowBottomLeftBorder {
    position:absolute;
    bottom:0px;
    left:0px;
}

.bubbleWindowBottomRightBorder {
    position:absolute;
    bottom:0px;
    right:0px;
}

.bubbleWindowLeftBorder {
    position:absolute;
    top:40px;
    width:20px;
    bottom:40px;
    background-image:url('[themeFolder]/Images/bubble_border_left.png');
    background-repeat:repeat-y;
}

.bubbleWindowRightBorder {
    position:absolute;
    top:40px;
    right:0px;
    width:20px;
    bottom:40px;
    background-image:url('[themeFolder]/Images/bubble_border_right.png');
    background-repeat:repeat-y;
}

.bubbleWindowTopBorder {
    position:absolute;
    top:0px;
    left:43px;
    right:43px;
    height:20px;
    background-image:url('[themeFolder]/Images/bubble_border_top.png');
    background-repeat:repeat-x;
}

.bubbleWindowBottomBorder {
    position:absolute;
    bottom:0px;
    left:43px;
    right:43px;
    height:20px;
    background-image:url('[themeFolder]/Images/bubble_border_bottom.png');
    background-repeat:repeat-x;
}

.bubbleWindowTopLeftBorder {
    position:absolute;
    top:0px;
    left:0px;
}

.bubbleWindowTopRightBorder {
    position:absolute;
    top:0px;
    right:0px;
}

/* END: Bubble Window border Styles */


/* START: Bubble Window animation Styles */

.bubbleWindowAnimationSingleLeftClick {
    position:absolute;
    width:74px;
    height:108px;
    background-image:url('[themeFolder]/Images/animation_single_left_click.gif');
    background-repeat:no-repeat;
}

.bubbleWindowAnimationDoubleLeftClick {
    position:absolute;
    width:74px;
    height:108px;
    background-image:url('[themeFolder]/Images/animation_double_left_click.gif');
    background-repeat:no-repeat;
}

.bubbleWindowAnimationSingleRightClick {
    position:absolute;
    width:74px;
    height:108px;
    background-image:url('[themeFolder]/Images/animation_single_right_click.gif');
    background-repeat:no-repeat;
}

.bubbleWindowAnimationKeyPress {
    position:absolute;
    width:92px;
    height:83px;
    background-image:url('[themeFolder]/Images/animation_key_press.gif');
    background-repeat:no-repeat;
}

.bubbleWindowAnimationDragDrop {
    position:absolute;
    width:85px;
    height:95px;
    background-image:url('[themeFolder]/Images/animation_drag_drop.gif');
    background-repeat:no-repeat;
}

/* END: Bubble Window animation Styles */