/* Copyright Scientec Internet Applications + Media GmbH - www.scientec.de */

$(document).ready(function(){

        var sprache=($('html').attr('lang')=="de")?"":"_e";


        $('#seite').css('position','relative');
        $('body').append('<div id="bg2" style="position:absolute; top:0px; left:0; height:100%; width:100%;background-color:#000; z-index:199; overflow:auto; display:none;opacity:0.7;-moz-opacity:0.7;filter:alpha(opacity=70)"></div>');
        $('#seite').append('    <div id="y2" style="display:none;position:absolute;top:100px;left:0px;z-index:500; width:899px; height:333px; border:1px solid #c2c2c2; background-color:#fff; ">\
                                        <div id="close2" style="display:none;height:21px;cursor:pointer;background:#fc0 url(/onTEAM/layout/images/close.gif);position:absolute; right:-40px; top:-1px; width:21px; border:1px solid #fff;background-position:center"></div>\
                                        <div id="img2" style="height:100%;background-image:url(/grafik/ebike.jpg);background-position:center"></div>\
                                        <div id="ifr2" style="position:absolute;top:200px;left:0;width:100%;bottom:0;display:none">\
                                                <iframe style="position:absolute;top:0;left:0;width:100%;height:100%" src="/onTEAM/microsite/extended2/iframe'+sprache+'.html" frameborder="no"></iframe>\
                                        </div>\
                                </div>');
        $('#seite').append('<img class="micrositeimage" id="x2" src="/grafik/ebike.jpg" style="position:absolute;top:'+_relPosTop($('#xIMG2'),$('#seite'))+'px;left:'+_relPosLeft($('#xIMG2'),$('#seite'))+'px;z-index:50; width:239px; height:89px;display:none">')

        $('#xA2,#x2,#xIMG2').click( function(){
                $('html,body').animate({scrollTop:0},300);
                $('#bg2').css('display','block');
                $('body').css('overflow','hidden');
                $('body').css('marginRight','18px');
                $('#xIMG2').css('opacity','0.25');
                $('#x2').unbind('click');
                $('#x2').css('display','block');
                $('#x2').css('zIndex','500');
                $('#x2').delay(600).animate(
                        {
                                top: "101px",
                                width: "899px",
                                height: "333px"
                        }, 500,
                        function(){
                                $('#y2').css('display','block');
                                $('#x2').css('display','none');
                                $('#img2').delay(600).animate(
                                        {
                                                height: "200px"
                                        }, 500,
                                        function() {
                                                $('#close2').fadeIn(200, function(){});
                                                $('#ifr2').fadeIn(200, function(){});
                                                $('#y2').animate(
                                                        {
                                                                height: "500px"
                                                        }, 500,
                                                        function() {
                                                                $('#ifr2 iframe').contents().find('html,body').css('overflow','auto')
                                                                $('#close2').click( function(){
                                                                        $('#y2').fadeOut(200);
                                                                        $('#bg2').fadeOut(200);
                                                                        $('#xIMG2').css('opacity','1');
                                                                        $('body').css('marginRight','0');
                                                                        $('body').css('overflow','auto');
                                                                });
                                                        }
                                                );
                                        }
                                );
                        }
                );
                return false
        });


});

function _relPosTop(el,EL){return el.offset().top - EL.offset().top}
function _relPosLeft(el,EL){return el.offset().left - EL.offset().left}