/*      USE THE FOLLOWING TO CREATE A NEW COLOR SCHEME! AND SAVE AS A NEW CSS!     */


/* The following css is page specific. Don't forget to change the title and the 
meta name description above and save file as when finished. */
	
/* The font is defined elsewhere. It is only defined here as a catch all in case
something was missed. We are only using this entry for the page background color.
This is also where you would put an image background in conjunction with the color background.*/

body { 
    font-family: Geneva, Arial, Helvetica, sans-serif; 
    font-size: 12px; 
	text-decoration: none; 
	color: #000000; 
	background-color: #dedfe4; 
    }
	
/* This defines the image and or the text at the top of the page.
If using text use the h1 tags. If using an image restrict the width to a maximum of
760px. This is so the page will view well with a 800 x 600 screen resolution.
The height of the image dosen't matter. You can change the font family and/or 
the font size or the color. The color won't affect anything here. You need to change
the color in the h1. Leave all other entries as they are. */
 
.headerimageortext {
    float: left;
	text-align: center;
    color: #000000;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
    border: 0px solid #000000;
    width: 100%;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-right: 0px;
	padding-left: 0px;
	margin: 0px auto;
	}
	

/* This defines the instruction text that goes between the two short hrs.
You can change the font family and/or 
the font size and the color. Leave all other entries as they are. */

.subheader {
    float: left;
    color: #000000;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
    border: 0px solid #000000;
    width: 35%;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 0px;
	padding-left: 0px;
	margin: 0px auto;
	}
	
/* This is for the horizontal rule that goes under the text or header image.
The color and background color must be the same. Don't change the border style,
width, padding or the margin. This is a browser thing. */

.headerimageortext hr{
        width: 100%;
        color: #2F4F4F;
        height: 2px;
        border-style: none;
		padding-top: 0px;
        padding-bottom: 0px;
        margin-top: 10px;
        margin-bottom: 10px;
        background-color: #2F4F4F;
       }
	   

/* This is for the horizontal rule that goes on the top and bottom of the instructions.
The color and background color must be the same. Don't change the border style,
width, padding or the margin. This is a browser thing. */

.subheader hr{
        width: 100%;
		float: left;
        color: #2f4f4f;
        height: 2px;
        border-style: none;
        padding-top: 0px;
        padding-bottom: 0px;
        margin-top: 25px;
        margin-bottom: 10px;
        background-color: #2f4f4f;
        }
	
/* This is for the jigsaw puzzle thumbnail image. Restrict the width of the
thumbnail to 200px maximum. You may change the border, font-family, font-size, height,
padding and margin. */

.headerthumbnail {
    border: 2px solid #000000;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	float: right;
    width: 300px;
	height: 225px;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 5px;
	padding-left: 5px;
	margin-top: 12px;
	}
	
/* If using text instead of an image in the header, you can change the font and 
the color here. */
	
h1 {
     text-align: center;
	 font-family: Geneva, Arial, Helvetica, sans-serif;
	 font-size: 36px;
	 color: #333399;
	 }
	 
/* If using text instead of an image in the header, you can also have smaller information 
text under the title here. */
	
h2 {
     text-align: center;
	 font-family: Geneva, Arial, Helvetica, sans-serif;
	 font-size: 26px;
	 color: #990000;
	 } 
	
/* This is used only for the link in the header that goes to the home page. You 
may change anything except the width and the float. */

.headerhomelink {
    float: right;
	width: 120px;
    border: 0px solid #FFFFFF;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
    text-align: left;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-right: 5px;
	padding-left: 0px;
	margin-top: 12px;
	line-height: 25px;
	}
	
/* The following four entries are for the link text in the header that points
to the home page. Change whatever you want. */
	 
.headerhomelink a:link {
	color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
    }
	
.headerhomelink a:visited {
    color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
    }
	
.headerhomelink a:hover {
	text-decoration: none;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	}
	
.headerhomelink a:active {
    color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	}
	
/* This is for adjusting the border around the jigsaw puzzle playing area. Don't 
change the height or the width. */
	
.puzzleborder {
     width: 100%;
	 height: 100%;
     border-top: 3px solid #000000;
	 border-right: 3px solid #000000;
	 border-bottom: 3px solid #000000;
	 border-left: 3px solid #000000;
	 }
	 
/* The next five entries have to do with the text and links in the footer. Change
anything you want except the width. */
	
.footertext {
    font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	text-align: center;
	width: 100%;
	border: 0px;
	margin: 0px auto; 
	}

.footertext a:link {
	color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
    }
	
.footertext a:visited {
    color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
    }
	
.footertext a:hover {
	text-decoration: none;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	}
	
.footertext a:active {
    color: #333399;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	}