window.addEvent('domready', function(){
	//divs
	var FiEle = $('FiEle');
	var SeEle = $('SeEle');
	var ThEle = $('ThEle');
	
	//content elements
	var FiEleCon = $('FiEleCon');
	var SeEleCon = $('SeEleCon');
	var ThEleCon = $('ThEleCon');
	
	//banner elements
	var FiEleBan = $('FiEleBan');
	var SeEleBan = $('SeEleBan');
	var ThEleBan = $('ThEleBan');



	$$(FiEle).setStyle('width', '640px');
	$$(SeEle).setStyle('width', '160px');
	$$(ThEle).setStyle('width', '160px');

	var bannertrans = new Fx.Elements($$('.banner'));
	var contenttrans = new Fx.Elements($$('.content'));

	function first() {
		$$('.slogan1').morph({width: 620, height: 420});
		$$('.slogan2').morph({width: 620, height: 420});
		$$('.slogan3').morph({width: 620, height: 420});
		$$('.slogan4').morph({width: 620, height: 420});
		$('antrieb').morph({width: 487, height: 94});
		if (SeEleBan.getStyle('opacity') == 1 && ThEleCon.getStyle('opacity') == 1) {
			bannertrans.start({
				'1': {
					'left': [160, 640],
					'width': [160,160],
					'opacity': [1,1]
				},
				'2': {
					'left': [320, 800],
					'width': [0,160],
					'opacity': [0,1]
				}
				
			});
			contenttrans.start({
				'2': {
					'left': [320, 960],
					'width': [620,0],
					'opacity': [1,0]
				}
			});
		}
		if (SeEleCon.getStyle('opacity') == 1) {
			bannertrans.start({
				'1': {
					'left': [160, 640],
					'width': [0,160],
					'opacity': [0,1]
				}
			});
			contenttrans.start({
				'1': {
					'left': [160, 800],
					'width': [620,0],
					'opacity': [1,0]
				}
			});
		}
	}
	
	function second() {
		if (ThEleBan.getStyle('opacity') == 1) {
			bannertrans.start({
				'1': {
					'left': [640, 160],
					'width': [160,0],
					'opacity': [1,0]
				}
			});
		} else {
			bannertrans.start({
				'1': {
					'left': [640, 160],
					'opacity': [1,0]
				},
				'2': {
					'left': [800, 800],
					'opacity': [0,1],
					'width': [0,160]
				}
			});
		}
		contenttrans.start({
			'1': {
				'left': [640, 160],
				'width': [0,620],
				'display': ['block'],
				'opacity': [0,1]
			},
			'2': {
				'left': [320, 320],
				'width': [620,0],
				'opacity': [1,0]
			}
		});	
		$$('.slogan1').morph({width: 160, height: 108});
		$$('.slogan2').morph({width: 160, height: 108});
		$$('.slogan3').morph({width: 160, height: 108});
		$$('.slogan4').morph({width: 160, height: 108});
		$('antrieb').morph({width: 0, height: 94});
	}


	function third() {
		if (SeEleBan.getStyle('opacity') == 0) {
			bannertrans.start({
				'1': {
					'left': [320, 160],
					'width': [0,160],
					'opacity': [0,1]
				},
				'2': {
					'left': [800, 320],
					'width': [160,0],
					'opacity': [1,0]
				}				
			});
			contenttrans.start({
				'1': {
					'left': [160, 800],
					'width': [620,0],
					'opacity': [1,0]
				},
			'2': {
				'left': [960, 320],
				'width': [0,620],
				'display': ['block'],
				'opacity': [0,1]
			}				
			});
		}
		if (SeEleBan.getStyle('opacity') == 1) {
			bannertrans.start({
				'1': {
					'left': [320, 160],
					'width': [0,160],
					'opacity': [0,1]
				},
				'2': {
					'left': [800, 320],
					'width': [160,0],
					'opacity': [1,0]
				}
			});
		contenttrans.start({
			'1': {
				'left': [160, 960],
				'width': [620,0],
				'opacity': [1,0]
			},
			'2': {
				'left': [960, 320],
				'width': [0,620],
				'display': ['block'],
				'opacity': [0,1]
			}
			
		});
		} else {
			bannertrans.start({
				'1': {
					'left': [640, 160],
					'opacity': [1,1]
				},
				'2': {
					'left': [800, 320],
					'opacity': [1,0]
				}
			});
		}
		contenttrans.start({
			'2': {
				'left': [960, 320],
				'width': [0,620],
				'display': ['block'],
				'opacity': [0,1]
			}
		});
		$$('.slogan1').morph({width: 160, height: 108});
		$$('.slogan2').morph({width: 160, height: 108});
		$$('.slogan3').morph({width: 160, height: 108});
		$$('.slogan4').morph({width: 160, height: 108});
		$('antrieb').morph({width: 0, height: 94});
		
	}

	$('FiEleBan').addEvent('click', function(e){
		first();
	});



	$('SeEleBan').addEvent('click', function(e){
		second();
	});

	$('ThEleBan').addEvent('click', function(e){
		third();
	});


});