// <script type="text/javascript">
<!--  to hide script contents from old browsers

/*********************************************************************************
This file contains most of the universally used javascript functions. 
*********************************************************************************/

window.onload = init;

function init()
{
	display_urhere();
	setup_email();
}

/* This function alters the style of the navigation bar to indicate urhere.
I added code from the original to shorten the href string so that it does
not include any bookmarks (....#bookmark). Otherwise, the strings would not
match and the urhere formatting would not be applied.
******************************************************************************/

function display_urhere()
{	if (!document.getElementById)
	{	
		return;
	}

	var list = document.getElementById("navbar");
	var page = list.getElementsByTagName("a");
	var currentHref = document.location.href;

	var anchorPosition = currentHref.indexOf("#");
	if (anchorPosition >= 0)
	{	currentHref = currentHref.substring(0, anchorPosition);
	}

	currentHref = getSimpleHref(currentHref);

	for (var i = 0; i < page.length; i++)
	{	var href = getSimpleHref(page[i].href)	

		if (href == 'index.html')
		{	var home_index = i;
		}

		// If page is thumbnails.php or series.php, set urhere for "paintings."
		s = currentHref;
		index = s.indexOf('?');
		s = s.substring(0, index);
		
		if ((s == 'thumbnails.php') || (s == 'series.php'))
			if (href == 'paintings.php')
			{
				page[i].style.color = "#ff6600";	
				break;
			}
			
		// This is when url doesn't include the page. Highlight index.html
		if ((href == currentHref) || ((currentHref.length == 0) && (home_index >= 0)))
		{			
			if ((currentHref.length == 0) && (home_index >= 0))
			{	i = home_index;
			}
			
			page[i].style.color = "#ff6600";	
/*			page[i].parentNode.style.backgroundColor = "#fff";	*/	// parentNode will be <li>

			break;
		}
	}
}

/******************************************************************************
This function was added because Mac Safari does not include the directory structure
before the href, so there was never a match. This function strips the beginning directory structure
away and just leaves the end part--such as about_us.htm
******************************************************************************/

function getSimpleHref(s)
{	var length;
	var anchorPosition = 0;	

	while (anchorPosition >= 0)
	{	anchorPosition = s.indexOf('/');
		length = s.length;

		if (anchorPosition >= 0)
		{	s = s.substring(anchorPosition + 1, length);
		}		
	}
	
	return(s);
}

/**************************************************************************************************
This function sets up a link with class "emailJennifer" to send email. Email address cannot be 
read by spambots.
**************************************************************************************************/

var name1 = "jnehrbass13";
var name2 = "yahoo";
var name3 = "com";
var jennifer_email = name1 + "@" + name2 + "." + name3;

function setup_email()
{
	var anchors = document.getElementsByTagName("a");
	if (anchors == null)
		return;

	for (var i = 0; i < anchors.length; i++)
	{
		switch(anchors[i].className)
		{
			case "emailJennifer":
			{
				anchors[i].onclick = function()
				{
					document.location.href = "mail" + "to:" + jennifer_email;
					return(false);
				}
				anchors[i].onmouseover = function()
				{
					this.firstChild.nodeValue = jennifer_email;
				}
				break;
			}
		}
	}
}

/******************************************************************************
Here's the start of the picture slide show.
/*****************************************************************************/

var folder = 'artwork/';			// Folder where all images are kept
var current_image_number = 0;		// Global variable to indicate what image is currently displayed
var NUMBER_OF_IMAGES;
var DIV_FACTOR = 4; 
var current_image_array = new Array;
var main_image = new Array();
var main_image_loaded = new Array();

//var mainPicture = new Image();

/******************************************************************************
 Names of image files without the jpg extension
/*****************************************************************************/

var series_cameos = new Array(				
'tasting_juniper', 'Tasting Juniper', 'ooc', '36" x 30"',
'orlandos_feast', 'Orlando\'s Feast', 'ooc', '36" x 30"',
'personal_waterloo', 'Personal Waterloo', 'ooc', '36" x 30"',
'honeycomb', 'Honeycomb', 'ooc', '36" x 30"',
'just_shy_of_fatal', 'Just Shy of Fatal', 'ooc', '36" x 30"',
'arrival_of_marie', 'Arrival of Marie', 'ooc', '36" x 30"',
'snake_in_the_grass', 'Snake in the Grass', 'ooc', '36" x 30"',
'pretty_cheeks', 'Pretty Cheeks', 'ooc', '36" x 30"',
'copious_empire', 'Copious Empire', 'ooc', '36" x 30"',
'typhoon_odessa', 'Typhoon Odessa', 'ooc', '36" x 30"'
);

