/*GENERAL STYLING THROUGH SITE*/

 body
{
margin: 0;
padding: 0;
font-size: 95%;
font-family:Ariel, Helvetica,Sans-Serif; 
color: #036;/*was #000*/
background-color: #CCCCCC;/*fff;*/
}

a:link { color: #036; text-decoration: underline;}
a:visited { color: #669999; text-decoration: none;}


a:hover, a:active
{
color: #999999; text-decoration: none;
}


/*this is used, e.g. for the individal pages where Return script goes on new para BELOW images*/
.clear{
	clear:both;
	}

h3 { 
text-align:center;
font-size:1.25em; 
padding:0.2em 0.4em 0.2em 0.8em; 
margin:0 }


/*this mainly for images in main content */
/*syntax is that it is a contextual selector, it shows that the tag img when the class left
or right is applied will float left or right  */
img.left {
	float:left;}
img.right {float:right;}


/*This for images of jp marks with captions - image has paragraph underneath it  */
div.markscaption {
  float: left;
  width: 250px;
  height: 500px;
  border: thin silver solid;
  margin: 1em 1em 0.5em 0.5em;
  padding: 0.5em;
}
div.markscaption p {
  text-align: center;
  font-style: italic;
  font-size: larger;
  text-indent: 0;
}

div.markscaption img {
margin-right: 15px;
border: 0;
width: 100%;
}


/*This has narrow picture of mark all way across (zoomable) and short description below */
div.markscaption2 {/*this is container which floats nearly all the way across*/
  float: left;
  width: 99%;
  border: thin silver solid;
  /*margin: 1em 1em 2em 0.5em;*/
  padding: 0.5em;
}

div.markscaption2 p {
 /*float: left;*/
  text-align: center;
  font-style: italic;
  font-size: smaller; /*was larger - 1-2-11*/
 /* text-indent: 0;*/
}

div.markscaption2 img {
/*float:left;*/
margin-right: 25px;
border: 0;
width: 100%;
}

/*This for the introduction to copper pieces etc on sortmetal.php */
div.gallerycaption {/*this is container which floats nearly all the way across*/
  float: left;
  width: 99%;
  border: thin silver solid;
  margin: 1em 0em 2em 0em;
  padding: 0.5em;
  background-color:#ccc;
}

div.gallerycaption h3 {/*this is heading within container which floats nearly all the way across*/
  text-align: center;
}

div.gallerycaption p {
 /*float: left;*/
  text-align: center;
  font-style: italic;
  font-size: smaller; /*was larger - 1-2-11*/
 /* text-indent: 0;*/
}








/*This for images with captions in content pages on the left - image has paragraph underneath it  */
div.imagecaptionleft {
  float: left;
  width: 35%;
  border: thin silver solid;
  margin: 1em 1em 0.5em 0.5em;
  padding: 0.5em;
}
div.imagecaptionleft p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

div.imagecaptionleft img {
margin-right: 15px;
border: 0;
width: 100%;
}

/*This for images with captions in content pages on the left - image has paragraph underneath it  */
div.imagecaptionright {
  float: right;
  width: 35%;
  border: thin silver solid;
  margin: 1em 1em 0.5em 0.5em;
  padding: 0.5em;
}
div.imagecaptionright p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

div.imagecaptionright img {
margin-right: 15px;
border: 0;
width: 100%;
}



/* these form settings for albumlist*/
form {
/*	there is separate styling for searchbar-dev */
/* border: 1px solid #666699;*/
 /*padding: 2px;*/
 /*margin: 4px;*/
 }

input
{
margin-top: 2px;
/*margin-bottom: 2px;*/
color: red;/*#000000;*/
background: #CCCCCC;
border: 1px solid #666666;
}

textarea
{
margin-top: 2px;
/*margin-bottom: 2px;*/
color: #000000;
background: #CCCCCC;
border: 1px solid #666666;
}


.submit input
{
color: #000;
background: #CCCCCC;
border: 2px outset #666666;
}



/*this is styling for enquiry form in contactform page*/
div#enquiryform
{
padding: 10px;
 margin: 10px;
color: #fff;/*fff;*/
background-color: #333;
border-bottom: 1px solid #000;
float:left;
}

/*this is styling for heading of enquiry form with name of item in contactform page*/
div#enquiryform h3
{
font-size: 1.5em;
color: #fff;
margin: 0;
padding-top: 1em;
padding-bottom:0.5em;
font-weight: normal;
}


#enquiryform a
{
text-decoration: none;
color: #fff;
}

#enquiryform a:hover
{
color: teal;
}





/*STRUCTURAL STYLING*/

div#sitecontainer
{
width:1011px;/*was 1001px*/
border: 1px solid #000000;/*amended 29-12*/
margin:auto;/*this is needed to centre the container on the screen*/
background-color:#fcfcfc;
height: 100%;/*added 30-12*/ 
   overflow: hidden;/*added 30-12*/
}



div#banner
{
	color: #fff;/*fff;*/
background-color: #333;
border-bottom: 1px solid #000;
}

div#banner h1
{
margin: 0px;
padding: .5em 0 .1em .8em;
font-size: 2.5em;
font-weight: normal;
text-align:left;
}

/*for suzuki only*/
div#banner h2
{
margin: 0px;
padding: .1em 2.6em 0.6em .5em;
font-size: 1.3em;
font-weight: normal;
text-align:right;
font-style: italic;
}


div#jpsearchbox{
/*padding: 10px;*/
 margin: 10px 10px 10px 50px;
color: red;/*#fff;*/
background-color: gray;/*#333;*/
 /*border: 10px solid red;*/
/*border-bottom: 10px solid #000;*/
border: 1px solid #000;
float:left;/*was right*/
}



div#jpsearchbox form {
	display:inline;/*this to ensure form for searchbar is on single line*/
padding-left: 10px;
 margin-left: 10px;
 }

