function removeFilter(element) {

    if (element.style.filter && element.style.removeAttribute) {
        element.style.removeAttribute('filter');
    }
}
$(document).ready(function() {

    $('#web_text').fadeTo("fast", 0.92);
    $('#foto_text').fadeTo("fast", 0.92);
    $('#foto_text').hide();
    $('#b1').fadeTo("fast", 0.92);
    $('#b2').fadeTo("fast", 0.5);

    $("#liste2").fadeTo("slow", 0.01);
    $("#b2").hover(
                    function() {
                        $("#b2").fadeTo("slow", 0.92);
                    },
                    function() {
                        $("#b2").fadeTo("slow", 0.5);
                    }
                );

    $("#b2").click(function() {
        $("#b1").fadeTo("slow", 0.3);
        $("#b2").fadeTo("slow", 0.92);

        $("#b1").hover(
                    function() {
                        $("#b1").fadeTo("fast", 0.92);
                    },
                    function() {
                        $("#b1").fadeTo("fast", 0.3);
                    }
                );

        $(this).unbind('mouseenter').unbind('mouseleave')
        $('#web_text').fadeTo("slow", 0.3);
        $("#liste").fadeTo("slow", 0.01, function() {
            $('#web_text').hide("blind", { direction: "horizontal" }, 1000);


            $('#foto_text').show("blind", { direction: "horizontal" }, 1000, function() {
            $("#liste2").fadeTo("slow", 0.92); $('#foto_text').fadeTo("slow", 0.92, function() {
                    var element = document.getElementById('liste2');
                    removeFilter(element) 
                });	 
            });
        });


    });

    $("#b1").click(function() {
        $("#b1").fadeTo("slow", 0.92);
        $("#b2").fadeTo("slow", 0.5);

        $("#b2").hover(
                    function() {
                        $("#b2").fadeTo("slow", 0.92);
                    },
                    function() {
                        $("#b2").fadeTo("slow", 0.5);
                    }
                );

        $(this).unbind('mouseenter').unbind('mouseleave')
        $('#foto_text').fadeTo("slow", 0.3);
        $("#liste2").fadeTo("slow", 0.01, function() {
            $('#foto_text').hide("blind", { direction: "horizontal" }, 1000);

            $('#web_text').show("blind", { direction: "horizontal" }, 1000, function() {
            $("#liste").fadeTo("slow", 0.92); $('#web_text').fadeTo("slow", 0.92, function() {
                var element = document.getElementById('liste');
                removeFilter(element)
            }); 
            });
        });
    });


    var a = new Array('ns', 'an', 'gh', 'un', 'ej', 'rg', 'se', '@j', 's.', 'de');
    $("#em").html("<a href='mailto:" + a[6] + a[5] + a[4] + a[7] + a[3] + a[2] + a[1] + a[0] + a[8] + a[9] + "'><span class=\"highlight\">" + a[6] + a[5] + a[4] + a[7] + a[3] + a[2] + a[1] + a[0] + a[8] + a[9] + "</span></a>");


    high();

    $("#b3").click(function() {

        var width = 0;
        if (document.documentElement) {
            width = document.documentElement.offsetWidth;
        } else if (window.innerWidth) {
            width = window.innerWidth;
        }
        $("#div2").animate({ left: (width + "px") }, 0);

        $("#div1").animate({ left: ("-" + width) }, 2000);
        $("#div1").fadeOut(0);
        $("#div2").fadeIn(0);
        $("#div2").animate({ left: "0px" }, 2000);
    });
    $("#b4").click(function() {
        var width = 0;
        if (document.documentElement) {
            width = document.documentElement.offsetWidth;
        } else if (window.innerWidth) {
            width = window.innerWidth;
        }
        $("#div1").animate({ left: ("-" + width + "px") }, 0);
        $("#div2").animate({ left: (width + "px") }, 2000);
        $("#div2").fadeOut(0);
        $("#div1").fadeIn(0);

        $("#div1").animate({ left: "0px" }, 2000);
    });



});


function high() {
    $(".highlight").hover(
                    function() {
                        $(this).animate({ color: "#D73369" }, "fast");
                    },
                    function() {
                        $(this).animate({ color: "#6832d6" }, "fast");
                    }
                );
}