var series_2011 = new Array(				
'across_from_the_prison', 'Across From the Prison Beside the Great Lake', 'ooc', '65" x 50"',
'red_rojas', 'Red Rojas', 'ooc', '20" x 28"',
'queen_of_california', 'Queen of California', 'ooc', '50" x 40"'
);

var series_2010 = new Array(				
'This_Tulip_Loves_You', 'This Tulip Loves You', 'ooc', '60" x 48"',
'erika_as_elk', 'Erika as Elk', 'ooc', '60" x 48"',
'lights_out', 'Lights Out', 'ooc', '22" x 28"'
);

var series_2007_2009 = new Array(				
'cliff_dweller', 'Cliff Dweller', 'ooc', '72" x 54"',
'resetting_the_gem', 'Resetting the Gem', 'ooc', '84" x 66"',
'serving_lucinda', 'Serving Lucinda', 'ooc', '38" x 52"',
'clean_as_pauline', 'Clean as Pauline', 'ool', '56" x 42"',
'one_thousand_sofias', 'One Thousand Sofias', 'ooc', '7\' x 5\'',
'emerald_lake', 'Emerald Lake', 'ooc', '84" x 79"'
);







var series_2009 = new Array(				
'cliff_dweller', 'Cliff Dweller', 'ooc', '72" x 54"'
);

var series_2008 = new Array(				
'resetting_the_gem', 'Resetting the Gem', 'ooc', '84" x 66"',
'serving_lucinda', 'Serving Lucinda', 'ooc', '38" x 52"'
);

var series_2007 = new Array(				
'clean_as_pauline', 'Clean as Pauline', 'ool', '56" x 42"',
'one_thousand_sofias', 'One Thousand Sofias', 'ooc', '7\' x 5\'',
'emerald_lake', 'Emerald Lake', 'ooc', '84" x 79"'
);

var series_2006 = new Array(				
'imperialista', 'Imperialista', 'ool', '65" x 50"',
'splendor_me', 'Splendor Me', 'ool', '45" x 60"',
'bridget', 'Bridget', 'ooc', '42" x 28"',
'kelly', 'Kelly', 'ooc', '56" x 42"',
'rebecca', 'Rebecca', 'ool', '60" x 45"',
'sara', 'Sara', 'ooc', '36" x 42"',
'virginia', 'Virginia', 'ooc', '42" x 28"'
);

var series_2005 = new Array(				
'caroline_and_carol', 'Caroline and Carol', 'ooc', '28" x 42"',
'cindy', 'Cindy', 'ooc', '28" x 42"',
'laura', 'Laura', 'ooc', '42" x 32"',
'phase', 'Phase', 'ooc', '58" x 44"',
'startled', 'Startled', 'oow', '18" x 24"',
'the_golden_mean', 'The Golden Mean', 'ool', '48" x 42"',
'apprentice_of_nothing', 'Apprentice of Nothing', 'ooc', '44" x 58"'
);

var series_2004 = new Array(
'break_of_dawn', 'Break of Dawn', 'ool', '60" x 48"',
'directors_cut', 'Director\'s Cut', 'oow', '8" x 6"',
'girls_with_teeth', 'Girls with Teeth in the Wrong Places', 'ool', '53" x 48"',
'hannah', 'Hannah\s Handloader', 'ool', '62" x 47"',
'the_dance_mechanism', 'The Dance Mechanism', 'ool', '5\' x 7\'',
'katherine', 'Katherine and her Intercontinental Dream', 'oow', '40" x 30"'
);

/*********************************************************************************
This file sets up the appropriate image array and assingns it to the global variable
current_image_array.
*********************************************************************************/

function setup_images(array_name, image_number)
//function setup_images(array_name, image_number, use_cookie)
{
	if (array_name == 'series_cameos')
	{	current_image_array = series_cameos;
	}
	else if (array_name == 'series_2011')
	{	current_image_array = series_2011;
	}
	else if (array_name == 'series_2010')
	{	current_image_array = series_2010;
	}
	else if (array_name == 'series_2007_2009')
	{	current_image_array = series_2007_2009;
	}

	current_image_number = image_number;

	NUMBER_OF_IMAGES = current_image_array.length / DIV_FACTOR;

	//Initialize array for preloading next image to 0.
	for (var i = 0; i < NUMBER_OF_IMAGES; i++)
	{	main_image_loaded[i] = 0;
	}
}

