// JavaScript Document
var a = 0;
var b = 0;
var c = 0;
var d = 240;
var e = 0;
function check(){
	if(screen.width<580){
	a=302;
	b=302;
	c=300;
	e=120;
	//The below code must be changed for every website so that the content easily fits into the 300 to 320 width. A and B can change, though should be equal, between 300 and 320 to allow for different length menu buttons. C must stay at 300. Page images and content information should be fine, though the number and length of menus need to be checked. Also any images or text in the menu-left layer should be removed and only the list buttons left. To browser check for layout just change the code of your current browser resolution as can be seen ***
	document.getElementById('menu').innerHTML='<ul><li class="first"><a href="main_page_1.html">About</a></li><li><a href="main_page_3.html">Main Page 3</a></li><li class="last"><a href="contact_page.html">Contact</a></li></ul>';
	document.getElementById('menu-left').innerHTML='<ul><li id="one"><a href="sub_page_1.html">Sub Page 1</a></li><li id="two"><a href="sub_page_2.html">Sub Page 2</a></li><li id="three"><a href="sub_page_3.html">Sub Page 3</a></li><li id="four"><a href="sub_page_4.html">Sub Page 4</a></li><li id="five"><a href="sub_page_5.html">Sub Page 5</a></li><li id="six"><a href="sub_page_6.html">Sub Page 6</a></li><li id="seven"><a href="sub_page_7.html">Sub Page 7</a></li><li id="eight"><a href="sub_page_8.html">Sub Page 8</a></li><li id="nine"><a href="sub_page_9.html">Sub Page 9</a></li></ul>';
}else if(screen.width<900){
	a=580;
	b=240;
	c=300;
	e=70;
 }else if (screen.width<1125){
	a=900;
	b=240;
	c=630;
	e=70;
 }else if (screen.width>1124){
	//----------------------------------***here 
	//a=302;
	//b=302;
	//c=300;
	//e=120;
	//document.getElementById('menu').innerHTML='<ul><li class="first"><a href="main_page_1.html">About</a></li><li><a href="main_page_3.html">Main Page 3</a></li><li class="last"><a href="contact_page.html">Contact</a></li></ul>';
	//document.getElementById('menu-left').innerHTML='<ul><li id="one"><a href="sub_page_1.html">Sub Page 1</a></li><li id="two"><a href="sub_page_2.html">Sub Page 2</a></li><li id="three"><a href="sub_page_3.html">Sub Page 3</a></li><li id="four"><a href="sub_page_4.html">Sub Page 4</a></li><li id="five"><a href="sub_page_5.html">Sub Page 5</a></li><li id="six"><a href="sub_page_6.html">Sub Page 6</a></li><li id="seven"><a href="sub_page_7.html">Sub Page 7</a></li><li id="eight"><a href="sub_page_8.html">Sub Page 8</a></li><li id="nine"><a href="sub_page_9.html">Sub Page 9</a></li></ul>';
	a=1100;
	b=240;
	c=800;
	e=70;
 }else{
	a=590;
	b=240;
	c=300;
	e=70;
 }
 document.getElementById('header').style.width=a+'px';
 document.getElementById('header').style.backgroundImage='url(graphics/header_'+a+'.png)';
 document.getElementById('header').style.backgroundRepeat='no-repeat';
 document.getElementById('header').style.backgroundPosition='center';
 document.getElementById('header').style.height=e+'px';
 document.getElementById('menu').style.width=a+'px';
 document.getElementById('main').style.width=a+'px';
 document.getElementById('footer').style.width=a+'px';
 document.getElementById('menu-left').style.width=b+'px';
 document.getElementById('container').style.width=c+'px';
 document.getElementById('imgplacer').style.height=d+'px';//This must sit last, if you remove imgplace the script will abort anything below.
 document.getElementById('imgplacer').style.width=b+'px';//This must sit last, if you remove imgplace the script will abort anything below.
}