/* Sam Small Style sheet */

/* maincode */

body {
  	font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
	background-color:#FDD5FD;
  	margin: 0;
	padding: 0;
	}

/* Main container */

#container {
	margin: 0;
	padding: 0;
	}

/* Nav code */

#top {
	margin: 0;
	padding: 0;
	border-bottom: 2px solid #FFCC00;
	}
	
#top #links {
	float: left;
	margin: 20px 0 0 5px;
	padding: 0;
	font-size: 80%;
	}
	
#top ul {
	margin: 0;
	padding: 0;
	}

#top li {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
	}

#top li a {
	padding: 0 5px 0 5px;
	margin: 0;
	text-decoration: none;
	}

#top a:hover {
	color: #FFCC00;
	}
	
#top #header {
	margin: 0 auto;
	padding: 0;
	width: 768px
	}
	
#logo {
	margin: 0 auto;
	padding: 0;
	}
	
#logo h1 {
	margin: 0;
	padding: 0;
	background-image:url(../img/hklogo.gif);
	height: 136px;
	background-repeat:no-repeat;
	}

 #logo a {
	display:block;
	text-decoration:none;
	width: 320px;
	height: 136px;
	}

 #logo h1 span {
	display: none;
	}
	
/* ** Top nav code ** */
	

#nav #home a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 83px;
	background-image:url(../img/buttons/home.jpg);
	background-repeat:no-repeat;
	}
	
#nav #home a:hover {
	background-image:url(../img/buttons/homeov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #chunky a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 93px;
	background-image:url(../img/buttons/chunky.jpg);
	background-repeat:no-repeat;
	}
	
#nav #chunky a:hover {
	background-image:url(../img/buttons/chunkyov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #fun a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 157px;
	background-image:url(../img/buttons/fun.jpg);
	background-repeat:no-repeat;
	}
	
#nav #fun a:hover {
	background-image:url(../img/buttons/funov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #cobweb a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 103px;
	background-image:url(../img/buttons/cobweb.jpg);
	background-repeat:no-repeat;
	}
	
#nav #cobweb a:hover {
	background-image:url(../img/buttons/cobwebov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #unusual a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 93px;
	background-image:url(../img/buttons/unusual.jpg);
	background-repeat:no-repeat;
	}
	
#nav #unusual a:hover {
	background-image:url(../img/buttons/unusualov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #order a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 83px;
	background-image:url(../img/buttons/order.jpg);
	background-repeat:no-repeat;
	}
	
#nav #order a:hover {
	background-image:url(../img/buttons/orderov.jpg);
	background-repeat:no-repeat;
	}
	
#nav #contact a {
	float:left;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 83px;
	background-image:url(../img/buttons/contact.jpg);
	background-repeat:no-repeat;
	}
	
#nav #contact a:hover {
	background-image:url(../img/buttons/contactov.jpg);
	background-repeat:no-repeat;
	}
	
#nav span {
	display: none;
	} 
		
#nav a {
	display:block;
	text-decoration:none;
	width: 177px;
	height: 55px;
	}

	
/* Content code */


#content {
	clear: both;
	margin: 20px auto;
	padding: 0;
	width: 768px;
	}
	
/* ** Page headers ** */

#iefix {
	height: 55px;
	}	

#content h2 {
	font-size: 120%;
	color:#663399;
	font-style:italic;
	}

#content h2 #chunky {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/chunky.jpg);
	background-repeat:no-repeat;
	}
	
#content h2 #cobweb {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/cobweb.jpg);
	background-repeat:no-repeat;
	}
	
#content h2 #fun {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/fun.jpg);
	background-repeat:no-repeat;
	}

#content h2 #unusual {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/unusual.jpg);
	background-repeat:no-repeat;
	}
	
#content h2 #order {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/order.jpg);
	background-repeat:no-repeat;
	}
	
#content h2 #contact {
	margin: 0;
	padding: 0;
	height: 55px;
	width: 177px;
	background-image:url(../img/title/contact.jpg);
	background-repeat:no-repeat;
	}
	
#content li {
	display:block;
	text-decoration:none;
	width: 177px;
	height: 55px;
	list-style:none;
	}
	
#content h2 span {
	display: none;
	}
	
/* end of table headers */
	

	
/* home Images code */