/******************************************************************************
This function displays the number of images on the html page as well as previous
and next arrows. This is done by writing html code onto the page. A number and
ID is generated for each image. The IDs are in the form: "numberx" where "x"
are numerals from 0 to the number of images - 1.

It should be called after setup_images() from the html page.
/*****************************************************************************/

/***
Not used for O'Hara Arts website

function display_numbers()
{
	document.write('<a href="#" class="arrow" ' + 'onClick="get_previous_image(); ' + 'this.blur(); return false;" >');
	document.write('<< Back ');
	document.write('</a>');
	
	for (var i = 0; i < NUMBER_OF_IMAGES; i++)
	{
		document.write('<div id="number' + i + '"' + ' class="number">');
		document.write('<a href="#" ' + 'class="num-link" ' + 'onClick="select_image(' + i + '); ' + 'this.blur(); return false;" >');
		var j = i + 1;
		document.write(j);
		document.write('</a>');
		document.write('</div>');
	}		

	document.write('<a href="#" class="arrow" ' + 'onClick="get_next_image(); ' + 'this.blur(); return false;" >');
	document.write(' Next >>');
	document.write('</a>');
}

***/

/******************************************************************************
This function selects the next image. 
/*****************************************************************************/

function get_next_image()
{	
	//alert('get_next_image: current_image_number = ' + current_image_number);
	//alert('get_next_image: NUMBER_OF_IMAGES = ' + NUMBER_OF_IMAGES);

	if (current_image_number < NUMBER_OF_IMAGES - 1)
	{	
		select_image(current_image_number + 1);
	}	
	else
	{
		if (current_image_array == series_cameos)
			document.location.href = 'series.php?year=2011&img=0';
		else if (current_image_array == series_2011)
			document.location.href = 'series.php?year=2010&img=0';
		else if (current_image_array == series_2010)
			document.location.href = 'series.php?year=2007_2009&img=0';
		else if (current_image_array == series_2007_2009)
			document.location.href = 'series.php?year=cameos&img=0';
		else
			alert('did not find current next image array');
	}

//	alert('get_next_image: current_image_number = ' + current_image_number);
}

/******************************************************************************
This function selects the previous image. 
/*****************************************************************************/

function get_previous_image()
{	
	if (current_image_number > 0)
	{	select_image(current_image_number - 1);
	}
	else
	{
		if (current_image_array == series_cameos)
			document.location.href = 'series.php?year=2007_2009&img=0';
		else if (current_image_array == series_2011)
			document.location.href = 'series.php?year=cameos&img=0';
		else if (current_image_array == series_2010)
			document.location.href = 'series.php?year=2011&img=0';
		else if (current_image_array == series_2007_2009)
			document.location.href = 'series.php?year=2010&img=0';
		else
			alert('did not find current image array');
	}
}

/******************************************************************************
This function selects and displays the current image. Called from html file.
/*****************************************************************************/

function get_current_image()
{	
	select_image(current_image_number);
}

/******************************************************************************
This function selects the image number n. It first deselects the current image
and then selects the new imge.
/*****************************************************************************/

