@import url("/CssFiles/gift.css");
body {
	margin: 0;
	padding: 0;
	border: 0;
	background-color: #E7EBF1;
	color: #3D4263;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100.01%;
	min-width: 770px;
	background-image: url(../images/currency.bmp);

}

#wrapper {
	margin: 10px;
	width: 770px;
	position: relative;
	background-color: #E7EBF1;
	border: 1px solid #000;
	text-align: center;
	left: 10px;
	top: 10px;
	background-image: url(../images/Clouds.jpg);
	clip:   rect(10px 10px 10px 10px);
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	right: 10px;
	bottom: 10px;
	padding: 15px;
	color: #000040;








}

/*Begins laying out the content area */
#content {
	margin: 10px 210px 20px 12px;
	width: 543px;

}


/*sets the content text*/
#content p {
	font-size: 80%;/*scales the font to 80% of the default set int he body selector*/
	margin: 20px 0 0 10px;/*sets the required margins on the p element*/
	padding: 0;/*zeroes the padding*/
	color: #330066;/*sets the colour for the text*/
	line-height: 130%;/*set a line height for easier reading*/
}

/*sets the styling for the h1 element within the content div*/
#content h1 {
	font-size: 120%;/*scales the text size against the body selector default*/
	font-family: Georgia, "Times New Roman", Times, serif;/*sets the font face*/
	margin: 10px 15px 0 10px;/*sets the margins on the h1*/
	padding: 0 0 3px 0;/*sets the padding on the h1 element*/
	color: #3D4263;/*sets the text colour for the h1 text*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
}

#content h2 {
	font-size: 110%;/*scales the text size against the body selector default*/
	font-family: Georgia, "Times New Roman", Times, serif;/*sets the font face*/
	margin: 15px 15px 0 10px;/*sets the margins on the h2*/
	padding: 20px 0 3px 0;/*sets the padding on the h2 element*/
	color: #3D4263;/*sets the text colour for the h2 text*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
}

/*float styles for the images in the content div*/
.left {
	float: left;/*float the image to the left*/
	border: 1px solid #000;/*add a border around the image*/
	margin: 5px 10px 0 0;/*set a margin to the top and right to give clearance against the text the top margin aligns the image with the top of the p element*/
}

.right {
	float: right;/*float the image to the right*/
	border: 1px solid #000;/*add a border around the image*/
	margin: 5px 10px 0 10px;/*set a margin to the top and left to give clearance against the text the top margin aligns the image with the top of the p element*/
}


/*begin laying out the form - the form has it's own container #formcontainer*/
#formcontainer {
	width: 500px;/*set the width of the form container*/
	margin: 10px 5px 20px 55px;/*set the margins*/
}

/*set the h1 element in the form container*/
#formcontainer h1 {
	font-size: 120%;/*scale the font size against the body selector*/
	font-family: Georgia, "Times New Roman", Times, serif;/*set the font family*/
	margin: 10px 15px 0 0;/*set the margins of the h1*/
	padding: 0 0 20px 0;/*set the padding on the h1*/
	color: #330066;/*set the font colour*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
}

/*style the p in the form container*/
#formcontainer p {
	font-size: 80%;/*scale the font size against the body selector*/
	margin: 0 0 20px 0;/*set a 20 pixel margin on the bottom, zero the rest*/
	padding: 0;/*zero the padding*/
}

/*style the inputs*/
#formcontainer input {
	background-color: #FFFFFF;/*set a background colour on the form inputs*/
	color: #330066;/*set a colour for the text that is added to the inputs*/
	border: 1px solid #330000;/*set a border on the inputs - gives them a flat appearance*/
	margin: 0;/*zero off any margins*/
	width: 250px;/*set a width*/
}


/*style the textarea*/
#formcontainer textarea {
	background-color: #FFFFFF;/*set the background colour*/
	color: #330066;/*set the text colour*/
	border: 1px solid #336666;/*add a border to give it a flat appearance*/
	margin: 0 25px 0 0;/*set a 25 pixel margin to the right zero off any remaining borders*/
	height: 100px;/*set a hegiht for the textarea*/
}

/* shows focus in the form inputs and textarea */
#formcontainer input:focus, #formcontainer textarea:focus {
	background-color: #330066; /*set the background colour of the input and textarea when the cursor is inside*/
   color: #fff; /*set the text colour to white*/
}

/*position the textarea by floating its containing lable*/
.labelfloat {
	float: right;/*float to the right*/
	padding-top: 20px;/*level it off with the inputs to the left by adding 20 pixels of padding to the top of the label*/
}

/*style the form element labels*/
#formcontainer label {
	color: #330066;/*set the text colour*/
	font-size: 75%;/*scale the font size off the body selector*/
	padding-top: 5px;/*set a little padding to the top*/
	display: block;/*set the display to block to ensure each input is shown on a different line i.e. they do not run horizontally*/
}

/*style the parent fieldset*/
#formcontainer fieldset {
	margin: 0;/*zero off the margins*/
	border: 1px solid #5C6231;/*add a border to define it's edges*/
	text-align: left;/*align the text to the left*/
	padding: 5px 5px 20px 20px;/*set the padding*/
	width: 450px;/*give it a width*/
}

