function opacity(id, opacStart, opacEnd, millisec) {
    //speed for each frame
    var speed = Math.round(millisec / 100);
    var timer = 0;

    //determine the direction for the blending, if start and end are the same nothing happens
    if(opacStart > opacEnd) {
        for(i = opacStart; i >= opacEnd; i--) {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    } else if(opacStart < opacEnd) {
        for(i = opacStart; i <= opacEnd; i++)
            {
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
            timer++;
        }
    }
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}


function fadeOut() {
    opacity('maincontent', 100, 0, 2000);
}

function fadeIn() {
    opacity('maincontent', 0, 100, 2000);
}

function changeDiv1() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/tree.jpg" border="0" width="865" height="188" alt=""><br>';
}

function changeDiv2() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/catholic.jpg" border="0" width="865" height="188" alt=""><br>';
}

function changeDiv3() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/creation.jpg" border="0" width="865" height="188" alt=""><br>';
}

function changeDiv4() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/gospel.jpg" border="0" width="865" height="188" alt=""><br>';
}

function changeDiv5() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/peace.jpg" border="0" width="865" height="188" alt=""><br>';
}

function changeDiv6() {
    document.getElementById( 'maincontent' ).innerHTML='<img src="images/children.jpg" border="0" width="865" height="188" alt=""><br>';
}



function init() {
    setTimeout('changeDiv1()', 000);
    setTimeout('rotate2()', 8000);
}

function rotate1() {
    fadeOut();
    setTimeout('changeDiv1()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate2()', 12000);
}

function rotate2() {
    fadeOut();
    setTimeout('changeDiv2()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate3()', 12000);
}

function rotate3() {
    fadeOut();
    setTimeout('changeDiv3()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate4()', 12000);
}

function rotate4() {
    fadeOut();
    setTimeout('changeDiv4()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate5()', 12000);
}

function rotate5() {
    fadeOut();
    setTimeout('changeDiv5()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate6()', 12000);
}

function rotate6() {
    fadeOut();
    setTimeout('changeDiv6()', 2000);
    setTimeout('fadeIn()', 2000);
    setTimeout('rotate1()', 12000);
}

function randomRotate() {
    var randomN= Math.floor(Math.random()*6);
    if ( randomN==0 ) {
        changeDiv1();
        setTimeout('rotate2()', 12000);
    } else if ( randomN==1) {
        changeDiv2();
        setTimeout('rotate3()', 12000);
    } else if ( randomN==2) {
        changeDiv3();
        setTimeout('rotate4()', 12000);
    } else if ( randomN==3) {
        changeDiv4();
        setTimeout('rotate5()', 12000);
    } else if ( randomN==4) {
        changeDiv5();
        setTimeout('rotate6()', 12000);
    } else {
        changeDiv6();
        setTimeout('rotate1()', 12000);
    }

}