function select_image(n)
{
	var id_old;
	var id_new;
	var id_element;
	var href;
	var text, newElem, newText, child;
	
	//alert('select_image: current_image_number = ' + current_image_number + '  n = ' + n);
	
	id_old = 'number' + current_image_number;
	id_element = document.getElementById(id_old);
	/*****************************************************************
	The following code worked in all browsers except Safari for Mac.
	So, instead changed the class name of the <a> tag.
		href = id_element.getElementsByTagName("a");
		href[0].style.color = "rgb(164, 179, 200)";
		href[0].style.backgroundColor = "transparent";
	*****************************************************************/
	//id_element.firstChild.className = 'num-link';


	id_new = 'number' + n;
	id_element = document.getElementById(id_new);
	/*****************************************************************
	The following code worked in all browsers except Safari for Mac.
	So, instead changed the class name of the <a> tag (firstChild of
	<div id="numberx">
		href = id_element.getElementsByTagName("a");
		href[0].style.color = "rgb(164, 179, 200)";
		href[0].style.backgroundColor = "rgb(164, 179, 200)";
	*****************************************************************/
	//id_element.firstChild.className = 'num-selected';

	current_image_number = n;
	
	//alert('select_image: current_image_number = ' + current_image_number + '  n = ' + n);
	
	get_image(n);
	
	if (n == 0)
	{		
		if (current_image_array == series_cameos)
			text = '<< 2007 - 2009';
		else if (current_image_array == series_2011)
			text = '<< Cameos';
		else if (current_image_array == series_2010)
			text = '<< 2011';
		else if (current_image_array == series_2007_2009)
			text = '<< 2010';

		id_element = document.getElementById('previousArrow');
		child = id_element.childNodes[0];
		newElem = document.createElement("p");
		newText = document.createTextNode(text);
		id_element.replaceChild(newText, child);

		//id_element.style.display = "none";		
	}
	
	else if (n == NUMBER_OF_IMAGES - 1)
	{
		if (current_image_array == series_cameos)
			text = '2011 >>';
		else if (current_image_array == series_2011)
			text = '2010 >>';
		else if (current_image_array == series_2010)
			text = '2007 - 2009 >>';
		else if (current_image_array == series_2007_2009)
			text = 'Cameos >>';

		id_element = document.getElementById('nextArrow');
		child = id_element.childNodes[0];
		newElem = document.createElement("p");
		newText = document.createTextNode(text);
		id_element.replaceChild(newText, child);

		//id_element.style.display = "none";		
	}
	else
	{
		id_element = document.getElementById('previousArrow');
		child = id_element.childNodes[0];
		newElem = document.createElement("p");
		newText = document.createTextNode('<< previous image');
		id_element.replaceChild(newText, child);

		id_element = document.getElementById('nextArrow');
		child = id_element.childNodes[0];
		newElem = document.createElement("p");
		newText = document.createTextNode('next image >>');
		id_element.replaceChild(newText, child);
	}	
}

/******************************************************************************
This function takes as input the number of the image to select.

It then manipulates the current array of images to pull out all the information.
In this case the information is:
array[0]: image file name without the jpg extension
array[1]: Text name of the image to be displayed
array[2]: Medium of artwork
array[3]: Size of artwork in string format
array[4]: Whether the artwork has been sold or not (1 = sold, 0 = not sold)

It then displays the main image in the portfolio viewer and calls
display_image_info() to display the name, medium, size, and whether it's been
sold.
/*****************************************************************************/

function get_image(n_image)
{	
	var offset = n_image * DIV_FACTOR;
	
	var image_file = current_image_array[offset];
	image_file += '.jpg';
	image_file = folder + image_file;

	var image_name = current_image_array[offset + 1];
	
	var medium = current_image_array[offset + 2];

	switch(medium)
	{
		case 'ooc': medium = 'Oil on canvas'; break;
		case 'ool': medium = 'Oil on linen'; break;
		case 'oow': medium = 'Oil on wood'; break;
		case 'oob': medium = 'Oil on board'; break;
		case 'oop': medium = 'Oil on panel'; break;
		case 'p': medium = 'Pastel'; break;
	}
	
	var size = current_image_array[offset + 3];

/***
	var sold = current_image_array[offset + 4];
	if (sold)
		var sold_text = 'Sold';
	else
		var sold_text = '\t\n';
***/

	/* If Safari loads another image and both height and with are not different, then Safari 
	stretches the image to the same width as the previous image. The following code checks if
	Safari browser, and if true, loads a 1px x 1px image before loading the new image.
	******************************************************************************************/
	var safari = (navigator.userAgent.indexOf('Safari') != -1);	
	if (safari)
	{	document.images.targetImage.src = 'images/MsSpacer.gif';
	}
	
	document.images.targetImage.src = image_file;

	/***************************************************************************************************
	The following 2 lines work fine in all browsers except Safari. In Safari, the new strings do not 
	align properly. For example, they should be centered horizontally, but instead, the 1st string 
	displayed is properly centered, but subsequent strings are left aligned with the left position of 
	the 1st string. To get around this, display_image_info() was added.

		document.getElementById("imageName").firstChild.nodeValue = image_name[n];
		document.getElementById("imageDescription").firstChild.nodeValue = medium_string;
	***************************************************************************************************/
	
	display_image_info(image_name, medium, size, n_image + 1);
	
	// Get ready to preload next image
	var i = n_image + 1;
	
	if ((i < NUMBER_OF_IMAGES) && (main_image_loaded[i] == 0))
	{
		offset = i * DIV_FACTOR;
		image_file = current_image_array[offset];
		image_file += '.jpg';
		image_file = folder + image_file;

		main_image[i] = new Image();
		main_image[i].src = image_file;
		main_image_loaded[i] = 1;
	}	
}	

