function Wait(src) {
    $(src).delay(2000);
}
$(document).ready(function() {
    if (screen.width <= 800) {
        alert('This website is designed for atleast 1024x768 resolution. Please increase your current resolution.');
    }
    if ($.browser.msie) {

        var ver = $.browser.version;

        if (ver < parseFloat('7.0')) {
            window.location.href = 'RedirectBrowser.htm';
        }
    }
    else {

        $.each($.browser, function(i, val) {

            if (i == 'opera' && val == true) {
                if ($.browser.version < parseFloat('10.50')) {
                    window.location.href = 'RedirectBrowser.htm';
                }
            }
            else if (i == 'mozilla' && val == true) {
//                var _19 = $.browser.version.search("1.9");
//                var _20 = $.browser.version.search("2.0");
//                var _50 = $.browser.version.search("5.0");
//                var _60 = $.browser.version.search("6.0");
//                var _70 = $.browser.version.search("7.0");
//                var _80 = $.browser.version.search("8.0");
//                var _90 = $.browser.version.search("9.0");
//                var _100 = $.browser.version.search("10.0");
//                //alert(_19 + ' ' + _20 + ' ' + _50);
//                if (_19 == -1 && _20 == -1 && _50 == -1 && _60 == -1 && _70 == -1 && _80 == -1 && _90 == -1 && _100 == -1) {
//                    //window.location.href = 'RedirectBrowser.htm';
//                }
            }
            //WEBKIT DETECTION BLOCKED
            //            else if (i == 'webkit' && val == true) {
            //                var version = $.browser.version;
            //                if (version < 533) {
            //                    window.location.href = 'RedirectBrowser.htm';
            //                }
            //                //                var chr = $.browser.version.search("534");
            //                //                if (chr == -1) {}
            //            }
        });
    }
    $('#slider').anythingSlider();
    $('.a_top').click(function() {
        $('.LoginBox').animate({
            top: '20%'
        }, 800, 'linear');
    });
    $('.a_Site').click(function() {
        window.open("http://210.56.8.102/wpsupport/", '_blank');
    });

    $('#imgClose').click(function() {
        $('.LoginBox').animate({
            top: '-200px'
        }, 800, 'linear');
    });
    $('.LI_Login').hover(function() {
        $(this).css('background-color', '#FFFAEB');
        $(this).css('color', '#747E80');
        $(this).css('cursor', 'pointer');
    }, function() {
        $(this).css('background-color', '#747E80');
        $(this).css('color', '#FFFAEB');
        $(this).css('cursor', 'auto');
    });

    $('#Log1').click(function() {
        window.open('http://www.ivap.org.pk');
    });
    $('#Log2').click(function() {
        window.open('http://www.cccm.com.pk');
    });
    $('#Log3').click(function() {
        window.open('');
    });
    $('#Log4').click(function() {
        window.open('');
    });
    $('#Log5').click(function() {
        window.open('');
    });
    var out_ = 1;
    var in_ = 0;
    var mi_td1 = true;
    var mi_td2 = true;
    var mi_td3 = true;
    var mi_td4 = true;
    var mo_td1 = true;
    var mo_td2 = true;
    var mo_td3 = true;
    var mo_td4 = true;

    var mi_panel = true;
    var mo_panel = true;

    var mi_slider = true;
    var mo_slider = true;
    var cursor = 'auto';
    var mi_body = true;
    var mo_body = true;

    $('.kwicks').kwicks({
        max: 400,
        spacing: 2
    });
    $('#dTop').css('z-index', '10');
    $('#panel').hide();
    $('#Overlay').hide();
    $('#Li1').html('<div id="lD1" class="dBox">    Introduction    </div>');
    $('#Li2').html('<div id="lD2" class="dBox">    Contact    </div>');
    $('#Li3').html('<div id="lD3" class="dBox">    Careers    </div>');
    $('#Li4').html('<div id="lD4" class="dBox">    Login    </div>');
    $('.moreinfo').hover(function() {
        $(this).css('cursor', 'pointer');
        $(this).css('color', '#FFCC66');
    }, function() {
        $(this).css('cursor', 'auto');
        $(this).css('color', '#99CCFF');
    });
    $('#imgLogo').click(function() {
        window.open('Home.htm', '_self');
    });
    $('#imgLogo').hover(function() {
        $(this).css('cursor', 'pointer');
    }, function() {
        $(this).css('cursor', 'auto');
    });

    $('*').mouseover(function() {
        cursor = $(this).css('cursor');
    });
    if (screen.width >= 1024) {
        $('.top_tds_b').css('width', '12%');

    }
    if (screen.width <= 1024) {
        $('.smallimg').css('width', '70px');
        $('.smallimg').css('height', '70px');
        $('.smallimg').css('position', 'relative');
        $('.smallimg').css('top', '30px');
        $('.moreinfo').css('top', '0px');
        $('.pCard').css('font-size', '11px');
        $('.pEP').css('font-size', '11px');

    }
    else if (screen.width <= 1280 && screen.width > 1024) {
        $('.smallimg').css('width', '90px');
        $('.smallimg').css('height', '90px');
        $('.smallimg').css('position', 'relative');
        $('.smallimg').css('top', '20px');
    }
    $('#Li1').hover(function() {
        //alert(cursor);
        if (in_ == 0 && out_ == 1) {
            $('#Li1').css('top', '0%');
            $('#Li1').html('<div id="lD1" class="dBox">Introduction <br /><br /> <br /> <p class="p_InnerBox">    Workplains Ltd. offers a global solution for business process automation.   <br /><br /><a id="more_ld1" style="font-family: Arial; font-size: x-small; font-weight: bolder; color: #99CCFF; text-decoration: underline; font-style: normal">more >></a> </p> </div>');
            $('#lD1').animate({
                top: "-=14%"
            }, 200);
            $('#lD1').animate({
                width: "85%"
            }, 200);
            $('#lD1').animate({
                height: "50%"
            }, 500);
            $('#lD1').animate({
                opacity: 1
            }, 200, function() { $('p').css('display', 'block'); });
            $('#more_ld1').bind({ click: function() {
                in_ = 1;
                out_ = 0;
                $('#Li1').stop(true, true).html('<div id="LD_1" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
                $('#Li1').css('top', '-38%');
                $('#Li1').css('height', '600px');
                $('#Li1').animate({
                    width: '400px',
                    height: '600px'
                }, 500);

            }
            });
        }
    }, function() {

        in_ = 0;
        out_ = 1;
        $('#Li1').css('top', '0%');
        $('#Li1').html('<div id="lD1" class="dBox">    Introduction </div>');
        $('#lD1').animate({
            top: "+=0%",
            width: "80%",
            height: "16%",
            opacity: 1
        }, 300, function() { $('p').css('display', 'none'); });

    });

    //            $('#lD1').click(function() {
    //                if (!$('#Li1 > div:contains("Workplains is where potential is realized. And careers are made.")').length > 0) {
    //                    $('#Li1').css('top', '-38%');
    //                    $('#Li1').css('height', '600px');
    //                    $('#Li1').animate({
    //                        width: '400px',
    //                        height: '600px'
    //                    }, 500);
    //                    $('#Li1').stop(true, true).html('<div id="LD_1" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
    //                }

    //            });


    $('#Li2').hover(function() {
        if (in_ == 0 && out_ == 1) {
            $('#Li2').css('top', '0%');
            $('#Li2').html('<div id="lD2" class="dBox">Contact<br /><br /> <br /> <p class="p_InnerBox">    Workplains Ltd. offers a global solution for business process automation.   <br /><br /><a id="more_ld2" style="font-family: Arial; font-size: x-small; font-weight: bolder; color: #99CCFF; text-decoration: underline; font-style: normal">more >></a> </p> </div>');
            $('#lD2').animate({
                top: "-=14%"
            }, 200);
            $('#lD2').animate({
                width: "85%"
            }, 200);
            $('#lD2').animate({
                height: "50%"
            }, 500);
            $('#lD2').animate({
                opacity: 1
            }, 200, function() { $('p').css('display', 'block'); });
            $('#more_ld2').bind({ click: function() {
                in_ = 1;
                out_ = 0;
                $('#Li2').stop(true, true).html('<div id="LD_2" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
                $('#Li2').css('top', '-38%');
                $('#Li2').css('height', '600px');
                $('#Li2').animate({
                    width: '400px',
                    height: '600px'
                }, 500);

            }
            });
        }
    }, function() {
        in_ = 0;
        out_ = 1;
        $('#Li2').css('top', '0%');
        $('#Li2').html('<div id="lD2" class="dBox">    Contact    </div>');
        $('#lD2').animate({
            top: "+=0%",
            width: "80%",
            height: "16%",
            opacity: 1

        }, 300, function() { $('p').css('display', 'none'); });
    });

    //            $('#Li2').click(function() {
    //                if (!$('#Li2 > div:contains("Workplains is where potential is realized. And careers are made.")').length > 0) {
    //                    $('#Li2').css('top', '-38%');
    //                    $('#Li2').css('height', '600px');
    //                    $('#Li2').animate({
    //                        width: '400px',
    //                        height: '600px'
    //                    }, 500);
    //                    $(this).html('<div class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                              </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
    //                }
    //            });

    $('#Li3').hover(function() {
        if (in_ == 0 && out_ == 1) {
            $('#Li3').css('top', '0%');
            $('#Li3').html('<div id="lD3" class="dBox">Careers<br /><br /><br /><p class="p_InnerBox">    Workplains provides rich opportunities and interesting challenges. We offer the possibility to move ahead more rapidly than is possible at most other firms. <br /><br /><a id="more_ld3" style="font-family: Arial; font-size: x-small; font-weight: bolder; color: #99CCFF; text-decoration: underline; font-style: normal">more >></a> </p> </div>');

            $('#lD3').animate({
                top: "-=14%"
            }, 200);
            $('#lD3').animate({
                width: "85%"
            }, 200);
            $('#lD3').animate({
                height: "50%"
            }, 500);
            $('#lD3').animate({
                opacity: 1
            }, 200, function() { $('p').css('display', 'block'); });
            $('#more_ld3').bind({ click: function() {
                in_ = 1;
                out_ = 0;
                $('#Li3').stop(true, true).html('<div id="LD_3" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
                $('#Li3').css('top', '-38%');
                $('#Li3').css('height', '600px');
                $('#Li3').animate({
                    width: '400px',
                    height: '600px'
                }, 500);

            }
            });
        }
    }, function() {
        in_ = 0;
        out_ = 1;
        $('#Li3').css('top', '0%');
        $('#Li3').html('<div id="lD3" class="dBox">    Careers    </div>');
        $('#lD3').animate({
            top: "+=0%",
            width: "80%",
            height: "16%",
            opacity: 1

        }, 300, function() { $('p').css('display', 'none'); });

    });

    //            $('#Li3').click(function() {
    //                if (!$('#Li3 > div:contains("Workplains is where potential is realized. And careers are made.")').length > 0) {
    //                    $('#Li3').css('top', '-38%');
    //                    $('#Li3').css('height', '600px');
    //                    $('#Li3').animate({
    //                        width: '400px',
    //                        height: '600px'
    //                    }, 500);
    //                    $(this).html('<div class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                              </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
    //                }
    //            });

    //            $('#Li4').hover(function() {
    //                if (in_ == 0 && out_ == 1) {
    //                    $('#Li4').css('top', '0%');
    //                    $('#Li4').html('<div id="lD3" class="dBox">Login<br /><br /><br /><p class="p_InnerBox">    Workplains provides rich opportunities and interesting challenges. We offer the possibility to move ahead more rapidly than is possible at most other firms. <br /><br /><a id="more_ld4" style="font-family: Arial; font-size: x-small; font-weight: bolder; color: #99CCFF; text-decoration: underline; font-style: normal">more >></a> </p> </div>');
    //                    $('#lD4').animate({
    //                        top: "-=14%"
    //                    }, 200);
    //                    $('#lD4').animate({
    //                        width: "85%"
    //                    }, 200);
    //                    $('#lD4').animate({
    //                        height: "50%"
    //                    }, 500);
    //                    $('#lD4').animate({
    //                        opacity: 1
    //                    }, 200, function() { $('p').css('display', 'none'); });
    //                    $('#more_ld4').bind({ click: function() {
    //                        in_ = 1;
    //                        out_ = 0;
    //                        $('#Li4').stop(true, true).html('<div id="LD_4" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
    //                        $('#Li4').css('top', '-38%');
    //                        $('#Li4').css('height', '600px');
    //                        $('#Li4').animate({
    //                            width: '400px',
    //                            height: '600px'
    //                        }, 500);

    //                    }
    //                    });
    //                }
    //            }, function() {
    //            in_ = 0;
    //            out_ = 1;
    //                $('#Li4').css('top', '0%');
    //                $('#Li4').html('<div id="lD4" class="dBox">   Login   </div>');
    //                $('#lD4').animate({
    //                    top: "+=0%",
    //                    width: "80%",
    //                    height: "16%",
    //                    opacity: 1

    //                }, 300, function() { $('p').css('display', 'none'); });

    //            });
    //            $('#Li4').click(function() {
    //                if (!$('#Li4 > div:contains("Workplains is where potential is realized. And careers are made.")').length > 0) {
    //                    $('#Li4').css('top', '-38%');
    //                    $('#Li4').css('height', '600px');
    //                    $('#Li4').animate({
    //                        width: '400px',
    //                        height: '600px'
    //                    }, 500);
    //                    $(this).html('<div class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                              </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
    //                }
    //            });

    $('#Li4').hover(function() {
        if (in_ == 0 && out_ == 1) {
            $('#Li4').css('top', '0%');
            $('#Li4').html('<div id="lD4" class="dBox">Login<br /><br /><br /><p class="p_InnerBox">    Workplains provides rich opportunities and interesting challenges. We offer the possibility to move ahead more rapidly than is possible at most other firms. <br /><br /><a id="more_ld4" style="font-family: Arial; font-size: x-small; font-weight: bolder; color: #99CCFF; text-decoration: underline; font-style: normal">more >></a> </p> </div>');

            $('#lD4').animate({
                top: "-=14%"
            }, 200);
            $('#lD4').animate({
                width: "85%"
            }, 200);
            $('#lD4').animate({
                height: "50%"
            }, 500);
            $('#lD4').animate({
                opacity: 1
            }, 200, function() { $('p').css('display', 'block'); });
            $('#more_ld4').bind({ click: function() {
                in_ = 1;
                out_ = 0;
                $('#Li4').stop(true, true).html('<div id="LD_4" class="li_Div_Content">        <table style="width: 100%; border-collapse:collapse; border:none;">            <tr style="border:none;">                <td style="vertical-align:middle; position:relative; border:none;padding-left:3%; width:60px; text-align:left; font-family: Arial; font-size: medium; color: #444444; font-weight: bold">                    Introduction                </td>                <td style="text-align:right;">                                </td>                            </tr>            <tr>                <td colspan="2" style="border:none; margin:0px auto; padding:0px; position:relative;">                    <img src="Images/Intro_Box.jpg" alt="" class="ImgBoxMID"/>                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: large; color: #6699FF; font-weight: bold; text-align:left;">                    Workplains is where potential is realized. And careers are made.                </td>            </tr>            <tr>                <td colspan="2" style="padding: 4% 4% 4% 4%; border:none; font-family: Arial; font-size: small; color: #808080; text-align: left;">                    People create success, which is why we go to great lengths to attract, inspire and reward creativity and talent. As a global business, our people come from all over the world and represent different nationalities, educational backgrounds and life experiences. We welcome their unique perspectives, their energy and ideas and their willingness to learn as well as to teach.             </td>            </tr>        </table>        <br />        <br />    </div>');
                $('#Li4').css('top', '-38%');
                $('#Li4').css('height', '600px');
                $('#Li4').animate({
                    width: '400px',
                    height: '600px'
                }, 500);

            }
            });
        }
    }, function() {
        in_ = 0;
        out_ = 1;
        $('#Li4').css('top', '0%');
        $('#Li4').html('<div id="lD4" class="dBox">    Login    </div>');
        $('#lD4').animate({
            top: "+=0%",
            width: "80%",
            height: "16%",
            opacity: 1

        }, 300, function() { $('p').css('display', 'none'); });

    });
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    /////////////////////////////////////////////////////////////END REGION FOR TOP LI AND BOTTOM TD///////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    $('#td1').hover(function() {
        //Others
        $('#Overlay').show();
        $('.top_tds_b').css('background-color', 'white');
        $('.top_tds_s').css('background-color', 'white');
        WhiteSearch();
        //
        if ($('#td2').css('color', 'black')) {
            $('#td2').css('color', '#8f8f8f');
        }
        if ($('#td3').css('color', 'black')) {
            $('#td3').css('color', '#8f8f8f');
        }
        if ($('#td4').css('color', 'black')) {
            $('#td4').css('color', '#8f8f8f');
        }
        if ($('#td5').css('color', 'black')) {
            $('#td5').css('color', '#8f8f8f');
        }
        //                if ($('#td6').css('color', 'black')) {
        //                    $('#td6').css('color', '#8f8f8f');
        //                }

        $(this).css('background-color', 'white');
        $(this).css('color', 'black');
        $(this).css('cursor', 'pointer');
        if ($("td1: contains('Products')")) {
            $('#panel').html('<table style="text-align: left; width: 100%;">        <tr>            <td style="width:50%; vertical-align:top; position:relative;">                <ul class="UL_">                    <li><a href="OV_PR.htm" class="a1_Pro">Overview</a> </li>                    <li><a href="KB_PR.htm" class="a2_Pro">Key Benefits</a> </li>                    <li><a href="MMP_PR.htm" class="a3_Pro">BPM Products</a><br /><a href="ODBPM.htm" style="font-size:smaller;" class="a3x_Pro">On Demand BPM | </a>                    <a href="MANBPM.htm" style="font-size:smaller;" class="a3x_Pro">Managed BPM | </a>                    <a href="OPBPM.htm" style="font-size:smaller;" class="a3x_Pro">On Premise BPM</a> </li>                                        <li><a href="CARD_PR.htm" class="a5_Pro">CollectAssessReportData (CARD)</a><br /><a href="CARD_BASIC.htm" style="font-size:smaller;" class="a3x_Pro">Basic | </a>                    <a href="CARD_PRO.htm" style="font-size:smaller;" class="a3x_Pro">Professional | </a>                    <a href="CARD_ENTER.htm" style="font-size:smaller;" class="a3x_Pro">Enterprise </li>                    <li><a href="EP_PR.htm" class="a6_Pro">E-Procure</a> </li>                </ul>            </td>            <td style="text-align:center; vertical-align:middle;">                <img alt="" id="imgProducts" src="Images/1.jpg" />            </td>        </tr>    </table>');
            BindA_td1();
        }
        $('#panel').stop(true, true).show();
        //                //$('#overlay').show();

    }, function() {
        //Others
    });

    $('#td1').click(function() {
        window.open('Products.htm', '_self');
    });
    $('#td2').hover(function() {
        //Others
        $('.top_tds_b').css('background-color', 'white');
        $('.top_tds_s').css('background-color', 'white');
        WhiteSearch();
        //
        if ($('#td1').css('color', 'black')) {
            $('#td1').css('color', '#8f8f8f');
        }
        if ($('#td3').css('color', 'black')) {
            $('#td3').css('color', '#8f8f8f');
        }
        if ($('#td4').css('color', 'black')) {
            $('#td4').css('color', '#8f8f8f');
        }
        if ($('#td5').css('color', 'black')) {
            $('#td5').css('color', '#8f8f8f');
        }
        //                if ($('#td6').css('color', 'black')) {
        //                    $('#td6').css('color', '#8f8f8f');
        //                }
        $(this).css('background-color', 'white');
        $(this).css('color', 'black');
        $(this).css('cursor', 'pointer');
        if ($("td2: contains('Services')")) {
            $('#panel').html('<table style="text-align: left; width: 100%;">        <tr>            <td style="width: 50%; vertical-align: top; position: relative;">                <ul class="UL_">                    <li><a href="OV_SV.htm" class="a1_Serv">Overview</a> </li>                    <li><a href="BPMCon_SV.htm" class="a2_Serv">BPM Consulting</a> </li>                    <li><a href="BPRCon_SV.htm" class="a3_Serv">BPR Consulting</a> </li>                    <li><a href="WPT_SV.htm" class="a4_Serv">WP Trainings</a> </li>                    <li><a href="WPSup_SV.htm" class="a5_Serv">WP Support</a> </li>                </ul>            </td>            <td style="text-align: center; vertical-align: middle;">                <img alt="" id="img1" src="Images/2.jpg" />            </td>        </tr>    </table>');
            BindA_td2();
        }
        $('#panel').stop(true, true).show();
        //$('#overlay').show();
    }, function() {
        //Others
        //


    });
    $('#td2').click(function() {
        window.open('Services.htm', '_self');
    });
    $('#td3').hover(function() {
        $('.top_tds_b').css('background-color', 'white');
        $('.top_tds_s').css('background-color', 'white');
        WhiteSearch();
        if ($('#td2').css('color', 'black')) {
            $('#td2').css('color', '#8f8f8f');
        }
        if ($('#td1').css('color', 'black')) {
            $('#td1').css('color', '#8f8f8f');
        }
        if ($('#td4').css('color', 'black')) {
            $('#td4').css('color', '#8f8f8f');
        }
        if ($('#td5').css('color', 'black')) {
            $('#td5').css('color', '#8f8f8f');
        }
        //                if ($('#td6').css('color', 'black')) {
        //                    $('#td6').css('color', '#8f8f8f');
        //                }
        $(this).css('background-color', 'white');
        $(this).css('color', 'black');
        $(this).css('cursor', 'pointer');
        if ($("td3: contains('Solutions')")) {
            $('#panel').html('<table style="text-align: left; width: 100%;">        <tr>            <td style="width: 50%; vertical-align: top; position: relative;">                <ul class="UL_">                    <li><a href="OV_Sol.htm" class="a1_Sol">Overview</a> </li>                    <li><a href="WPI_Sol.htm" class="a2_Sol">WP Industry Solutions</a> </li>                    <li><a href="WPB_Sol.htm" class="a3_Sol">WP Business Solutions</a> </li>                </ul>            </td>            <td style="text-align: center; vertical-align: middle;">                <img alt="" id="img2" src="Images/3.jpg" />            </td>        </tr>    </table>');
            BindA_td3();
        }
        $('#panel').stop(true, true).show();
        //$('#overlay').show();
    }, function() {


    });
    $('#td3').click(function() {
        window.open('Solutions.htm', '_self');
    });
    $('#td4').hover(function() {
        $('.top_tds_b').css('background-color', 'white');
        $('.top_tds_s').css('background-color', 'white');
        WhiteSearch();
        if ($('#td2').css('color', 'black')) {
            $('#td2').css('color', '#8f8f8f');
        }
        if ($('#td3').css('color', 'black')) {
            $('#td3').css('color', '#8f8f8f');
        }
        if ($('#td1').css('color', 'black')) {
            $('#td1').css('color', '#8f8f8f');
        }
        if ($('#td5').css('color', 'black')) {
            $('#td5').css('color', '#8f8f8f');
        }
        //                if ($('#td6').css('color', 'black')) {
        //                    $('#td6').css('color', '#8f8f8f');
        //                }
        $(this).css('background-color', 'white');
        $(this).css('color', 'black');
        $(this).css('cursor', 'pointer');
        if ($("td4: contains('Customers')")) {
            $('#panel').html('<table style="text-align: left; width: 100%;">        <tr>            <td style="width: 50%; vertical-align: top; position: relative;">                <ul class="UL_">                    <li><a href="OV_CU.htm" class="a1_Cu">Overview</a> </li>                    <li><a href="CASEST_CU.htm" class="a2_Cu">Case studies</a> </li>                    <li><a href="TS_CU.htm" class="a3_Cu">Testimonials</a> </li>                </ul>            </td>            <td style="text-align: center; vertical-align: middle;">                <img alt="" id="img3" src="Images/4.jpg" />            </td>        </tr>    </table>');
            BindA_td4();
        }
        $('#panel').stop(true, true).show();
        //$('#overlay').show();
    }, function() {

    });
    $('#td4').click(function() {
        window.open('Customers.htm', '_self');
    });
    $('#td5').hover(function() {
        $('.top_tds_b').css('background-color', 'white');
        $('.top_tds_s').css('background-color', 'white');
        WhiteSearch();
        if ($('#td2').css('color', 'black')) {
            $('#td2').css('color', '#8f8f8f');
        }
        if ($('#td3').css('color', 'black')) {
            $('#td3').css('color', '#8f8f8f');
        }
        if ($('#td4').css('color', 'black')) {
            $('#td4').css('color', '#8f8f8f');
        }
        if ($('#td1').css('color', 'black')) {
            $('#td1').css('color', '#8f8f8f');
        }
        //                if ($('#td6').css('color', 'black')) {
        //                    $('#td6').css('color', '#8f8f8f');
        //                }
        $(this).css('background-color', 'white');
        $(this).css('color', 'black');
        $(this).css('cursor', 'pointer');
        if ($("td5: contains('About Us')")) {
            $('#panel').html('<table style="text-align: left; width: 100%;">        <tr>            <td style="width: 50%; vertical-align: top; position: relative;">                <ul class="UL_">                    <li><a href="OV_AU.htm" class="a1_Au">Overview</a> </li>                    <li><a href="WPT_AU.htm" class="a2_Au">WP Team</a> </li>                    <li><a href="Careers_AU.htm" class="a3_Au">Careers@WP</a> </li>                    <li><a href="Contact_AU.htm" class="a4_Au">Contact WP</a> </li>                </ul>            </td>            <td style="text-align: center; vertical-align: middle;">                <img alt="" id="img4" src="Images/5.jpg" />            </td>        </tr>    </table>');
            BindA_td5();
        }
        $('#panel').stop(true, true).show();
        //$('#overlay').show();
    }, function() {

    });
    $('#td5').click(function() {
        window.open('About.htm', '_self');
    });

    //            $('#td6').hover(function() {
    //                $('.top_tds_b').css('background-color', 'white');
    //                $('.top_tds_s').css('background-color', 'white');
    //                WhiteSearch();
    //                if ($('#td2').css('color', 'black')) {
    //                    $('#td2').css('color', '#8f8f8f');
    //                }
    //                if ($('#td3').css('color', 'black')) {
    //                    $('#td3').css('color', '#8f8f8f');
    //                }
    //                if ($('#td4').css('color', 'black')) {
    //                    $('#td4').css('color', '#8f8f8f');
    //                }
    //                if ($('#td5').css('color', 'black')) {
    //                    $('#td5').css('color', '#8f8f8f');
    //                }
    //                if ($('#td1').css('color', 'black')) {
    //                    $('#td1').css('color', '#8f8f8f');
    //                }
    //                $(this).css('background-color', 'white');
    //                $(this).css('color', 'black');
    //                $(this).css('cursor', 'pointer');
    //                if ($("td6: contains('Case Study')")) {
    //                    $('#panel').text('Case Study');
    //                }
    //                $('#panel').stop(true, true).show();
    //                //$('#overlay').show();
    //            }, function() {

    //            });

    $("#tdSearch").hover(function() {
        $('#panel').stop(true, true).hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        $(this).css('background-color', 'white');
        $('#txtSearch_').css('background-color', 'white');
        $('#txtSearch_').css('color', '#808080');
        $('#Go').css('background-color', 'white');
        $('#Go').css('cursor', 'pointer');
        $('#overlay').hide();
    }, function() {
        $(this).css('background-color', '#444444');
        $("#txtSearch_").css('background-color', '#444444');
        $('#txtSearch_').css('color', '#8f8f8f');
        $('#Go').css('background-color', '#444444');
        $('#Go').css('cursor', 'auto');

        if ($('#txtSearch_').val('')) {
        }
        $('#txtSearch_').val('Search');
    });

    $("#txtSearch_").click(function() {
        $('#txtSearch_').val('');
    });

    $('#panel').hover(function() {
        $(this).css('cursor', 'pointer');
    }, function() {
    });

    $('#mBody').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();
    }, function() {

    });

    $('#main').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });

    $('#wplogo').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });

    $('#dTop').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });
    $('#blank').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });
    $('#blank2').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });


    $('.main_Intro').hover(function() {
        $('#panel').hide();
        $('#overlay').hide();
        $('.top_tds_b').css('background-color', '#444444');
        $('.top_tds_s').css('background-color', '#444444');
        $('.top_tds_b').css('color', '#8f8f8f');
        $('.top_tds_s').css('color', '#8f8f8f');
        NormalSearch();

    }, function() {

    });



});

