* {
margin: 0;
padding: 0;
}

/*This'll remove any problems to do with padding and margins later,
zeroing them all at on every element. You may wish to set the default
margin back for paragraphs. which is*/

p {
	margin: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

/*I think the CSS validator chokes on * {} being the first element, so
stick with body, html {} as the first rule.
*/

body {
	background: #666666;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center;
	background-color: #FBAD29;
	color: #000099;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
}
h2 {
	font-size: 1.5em;
	text-align: center;
	color: #0033CC;
	padding-top: 10px;
	padding-bottom: 10px;
}
h3 {
	color: #FF6600;
	text-align: center;
	font-size: 1.3em;
	padding-bottom: 10px;
}
h4  {
	width: 650px;
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #000099;
	font-size: 0.9em;
	margin-right: auto;
	margin-left: auto;
}
h5 {
	width: 700px;
	margin-right: auto;
	margin-left: auto;
}
#container {
	width: 1000px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
#header {
	height: 300px;
	background-image: url(../images/header.jpg);
	margin: 0px;
	padding: 0px;
}



#content {
	width: 860px;
	padding-right: 20px;
	padding-left: 20px;
	margin-right: auto;
	margin-left: auto;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
	background-color: #FFFFFF;
}
#contentOrder {
	width: 860px;
	padding-right: 20px;
	padding-left: 20px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-left: auto;
}


#content h1 {
	background-position: left;
}

#cardSamples {
	text-align: center;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #000099;
	border-right-color: #000099;
	border-bottom-color: #000099;
	border-left-color: #000099;
}
#optionCards {
	text-align: center;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #000099;
	border-right-color: #000099;
	border-bottom-color: #000099;
	border-left-color: #000099;
	float: right;
	width: 400px;
	padding-right: 30px;
	height: 700px;
}
#optionCards  img {
	border: thin solid #333333;
}
#optionCardsVertical {
	text-align: center;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #000099;
	border-right-color: #000099;
	border-bottom-color: #000099;
	border-left-color: #000099;
	float: right;
	width: 400px;
	padding-right: 30px;
	height: 900px;
}
#orderForm1  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	font-size: 0.8em;
	font-weight: bold;
	float: left;
	width: 350px;
	text-align: left;
	padding-left: 70px;

}
#form1 {
	text-align: left;
}
#formContact {
	margin-left: 300px;
}

#cardSamples img {
	border: 1px groove #333333;
	margin: 10px;
}
#cardChoices  img {
	margin-right: 20px;
	margin-bottom: 0px;
	margin-left: 20px;
}

#cardChoices {
	text-align: center;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-color: #000099;
	border-right-color: #000099;
	border-bottom-color: #000099;
	border-left-color: #000099;
	padding: 0px;
}
#cardQuan {
	text-align: right;
	width: 400px;
	margin-right: auto;
	margin-left: auto;
	padding-right: 150px;
}
#cardQuan2 p {
	text-align: left;
}




#footer {
	width: 900px;
	background-color: #0166ff;
	margin-right: auto;
	margin-left: auto;
	clear: both;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 20px;
	padding-left: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
}
#clear {
	clear: both;
}
#customA {
	padding-right: 5px;
	padding-left: 5px;
	height: 1000px;
	padding-top: 10px;
}


#cardA {
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 10px;
	height: 900px;
}
#cardA img {
	margin-right: 20px;
	margin-left: 20px;
	border: thin solid #333333;
}
#cardVertical {
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 10px;
	height: 900px;
	padding-bottom: 100px;
	float: none;
}
#frontSide  {
	margin-top: 15px;
}
#backSide  {
	margin-top: 150px;
	border: thin none #333333;
}


#nextBtn {
	width: 200px;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
}



A:link {
	text-decoration: none;
	font-weight: bold;
}

A:visited {
	text-decoration: none;
	color: #990066;
	font-weight: bold;
}
A:active {
	text-decoration: none;
	font-weight: bold;
}
A:hover {
	text-decoration: underline overline;
	color: #0000FF;
	font-weight: bold;
}




.style1 {color: #FF0000
}
.prices {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #333333;
	font-weight: bold;
	font-size: .8em;
}
#dividerText {
	padding-top: 10px;
	padding-bottom: 10px;
}