/******************************************************************************
This function displays the information for each image: the name, medium, 
size, and whether it's been sold.
Spaces are added to newText because IE5.0 will not take padding or margin.
******************************************************************************/

function display_image_info(image_name, image_description, image_size, n_image)
{	var newElem;
	var newText;
	var oldChild;
	var text;
	
	newElem = document.createElement("p");
	newText = document.createTextNode(image_name + '    ');
	oldChild = document.getElementById("imageName").childNodes[0];
	document.getElementById("imageName").replaceChild(newText, oldChild);

	newElem = document.createElement("p");
	newText = document.createTextNode(image_description + '    ');
	oldChild = document.getElementById("imageDescription").childNodes[0];
	document.getElementById("imageDescription").replaceChild(newText, oldChild);

	newElem = document.createElement("p");
	newText = document.createTextNode(image_size);
	oldChild = document.getElementById("imageSize").childNodes[0];
	document.getElementById("imageSize").replaceChild(newText, oldChild);

/**
	text = n_image + ' out of ' + NUMBER_OF_IMAGES;
	newElem = document.createElement("p");
	newText = document.createTextNode(text);
	oldChild = document.getElementById("imageNumber").childNodes[0];
	document.getElementById("imageNumber").replaceChild(newText, oldChild);
**/

/**
	for (var i = 0; i < NUMBER_OF_IMAGES; i++)
	{
		text = i + ' ';
		newElem = document.createElement("p");
		newText = document.createTextNode(text);
		oldChild = document.getElementById("imageList").childNodes[0];
		document.getElementById("imageList").appendChild(newText, oldChild);
	}	
**/
	
}

/******************************************************************************
This function displays thumbnail images of all the paintings in a series.
******************************************************************************/

function display_thumbnail_paintings(year)
{
	var n_columns = 3;
	var offset;
	var image_file;

	if (typeof year == 'undefined')
	{	
		year = '2011';
	}
	
	// For some reason, this extra div fixes bug in IE5Mac. Bug is that after 1st row, the
	//  2nd and subsequent images in each row are shifted down a bit.
	// document.writeln('<div style="float: left; width: 450px; margin: 0px; padding: 0px">');     
	document.writeln('<table class="thumbnails-table">');     

	for (var i = 0; i < NUMBER_OF_IMAGES; i++)
	{	offset = i * DIV_FACTOR;
	
		image_file = current_image_array[offset];
		image_file += '_tn.jpg';
		image_file = folder + image_file;

		if ((i % n_columns) == 0)
			document.write('<tr>');

		document.write(" \n <td> \n");
		document.write('<a href="series.php?year=' + year + '&' + 'img=' + i + '">');     
		document.write('<img id="tn' + i + '" ' + ' src="' + image_file + '"' + ' width="100" height="100" >');
		document.write("</a>");
		document.write("\n </td> \n");

/***		
		document.write(" \n <td> \n");
		document.write('<a href="#" onClick="select_thumbnail(' + i + '); ' + 'this.blur(); return false;" >');     
		document.write('<img id="tn' + i + '" ' + ' src="' + image_file + '"' + ' width="100" height="100" >');
		document.write("</a>");
		document.write("\n </td> \n");
***/

		if ((i % n_columns) == 2)
			document.write("</tr> \n");

/***
		document.write('<div class="thumbnail">');     
		document.write('<a href="#" onClick="select_thumbnail(' + i + '); ' + 'this.blur(); return false;" >');     
		document.write('<img id="tn' + i + '" ' + ' src="' + image_file + '"' + ' width="100" height="100" >');
		document.write('</a>');
		document.write("</div> \n");
***/
	}

	document.writeln('</table>');
}