$('.a1').hover(function() {
    $(this).css('color', '#444444');
    $(this).css('background-color', '#444444');
}, function() {
    $(this).css('color', '#8f8f8f');
    $(this).css('background-color', 'white');
});
function WhiteSearch() {
    $('#tdSearch').css('background-color', 'white');
    $('#txtSearch_').css('background-color', 'white');
    $('#txtSearch_').css('color', '#808080');
    $('#Go').css('background-color', 'white');
    $('#Go').css('cursor', 'pointer');
}

function NormalSearch() {
    $('#tdSearch').css('background-color', '#444444');
    $("#txtSearch_").css('background-color', '#444444');
    $('#txtSearch_').css('color', '#8f8f8f');
    $('#Go').css('background-color', '#444444');
    $('#Go').css('cursor', 'auto');
}
$.fn.extend({
    disableSelection: function() {
        this.each(function() {
            if (typeof this.onselectstart != 'undefined') {
                this.onselectstart = function() { return false; };
            } else if (typeof this.style.MozUserSelect != 'undefined') {
                this.style.MozUserSelect = 'none';
            } else {
                this.onmousedown = function() { return false; };
            }
        });
    }
});
function BindA_td1() {
    $('.a1_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a2_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3_Pro').bind({ click: function() {
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');

    }
    });
    $('.a4_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a5_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a6_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3x_Pro').bind({ click: function() {

    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
}
function BindA_td2() {
    $('.a1_Serv').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a2_Serv').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3_Serv').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a4_Serv').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a5_Serv').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
}
function BindA_td3() {
    $('.a1_Sol').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a2_Sol').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3_Sol').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
}
function BindA_td4() {
    $('.a1_Cu').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a2_Cu').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3_Cu').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });

}
function BindA_td5() {
    $('.a1_Au').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a2_Au').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a3_Au').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
    $('.a4_Au').bind({ click: function() {
        window.open('Testing.htm', '_self');
    }, mouseenter: function() {
        $(this).css('color', 'black');
    }, mouseout: function() {
        $(this).css('color', '#8f8f8f');
    }
    });
}