div#jpsearchbox select, input {
 font-size: 1em;/*new*/
 /*margin:2em;*/
 }


div#searchbar-dev
{
padding: 10px;
 margin: 10px;
/*color: #fff;/*fff;*/
background-color: gray;/*#333;*/
/*border-bottom: 1px solid #000;*/
border: 1px solid #000;
float:right;
}



div#searchbar-dev form {
	display:inline;/*this to ensure form for searchbar is on single line*/
 /*border: 1px solid red;*/
 padding: 5px;
 margin: 10px;
 }


div#navigation
{
float: left;
width: 170px;
padding-top: 1em;
padding-left:10px;
/*border-right: 1px solid #669999;*/
/*background-color:#cfcfcf;*/
background-image: url(sidenavsnake7.gif);/*bird.gif);*/
background-repeat: no-repeat;
background-position: bottom;
}

div#navigation h5
{
font-size:1em;
font-weight:600;
background-color:#669999;
width: 135px;
padding: 3px 10px 3px 10px;
}


div#navigation ul
{
	font-weight: 500;
list-style-type: none;
padding: 0;
margin: 0;
}

div#navigation ul li { margin-top: 4px; }

#navigation ul li a
{
display: block;
width: 135px;
padding: 3px 10px 3px 10px;
text-decoration: none;
/*color: #fff;*/
background-color: #ccc;/*669999;*/
/*background-image: url(backgroundimage1.jpg);
background-repeat: repeat-y;*/
}

#navigation ul li a:hover
{
/*color: #000;*/
/*background-color: #ccc;*/
background-image: url(nav_base2.jpg);
background-repeat: repeat-y;
}

/*this is container for breadcrumb trail*/
#loccontainer {
width: 100%;/*100% of navigaton id div*/
padding-top: 0px; /*was 5px;*/
padding-bottom:22px;
}

#location{
width: 135px;
padding: 3px 10px 3px 10px;
font-size:75%;

}

/*this is container for date within side1 container*/
#datecontainer {
width: 100%;/*100% of navigaton id div*/
padding-top: 30px; /*was 5px;*/
padding-bottom:200px;
/*background-image: url(backgroundimage5.jpg);
background-repeat: repeat-y;/*
/*background-color: #ffffff;*/
}