/******************************************************************************
This function selects one of the thumbnails on the page. When selected, a 
cookie is created to indicate the number of the selected image. A new slide
viewer page is then opened and the cookie is retrieved to determine which 
image to show.
******************************************************************************/

/***

function select_thumbnail(n)
{
	//alert('select_thumbnail: thumbnail selected ' + n);
	current_image_number = n;

	//create_cookie(n);

	//window.open('paintings.htm');
	
	if (current_image_array == series_2006)
	{	document.location.href = 'series_2006.html';
	}
	else if (current_image_array == series_2005)
	{	document.location.href = 'series_2005.html';
	}
	else if (current_image_array == series_2004)
	{	document.location.href = 'series_2004.html';
	}
	else
		alert('no array selected');
}

***/

/******************************************************************************
Preload thumbnail images.
******************************************************************************/

/***

function preload_thumbnails(n_images)
{	for (x = 0; x < n_images; x++)
	{	tn_image[x] = new Image();
		tn_image[x].src = image_file_tn[x];
	}
}

***/

/******************************************************************************
Preload background images used for navigation.
******************************************************************************/

/****

function preload_background_images()
{	

	pic1 = new Image(); 
    pic1.src = folder + "color_button_05.gif"; 
	
	pic2 = new Image(); 
    pic2.src = folder + "color_button_green_04.gif"; 
	
	pic3 = new Image(); 
    pic3.src = folder + "color_button_coral_04.gif"; 
	
	pic4 = new Image(); 
    pic4.src = folder + "previous_page_arrow_blue_04.gif"; 
	
	pic5 = new Image(); 
    pic5.src = folder + "next_page_arrow_green_04.gif"; 
	
	pic6 = new Image(); 
    pic6.src = folder + "next_page_arrow_green_04.gif"; 
}	

****/

/******************************************************************************
This function creates a cookie. After the viewer selecs an image from one of 
the thumbnailpage, a cookie is set to remember the image number.
Note that the global variable cookie_name is used throughout all of these
cookie functions.
******************************************************************************/

/***

var COOKIE_NAME = 'jane_image_number';

function create_cookie(cookie_value)
{
	document.cookie = COOKIE_NAME + "=" + cookie_value;
}

***/

/******************************************************************************
This function deletes the cookie.
******************************************************************************/

/***

function delete_cookie()
{
	var date = new Date();
	var time = date.getTime();

	date.setTime(time - 1);

	document.cookie = COOKIE_NAME + "= ; " + "expires=" + date.toGMTString();
}

***/

/******************************************************************************
This function retrieves the cookie.
******************************************************************************/

/***

function get_cookie() 
{	var dc = document.cookie;
 
	var name_start = dc.indexOf(COOKIE_NAME + "="); 
	if (name_start == -1) 							// Did not find cookie
	{	//alert("Did not find cookie. ");
		return (-1); 
	}

	var cookie_value = dc.substring(name_start + COOKIE_NAME.length + 1);

	delete_cookie();
	return(parseInt(cookie_value));
}

***/

/******************************************************************************
Slide Show function definitions.
******************************************************************************/

/***

var slide_index;
var timeout_ref;
var slide_show_go;

function start_slide_show()
{
	if (slide_show_go == 1)
	{	window.clearTimeout(timeout_ref);
	}
	
	slide_show_go = 1;
	slide_index = 0;
	next_slide();
}

function next_slide()
{	if ((slide_index < MAX_OIL_IMAGES) && (slide_show_go == 1))
	{
		get_oil_image(slide_index++);

		timeout_ref = window.setTimeout('next_slide()', 3000);
	}
}

function stop_slide_show()
{	
	if (slide_show_go == 1)
	{
		window.clearTimeout(timeout_ref);
		slide_show_go = 0;
	}
}

function continue_slide_show()
{	
	if (slide_show_go == 0)
	{
		slide_show_go = 1;
		next_slide();
	}
}

function display_start()
{
	var newElem = document.createElement("p");
	var newText = document.createTextNode('Start slide show');
	var oldChild = document.getElementById("instruction").childNodes[0];
	document.getElementById("instruction").replaceChild(newText, oldChild);	
}


function display_nothing()
{
	var newElem = document.createElement("p");
	var newText = document.createTextNode("  ");
	var oldChild = document.getElementById("instruction").childNodes[0];
	document.getElementById("instruction").replaceChild(newText, oldChild);
}

***/

// end hiding contents from old browsers  -->
// </script>