/*
	This stylesheet defines page-turning arrow icons for multipage historical narratives
	It should be linked from HTML documents in addition to and after the general familyweb stylesheet
*/
ul.arrow	{				/* The icons are arranged as an unnumbered list */
		list-style-type: none;		/* Omit bullets */
		width: 96%;			/* Reduce the width sligthly */
		padding: 0;			/* No padding */
		margin-left: 0;			/* No left margin */
		margin-right: 0;		/* No right margin */
		text-align: center;		/* Center any text */
		}
li.arrow	{
		display: inline-block;		/* The list items should be laid out horizontally */
		}
li.arrow-left	{
		width: 32%;			/* One third of total width */
		margin-left: 0%;		/* No left margin for left icon */
		margin-right: auto;		/* Let browser set right margin for left icon */
		}
li.arrow-center	{
		width: 32%;			/* One third of total width */
		margin-left: auto;		/* Let browser set left margin for center icon */
		margin-right: auto;		/* Let browser set right margin for center icon */
		}
li.arrow-right	{
		width: 32%;			/* One third of total width */
		margin-left: auto;		/* Let browser set left margin for right icon */
		margin-right: 0%;		/* No right margin for right icon */
		}
img.arrow	{
		width: 32px;			/* Resize icons */
		height: 32px;			/* Resize icons */
		float: none;			/* Default to no floating */
		}
img.arrow-left	{
		float: left;			/* Float left icon to the left */
		}
img.arrow-right	{
		float: right;			/* Float right icon to the right */
		}
/*
	The following is a template for a row of page-turning icons for the top and and bottom of a web page
<ul class="arrow">
<li class="arrow arrow-left">
<a	href="Previous-Page19.html" title="&larr; Previous Page">
<img	src="Icons/blue-left-arrow.svg" alt="&larr; Previous Page" 
	class="arrow arrow-left"></a>
</li>
<li  class="arrow arrow-center">
<a	href="Table-of_Contents.html" title="&uarr; Table of Contents">
<img	src="Icons/blue-up-arrow.svg" alt="&uarr; Table of Contents" 
	class="arrow"></a>
</li>
<li class="arrow arrow-right">
<a	href="Next-Page16.html" title="&rarr; Next Page">
<img	src="Icons/blue-right-arrow.svg" alt="&rarr; Next Page" 
	class="arrow arrow-right"></a>
</li>
</ul>
*/