.style3 {
	font-size: 0.8em;
	color: #0000CC;
	font-weight: bold;
	padding-bottom: 5px;
}
/*.style3 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #F79400;
	font-weight: bold;
	padding-bottom: 5px;
}*/
.style4 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	color: #FF6600;
	font-size: .9em;
	font-weight: bold;
}


.style6 {
	color: #0033CC;
	font-size: 0.9em;
	font-family: Geneva, Arial, Helvetica, sans-serif;
}


.quanLabel  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #0000CC;
	font-size: 1.2em;
}

.cardOptions {
	font-size: 1.2em;
	color: #0033CC;
	font-weight: bold;
	padding-bottom: 5px;
	text-decoration: none;
}
.natureList {
	font-weight: bold;
	color: #666666;
	font-style: italic;
}
.colorList {
	font-weight: bold;
	color: #FF0000;
}
.cruiseList {
	font-weight: bold;
	color: #00CCCC;
}

.cerulean {
	font-weight: bold;
	color: #0166FF;
}
.periwinkle {
	font-weight: bold;
	color: #6865FE;
}
.olive {
	font-weight: bold;
	color: #666701;
}
.cinnabar {
	font-weight: bold;
	color: #990002;
}
.orange {
	font-weight: bold;
	color: #FF6600;
}
.yellow {
	font-weight: bold;
	color: #FFCC00;
}
.white {
	font-weight: bold;
	color: #CCCCCC;
}
.grey {
	font-weight: bold;
	color: #999999;
}
.black {
	font-weight: bold;
	color: #000000;
}
#viewCart {
	
	
}
#formRadio {
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 10px;
	height: 1300px;
}
#orderRadio {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	font-size: 0.8em;
	font-weight: bold;
	float: left;
	width: 800px;
	text-align: left;
	padding-left: 70px;
}
#cardA #left {
	float: left;
}
#cardA #right {
	float: right;
}


/*----NAVIGATION----*/
ul#nav {
	position:relative;
	background: url(../images/navigation.jpg);
	top: 259px;
	padding: 0px;
	margin: 0px;
	width: 1000px;
	float: left;
}

ul#nav li {
	float:left;
	list-style-type:none
}
ul#nav li a { height:41px; display:block; position:absolute; top:0; text-indent:-9999px; outline:none }

li#navHome a, li#navPrices a, li#navOrder a, li#navContact a { background:url(../images/navigation.jpg) }





/*  
Measurements for the nav image replacement:

	The distance from the top to the...

	initial state = 0
	rollover state = 41px
	selected state = 82px

	The distance from the far-left to the...

	news button = 0
	shop button = 70px
	artists button = 138px
	links button = 222px
	about button = 294px

	The width of the...

	news button = 70px
	shop button = 68px
	artists button = 84px
	links button = 72px
	about button = 74px
*/

li#navHome a 						{ background-position:0 0; width:304px; left:0 }
li#navHome a:hover					{ background-position:0 -41px }
body#pageHome li#navHome a 			{ background-position:0 -82px }

li#navPrices a 						{ background-position:-304px 0; width:195px; left:304px }
li#navPrices a:hover				{ background-position:-304px -41px }
body#pagePrices li#navPrices a 		{ background-position:-304px -82px }

li#navOrder a 						{ background-position:-499px 0; width:190px; left:499px }
li#navOrder a:hover					{ background-position:-499px -41px }
body#pageOrder li#navOrder a 		{ background-position:-499px -82px }

li#navContact a 					{ background-position:-689px 0; width:311px; left:689px }
li#navContact a:hover				{ background-position:-689px -41px }
body#pageContact li#navContact a 	{ background-position:-689px -82px }



/* The following code just puts our navigation on an example page; it's not necessarily related to the tutorial */

html { text-align:center }

#banner2  {
	text-align: center;
	text-decoration: none;
}

#orderBtn img    {
	border: 0;
}

#fip {
	float: right;
}
#shippingDes p{
	width: 500px;
	margin-left: 1px;
	font-size: 1em;
	text-align: center;
	color: #900;
}
#content #illustration {
}