#thedate{/*this is styling for date on left column*/
width:135px;
font-size:85%;
color:#003399;
text-align:center;
}



div#more
{
float: left;/*right;*/
width: 140px;
margin-top: 0px;
padding: 120px 10px 10px 0;/*was padding: 2em 10px 0 0;*/
color: #000000;/*#fff;*/
background-image: url(birdmore.gif);
background-repeat: no-repeat;
background-position: top;
/*background-image: url(backgroundimage5.jpg);
background-position: right;
background-repeat: repeat-y;*/
/*border: 1px solid #333;*/
}

div#more h3
{
margin-top: 1em;
color: #669999;
padding:.2em;

}

div#more img {
float: left;
margin-left: 20px;
border:1px solid #333300;}


.jpthirdcolumninput/*styling for buttons on more*/
{
font-size:110%;
margin-top: 10px;
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
}

/*styling for ad boxes on right*/	
 .adbox {
    padding: 2px 4px 2px 2px;/*120px padding to allow for bird image  /*
    margin: 20px 0 30px 0;
    /*border: 1px dotted #b1b1b1;*/
    /*background-color: #f4f4f4;*/
		text-align: center;
    }	

div#content
{
float:left;/*new*/
padding-top: 10px;
margin-left: 30px;
margin-right: 20px;
width:600px;
font-size:110%;
/*border: 1px dotted #333;*/
}

div#content h2
{
	text-align:center;
/*display: inline;*/
font-size: 2em;
color: #036;
margin: 0;
padding-top: 0.5em;
padding-bottom:0.5em;
font-weight: normal;
}



/*this for subheadings in index.htm page  */
/*it applies h3 to the class content so need to put <h3 class="content">*/
h3.content 
{	
text-align:center;
font-size: 1.5em;
color: #036;
margin: 0;
padding-top: 1em;/*was 3em*/
padding-bottom:1em;
padding-left:0em;
font-weight: normal;
}

/*this for examples in marks pagess  */
/*it applies h3 to the class markexamples so need to put <h3 class="markexamples">*/
h3.markexamples 
{	
text-align:center;
font-size: 1.2em;
font-style:italic;
color: #036;
margin-top: 0;
padding-top: 0em;/*was 1em*/
padding-bottom:0em;
padding-left:0em;
font-weight: normal;
}





/*intended as a substitite for h3.content to allow subheadings on same line as paragraphs*/
.subheading 
{
text-align:left;
font-size: 1.5em;
color: #036;
margin: 0;
padding-top: 1em;
padding-bottom:1em;
padding-left:0em;
font-weight: normal;	
}


div#content h6
{
font-size: 1.3em;
color: #036;
margin: 0;
padding-top: 1em;
font-weight: normal;
}



div#content { line-height: 150%; }

#cleardiv
{
clear: both;
height: 1em;
}

/*
############
div.imagecaptionleft {
  float: left;
  width: 35%;
  border: thin silver solid;
  margin: 1em 1em 0.5em 0.5em;
  padding: 0.5em;
}
################*/

