<style type="text/css">
            /* HOVER STYLES */
            div#question
            {
                display: none;
                position: absolute;
                width: 200px;
                padding: 10px;
                background: Ivory;
                color: #000000;
                border: 1px solid skyblue;
                font-size: 90%;
            }
            .thumbnail-item
            {
                /* position relative so that we can use position absolute for the tooltip */
                position: relative;
                float: left;
                margin: 0px 5px;
            }
        </style>
        <script type="text/javascript">
            Sys.Application.add_load(function () {
                var moveLeft = 2;
                var moveDown = 10;

                $('a#trigger').hover(function (e) {
                    $('div#question').show();
                }, function () {
                    $('div#question').hide();
                });

                $('a#trigger').mousemove(function (e) {
                    $("div#question").css('top', e.pageY + moveDown).css('left', e.pageX + moveLeft);
                });

            });
        </script>




   <asp:Label runat="server" Style="text-align: center" ID="lblReturnRatio" Text="Return Ratio">
                                            </asp:Label>
                                            <a href="#" id="trigger" tabindex="100">
                                                <img alt="help" src="Images/question.jpg" height="13px" width="13px" />
                                            </a>:
                                            <!-- TOOLTIP -->
                                            <div id="question">
                                                <p>
                                                    This is the tool tip for Return Ratio and will be replaced by surgere definition.
                                                </p>
                                            </div>