#homeimage {
	margin: 0 0 0 10px;
	float: left;
	width: 300px;
	}
	
#hmtextlf {	
	margin: 120px 60px 0 20px;
	float: left;
	width: 300px;
	font-style: italic;
	font-size: 90%;
	}
	
#content a {
	color:#663399;
	text-decoration:none;
	}
	
#content a:hover {
	color:#FFCC00;
	text-decoration: underline;
	}
	
	
.purp {
	color:#663399; 
	text-align:center;
	font-style:italic;
	font-weight:bold;
	}
	
.list {
	margin: 5px auto;
	padding: 5px;
	clear: both;
	width: 656px;
	border: 1px solid #663399;
	}

.photo {
	margin: 0;
	padding: 8px;
	font-size: 80%;
	width: 216px;
	float: left;
	text-align:right;
	}
	
.descr {
	margin: 0;
	padding: 8px;
	float: left;
	width: 400px;
	text-align:center;
	}
	
#content .descr a {
	color:#663399; 
	text-align:center;
	font-style:italic;
	font-weight:bold;
	margin: 3px 0 0 110px;
	padding: 0;
	width: 180px;
	height: 22px;
	display:block;
	background-image:url("../img/buttons/link.gif");
	background-repeat:no-repeat;
	text-decoration:none;
	}
	
* html #content .descr a {
	margin: 3px 10px 3px 13px;
	}
	
#content .descr a:hover {
	background-image:url("../img/buttons/link_ov.gif");
	background-repeat:no-repeat;
	}

/* ************* order code ************** */

#hkorderform {
	margin: 0 auto;
	padding: 0;
	width: 550px;
	}

.orderlist {
	clear: both;
	}


.image {
	clear: both;
	margin: 5px 0;
	padding: 0;
	float: left;
	width: 130px;
	font-size: 80%;
	}
	
.itemid {
	margin: 5px 0;
	padding: 0;
	float: left;
	width: 200px;
	font-size: 80%;
}

.quant {
	margin: 5px 0;
	padding: 0;
	float: left;
	width: 100px;
	font-size: 80%;
}


/* ************* Colour chart code ************** */

#colourcontent {
	clear: both;
	margin: 20px auto;
	padding: 0;
	width: 350px;
	border: 1px solid #663399;
	}
	
#colourcontent h2 {
	font-size: 100%;
	color:#663399;
	font-style:italic;
	margin: 5px;
	}

.colchbx {
	margin: 5px 18px;
	padding:5px;
	width: 300px;
	float: left;
	border: 1px solid #663399;
	text-align:center;
	font-size:80%;
	}
	
.colchbx img {	
	margin: 0 10px;
	float:left;
	}



/* ************* Email code ************** */


	
#hkemailform {
	clear: both;
	margin: 0 auto;
	padding: 0;
	width: 350px;
	}
	
/* html #hkemailform {
	margin: 50px auto 0 auto;
	}
*/

.label {
	clear: both;
	margin: 5px 0;
	padding: 0;
	float: left;
	width: 80px;
	font-size: 80%;
	}
	
.field {
	margin: 5px 0;
	padding: 0;
	float: left;
	width: 200px;
	font-size: 80%;
}
	
textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
	}

#post {
	font-weight: bold;
	text-align:center;
	color:#663399;
	}
	
.just {
	text-align:justify;
	width: 600px;
	}
	
/* Footer code */

#footer {
	clear: both;
	margin: 0;
	padding: 0;
	font-size:70%;
	height: 50px;
	border-top: 2px solid #FFCC00;
	}
	
#footcon {
	margin: 0 auto;
	padding: 0;
	width: 768px;
	}

	
#footcon ul {
	margin: 0;
	padding: 8px 0 0 0;
	}
	
#footcon li {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

#footcon li a {
	padding: 0 5px 0 0;
	margin: 0;
	text-decoration: none;
}

#footcon a:hover {
	color: #FFCC00;
	}
	
#footcon p {
	margin: 10px 0 0 0;
	float: left;
	width: 200px;
	}
	
#sci a {
	float: left;
	width: 550px;
	margin: 0;
	text-align: right;
	text-decoration: none;
	}

	
#sci a:hover {
	text-decoration: underline;
	}
	
.red{
color:#ff0000; 
font-size:80%;}