/*style the nested fieldset*/
#formcontainer fieldset fieldset {
	width: 195px;/*give it a width*/
	padding: 0;/*remove any default padding*/
	border: none;/*add border none to prevent inheriting a border from the parent*/
}

/*style the form legend - "Contact My COmpany" */
#formcontainer legend {
	color: #FFFFFF;/*set the text colour*/
	font-weight: bold;/*set the font weight to bold*/
	font-family: Georgia, "Times New Roman", Times, serif;/*set the font family*/
	background-color: #3D4263;/*set a background colour*/
	border: 1px solid #000;/*set a border around the legend*/
	padding: 2px;/*set alittle padding to give it some space against the border*/
	font-size: 90%;/*scale the font size against the body selector*/
}

/* our buttons take on the input style, we need to change that and we'll do it with this button class*/
#formcontainer .button {
   background-color: #330066;/*set the background colour of your form buttons*/
   color: #fff;/*set the text colour to white*/
   width: 80px;/*provide a width*/
   margin-top: 20px;/*set a 20 pixel top margin to give some "air" below the inputs*/
}


/*Start laying out the index page - different container than the inner page allows you to pattern match selectors and style them diffeently if needed without resorting to classes */
#front {
	width: 770px;/*set a width */
	margin-top: 0; /*20px;sets a margin to the top*/
	text-align: center;/*centers the text*/
	
	padding-top: 20px;
}

/*styles the h1 on the index page*/
#front h1 {
	font-size: 120%;/*scale the font size*/
	font-family: Georgia, "Times New Roman", Times, serif;/*set the font family*/
	margin: 10px 15px 0 0;/*set the margins*/
	padding: 0 0 20px 0;/*set the padding*/
	color: #330066;/*set the text colour*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
}

/*style the "Welcome To" link for entry to the site*/
#front a {
   color: #FFFFFF;/*set the link text colour*/
   background-color: #330066;/*set the link background colour*/
   border: 1px solid #000;/*set a border around the link*/
   padding:4px 10px 4px 10px;/*set some padding on the link*/
   text-decoration: none;/*remove the underline*/
	
}

#front a:hover, #front a:focus {
	background-color: #3D4263;/*set the hover and focus background colour*/
	color: #FFFFFF;/*set the hover and focus text colour*/
}

/*this container holds the four boxes at the bottom of the index page*/
#floatcontainer {
	width: 770px;/*set a width*/
	height: 220px;/*set a height for the container*/
	padding-top: 20px;/*sets the distance from the element above -- remember to add this value to the height of the boxes to get the full height of this float container*/
}

/*set up the four floated boxes - these are held within the above selector*/
.floatboxes {
	width: 152px;

	w\idth: 154px;/*set the width for good browsers*/
	height: 200px;
	margin:  0 16px;

	ma\rgin: 0 14px;/*set the margins for IE 6 and other browsers allows for a float bug in IE 6*/
	border: 1px solid #4f4f4f;
	float: left;
	background-color: #3D4263;
	overflow: auto;

}

html>body .floatboxes {
   margin: 0 18px;/*correctly align the margin for good browsers after the hack in the rule above*/
}

/* This selector fixes the horizontal scroll in IE Mac and would be seen by IE 5.01 PC except for the escape characters */
*>html .floatboxes {
	padd\ing-right: 16px; /*sets some padding to the right to avoid the horizontal scroll bars that IE insists are needed*/
	w\idth: 137px; /*Feeds in a corrected width for IE due to the padding above */
}
.floatboxes h3 {
   text-align: center;/*set the h3 titles for eac of the boxes*/
	font-size: 105%;/*scale the font size off the body selector*/
	font-family: Georgia, "Times New Roman", Times, serif;/*set the font family*/
	padding: 0 0 3px 0;/*set padding against the bottom, zero all other sides*/
	margin: 0;/*zero the margins*/
	color: #83BBD6;/*set the text colour*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
	background-color: #330000;/*set the background color*/
}

/*This selector is only seen by IE Mac due to the escape characters that also block IE 5 PC -- this reverses the heading colors */
*>html .floatboxes h3 {
	bac\kground-color: #F2F7E7;/*provides a background colour to match the box background for IE Mac only*/
	c\olor: #4F4F4F;/*provides the contrasting text colour*/
	/* a negative margin-left, equivalent to 1px LESS than the padding added on the "html>body .floatbox" selector, can be used here instead of reversing the heading colors... however, you will have a 1px space on the far right of the heading which is not appealing with some color schemes. You will also have a horizontal scroll bar on any boxes that have a vertical scroll. This may be acceptable in some cases however. */
	}
/*style the text in the boxes*/
.floatboxes p {
	font-size: 70%;/*scale the font size off the body selector*/
	margin: 5px;/*set a margin to all four sides of 5 pixels*/
	padding-bottom: 4px;/*adds padding to the bottom of the p element*/
}

/*set the links in the boxes*/
.floatboxes a, #content a {
	color: #330066; /*set the text colour*/
}

.floatboxes a:hover, .floatboxes a:focus, #content a:hover, #content a:focus {
	color: #FFFFFF;/*set the text colour on hover and focus*/
	background-color: #330066;/*set the background colour*/
	text-decoration: none;/*remove the underline*/
}