/*marklist used for thumbnails and description of pearson by markson jpmetalwork.php  */
.marklist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.marklist li{
float:left;/*cannot be center under validaton*/
width:25%;/*was 100px;*/
height: 300px;/*new experiment 10-6-10*/
border: thick silver solid;
margin: 1em 0.5em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
background-color: #fff;/*added 1-3-11 to have white in boxes containing images*/
}
.marklist img {
display:block;
border:1px solid #333300;}

.marklist p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.marklist img {
margin-right: 15px;
border: 0;
width: 100%;
}



/*marklistthirdcolumn used for thumbnails and brief description in third column of pages on marks  */
.marklistthirdcolumn{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.marklistthirdcolumn li{
float:left;/*cannot be center under validaton*/
width:100px;/*20%;*/
height: 200px;/*new experiment 10-6-10*/
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.marklistthirdcolumn img {
display:block;
border:1px solid #333300;}

.marklistthirdcolumn p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.marklistthirdcolumn img {
margin-right: 0px;/*was 15px;*/
border: 0;
width: 100%;
}

/*patternlist used for images and description of individual pattern numbers  */
.patternlist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.patternlist li{
float:left;/*cannot be center under validaton*/
width:100%;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.patternlist img {
display:block;
border:1px solid #333300;}

.patternlist p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.patternlist img {
margin-right: 15px;
border: 0;
width: 100%;
}


/*this for individual pattern numbers on jppatternnumbersindividual.php */
/*it applies h3 to the class markexamples so need to put <h3 class="individualpatternumber">*/
h3.individualpatternnumber 
{	
text-align:center;
font-size: 1.2em;
font-style:italic;
color: #036;
margin-top: 20px;
padding-top: 0em;/*was 1em*/
padding-bottom:0em;
padding-left:0em;
font-weight: normal;
}





/*this for individual pages of particular pattern numbers on jppatternnumbersindividual.inc  */
.individualpatternnumber {
float:left;/*cannot be center under validaton*/
width:90%;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}


.individualpatternnumber p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.individualpatternnumber img {
display:block;
border:1px solid #333300;	
margin-right: 15px;
border: 0;
width: 100%;
}



/*yearlist used for thumbnails and description of pearson on jpyearbyyear.php  */
.yearlist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.yearlist li{
float:left;/*cannot be center under validaton*/
width:40%;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.yearlist img {
display:block;
border:1px solid #333300;}

.yearlist p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.yearlist img {
margin-right: 15px;
border: 0;
width: 100%;
}






/*yearlist2 is an alternative version for dated metalwork when accessed via navigaton not dropdown -  used for thumbnails and description of pearson on jp1888.php etc  */
.yearlist2{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.yearlist2 li{
float:left;/*cannot be center under validaton*/
width:90%;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.yearlist2 img {
	float:left;
display:block;
border:1px solid #333300;}

.yearlist2 p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.yearlist2 img {
margin-right: 15px;
border: 0;
width: 50%;
}


/*jqlistlist is based on yearlist2 - an alternative version with image on left and text on right to allow enlarged image on right */
.jqzoomlist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.jqzoomlist li{
float:left;/*cannot be center under validaton*/
width:90%;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:left;
}
//.jqzoomlist img {
//	float:left;
//display:block;
//border:1px solid #333300;}

.jqzoomlist p {
  text-align: left;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

//.jqzoomlist img {
//margin-right: 15px;
//border: 0;
//width: 150px;
//}







/*patternnumberlist used for thumbnails of patternumbers on jppatternumber.php  */
.patternnumberlist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.patternnumberlist li{
float:left;/*cannot be center under validaton*/
width:230px;
height: 400px;
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.patternnumberlist img {
display:block;
border:1px solid #333300;}

.patternnumberlist p {
  text-align: center;
  font-style: italic;
  font-size: 100%;
  text-indent: 0;
}

.patternnumberlist img {
margin-right: 15px;
border: 0;
width: 100%;
}




/*jpceramiclist used for thumbnails and description of pearson ceramics on jpceramics.php  */
/*this is the same as setting the ul tag*/
.jpceramiclist{
	/*padding-left:100px;/* the effect of this is to centre the grid */
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.jpceramiclist li{
float:left;/*cannot be center under validaton*/
width:130px;/*was 230px and before that 20%;*/
height: 220px;/*was 350px when needed courtesy of text*/
/*width:35%;*/
background-color: #fff;/*added 1-3-11 to have white in boxes containing images*/
border: thick silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.jpceramiclist img {
display:block;
border:1px solid #333300;}

.jpceramiclist p {
  text-align: center;
  font-style: italic;
  font-size: 100%;
  text-indent: 0;
}

.jpceramiclist img {
margin-right: 15px;
border: 0;
width: 100%;
}



div#jpmetalgallerycontainer {/*this is container which floats nearly all the way across*/
  float: left;
  width: 99%;
  border: thin silver solid;
  margin: 1em 1em 2em 0em;
  padding: 0.5em;
}

div#jpmetalgallerycontainer h3 {/*this is heading within container which floats nearly all the way across*/
  text-align: center;
}


/*jpceramiclist used for thumbnails and description of pearson ceramics on jpceramics.php  */
/*this is the same as setting the ul tag*/
.jpmetalgallery{
	padding-left:100px;/* the effect of this is to centre the grid */
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.jpmetalgallery li{
float:left;/*cannot be center under validaton*/
width:110px;/*was 230px and before that 20%;*/
height: 130px;/*was 350px new experiment 10-6-10*/
/*width:35%;*/
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.jpmetalgallery img {
display:block;
border:1px solid #333300;}

.jpmetalgallery p {
  text-align: center;
  font-style: italic;
  font-size: 100%;
  text-indent: 0;
}

.jpmetalgallery img {
margin-right: 15px;
border: 0;
width: 100%;
}









/*jpmoreimageslist used for thumbnails for more images linked from eg jpyearbyyear.php. There is no text here so list is 100 by 100px  */
.jpmoreimageslist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.jpmoreimageslist li{
float:left;/*cannot be center under validaton*/
width:80%;/*100px;*/
/*height: 100px;/*new experiment 10-6-10*/
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.jpmoreimageslist img {
display:block;
border:1px solid #333300;}

.jpmoreimageslist p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.jpmoreimageslist img {
margin-left: auto;/*setting margin-left and margin-right to auto centres the image in the middle of the block for li  */
margin-right: auto;
border: 0;
width: 80%;/*80px;*/
}

/*jpallyearslist used for thumbnails for more images when choose to view all years in jpdatemetalwork.php  */
.jpallyearslist{
list-style-type:none;/*ie dot does not appear*/
/*width:510px;*/
}

.jpallyearslist li{
float:left;/*cannot be center under validaton*/
width:100px;/*20%;*/
height: 200px;/*new experiment 10-6-10*/
border: thin silver solid;
margin: 1em 1em 0.5em 0.5em;
padding: 0.5em;
font-size:0.8em;
text-align:center;
}
.jpallyearslist img {
display:block;
border:1px solid #333300;}

.jpallyearslist p {
  text-align: center;
  font-style: italic;
  font-size: smaller;
  text-indent: 0;
}

.jpallyearslist img {
margin-left: auto;/*setting margin-left and margin-right to auto centres the image in the middle of the block for li  */
margin-right: auto;
border: 0;
width: 80px;/*80%;*/
}




/*albumlist used for thumbnails of stock - taken from the poikilia newtemplate file  */
#albumlist{
list-style-type:none;
width:510px;
}

#albumlist li{
float:left;/*cannot be center under validaton*/
padding:10px 1px 10px 10px;/*top right bottom left*/
margin-right:6px;
margin-bottom:6px;
margin-left:6px;
font-size:0.8em;
font-family:Ariel, Helvetica,Sans-Serif; 
text-align:center;
}
#albumlist img {
display:block;
border:1px solid #333300;}




div#footer
{
clear: both;
padding: .5em 1em;
border-top: 1px solid #999;
text-align: right;
}

div#footer ul
{
padding: 0;
margin: 0;
list-style-type: none;
}

div#footer li
{
display: inline;
margin-right: 1em;
}

.nextpages/*this used for images*/
{
margin-top:20px;/*so there is gap between this and form button below images*/
padding-left:100px;/* the effect of this is to move text closer to centre */	
	display:block;
clear:left;
float:left;
}


.prev
{
padding:2em;
float: left;
}

.next
{
padding:2em;	
float: right;
}

		
	/********************************************/
	 /*drop down nav lists - all code below relates to chrome.js*/
	 /********************************************/
	 
.chromestyle{
width: 99%;
font-weight: 400;
font-size:100%;
}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.chromestyle ul{
border: 0px solid #333;
width: 100%;
/*background-color:#fff;*/
/*background: url(chromebg.gif) center center repeat-x; /*THEME CHANGE HERE*/
padding: 4px 0;
margin: 0;
text-align: left; /*set value to "left", "center", or "right"*/
}

.chromestyle ul li{
display: inline;
}

.chromestyle ul li a{
/*color: #494949;*/
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}

.chromestyle ul li a:hover{
}

.chromestyle ul li a[rel]:after{ /*HTML to indicate drop down link*/
content: " ";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}


/* ######### Style for Drop Down Menu ######### */

.dropmenudiv{
position:absolute;
top: 0;
border: 1px solid #BBB; /*THEME CHANGE HERE*/
border-bottom-width: 0;
/*font:normal 12px Verdana;*/
line-height:18px;
z-index:100;
background-color: #CCCCCC;
width: 150px;
visibility: hidden;
}


.dropmenudiv a{
width: auto;
display: block;
text-indent: 3px;
border-bottom: 1px solid #BBB; /*THEME CHANGE HERE*/
padding: 2px 0;
text-decoration: none;
/*font-weight: bold;
color: black;*/
}

* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
/*background-color: #000000;/*#F0F0F0;*/
/*padding:2px;*/
}	


/*CODE BELOW RELATES TO WORDPRESS*/

.meta {
	font-size: .75em;
}

.meta li, ul.post-meta li {
	display: inline;
}

.meta ul {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

.meta, .meta a {
	color: #808080;
	font-weight: normal;
	letter-spacing: 0;
}

#menu {
	line-height: 150%; /*An experiment to see if the menu on wordpress becomes more spread out  */
	/*background: #fff;
	border-left: 1px dotted #ccc;
	border-top: 3px solid #e0e6e0;
	padding: 20px 0 10px 30px;
	right: 2px;
	top: 0;
	width: 11em;*/
}

#menu form {
	margin: 0 0 0 13px;
}

#menu input#s {
	width: 80%;
	background: #eee;
	border: 1px solid #999;
	color: #000;
}

#menu ul {
	color: #669999;/*was #ccc;*/
	font-weight: bold;
	list-style-type: none;
	margin: 0;
	padding-left: 3px;
	text-transform: lowercase;
	}

#menu ul li {
	font: italic normal 110%;/* 'Times New Roman', Times, serif;*/
	letter-spacing: 0.1em;
	margin-top: 10px;
	padding-left: 2px; /*added 1-1-10*/
	padding-bottom: 2px; /*border-bottom: dotted 1px #ccc;*/
	line-height: 150%;/*added 2-1-10 to see if menu is more spaced out*/

}

#menu ul ul {
	font-variant: normal;
	font-weight: normal;
	line-height: 100%;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

#menu ul ul li {
	border: 0;
	font: normal normal 12px/115%;/* 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;*/
	letter-spacing: 0;
	margin-top: 0;
	padding: 0;
	padding-left: 12px;
}

#menu ul ul li a {
	/*color: #000;
	text-decoration: none;*/
}

#menu ul ul li a:hover {
	/*border-bottom: 1px solid #809080;*/
}

#menu ul ul ul.children {
	font-size: 142%;
	padding-left: 4px;
}

/* abbr used for wordpress in more column*/
acronym, abbr {
	border-bottom: 1px dashed #333;
}

acronym, abbr, span.caps {
	font-size: 90%;
	letter-spacing: .07em;
}

acronym, abbr {
	cursor: help;
}

/* classes used by the_meta() */
ul.post-meta {
	list-style: none;
}

ul.post-meta span.post-meta-key {
	font-weight: bold;
}

/*credit used for link to wordpress where it says powered by wordpress  */
.credit {
	/*border-top: 3px double #aba;*/
	font-size: 11px;
	margin: 30px 0 0 0;
	/*padding: 3px;*/
	text-align: center;
}

/*
.credit a:link, .credit a:hover {
	color: #fff;
}
*/

.feedback {
	/*color: #ccc;*/
	text-align: right;
	clear: both;
}

/*cite used for wordpress citation at bottom right*/
cite {
	font-size: 90%;
	/*font-style: normal; - removed this 2-1-10*/ 
}

/*indivitemcontainer used as container for indivimagecontainer for images and indivtextcontainer for description on ceramicglassindividualitempage */
#indivitemcontainer{
width:580px;
/*border: solid 3px red;*/
float:left;
}


#indivimagecontainer {
width:150px;/*was 150px*/
float:left;
/*border:1px solid #333300;*/
}

#indivimagecontainer img {
margin-bottom: 5px;
border:1px solid #333300;
}

.clicktoenlarge{
text-align:center;
font-size: 75%;	
}

#indivtextcontainer{
width:420px;
/*border: solid 1px green;*/
float:left;
}

/*this for subheadings in index.htm page  */
/*it applies h3 to the class content so need to put <h3 class="content">*/
h3.indivtextcontainer 
{
text-align:center;
font-size: 1.1em;
color: #036;
margin: 0;
padding-top: 0.5em;
padding-bottom:0.3em;
font-weight: normal;
}



div.row {
	
  /*clear: both;*/
  /* border:1px solid green ;*/
  }

div.row h1 {
	font-size:110%;
	text-align:center;
  /*clear: both;*/
 
  }


div.row span.label {
	font-size:100%;
  float: left;
  width: 155px;
  text-align: right;
  border: solid #ccccff 1px;
  margin-left:50px;
  margin-bottom:2px;

  }

div.row span.formw {
	font-size:100%;
  float: right;
  width: 105px;
  text-align: left;
  border:#ccccff solid 1px;
  padding-left:2px;
  margin-right:100px;
  margin-bottom:2px;
  } 

input.buyorenquirebtn/*styling for buy or enquire button on ceramicglassindividualitempage*/
{
font-size:110%;
margin-top: 10px;
/*margin-bottom: 2px;*/
margin-left:130px;
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
float:left;
}

.returnbtn/*matching styling to buyorenquirebtn to return to previous page on ceramicglassindividualupdatepage.php*/
{
font-size:110%;
margin-top: 10px;
padding: 0 10px 0 10px;
/*margin-bottom: 2px;*/
margin-left:130px;
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
float:left;
}


/* This is to sort pearson metalwork on jpsortmetal.php */
form.sortmetal
{
float:left;	
/*margin-top:5px;/*added 10-7-10*/
margin-left: 100px;
/*border: 1px solid #000;/*added 21-2-2011*/
padding:1em;
color:red;
}

input.sortmetal/*styling for form for sortmetal.phpr*/
{
font-size:200%;
margin-top: 10px;
/*margin-bottom: 2px;*/
/*margin-right:130px;*/
color: #ccffff;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
/*float:left;*/
}




/* This is used on guild of handicraft page  */
form.pearsonbyyear
{
float:left;	
margin-top:10px;/*added 10-7-10*/
margin-left: 240px;
}

input.pearsonbyyear/*styling for form for pearsonyearbyyear*/
{
font-size:130%;
margin-top: 10px;
/*margin-bottom: 2px;*/
/*margin-right:130px;*/
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
/*float:left;*/
}

select.pearsonbyyear/*styling for form for pearsonyearbyyear - select is identical to input except for margin*/
{
font-size:130%;
margin-top: 10px;
/*margin-bottom: 2px;*/
/*margin-left:130px;*/
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
/*float:left;*/
}

/* This is used on page with drop down for individual pattern numbers */
form.individualpatternnumbers
{
float:left;	
margin-top:10px;/*added 12-7-10*/
margin-left: 150px;
}

input.individualpatternnumbers/*styling for form for individual pattern nos*/
{
font-size:110%;
margin-top: 10px;
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
}

select.individualpatternnumbers/*styling for form for ind pattern no - select is identical to input except for margin*/
{
font-size:110%;
margin-top: 10px;
color: red;/*#000000;*/
background: #CCCCCC;
border: 3px outset #ccccff;
}