<!--

/*=Generic-Elements
***************************************************************************/

 html       {overflow-y: scroll}
 body		{margin:20px 0;background:#000;}
 body, input, textarea{font: 400 10pt arial;color:#fff;}
 input, textarea{color:#00f;}
 h1			{display:none;}/* TODO */
 p,form		{margin:20px;color:#ccc;}
 a          {text-decoration:none;color:#0b0;outline:0;}
 a:hover    {color:#0f0;}
 ul			{padding:0;border:0;margin:0;list-style:none;}
 ul li a	{display:block;}/*TODO*/
 
/*=Generic-Classes
***************************************************************************/
 .hide		{width:1px;height:1px;visibility:hidden;position:absolute;}
 .clear		{clear:both;float:none;}
 .chkbox	{cursor:pointer;}
 
 
 
 

/*=MAIN LAYOUT
***************************************************************************/

 div.frame  {width:900px;margin:0 auto;position:relative;}
 div.head   {height:120px;position:relative;}
 div.main   {float:left;width:100%;min-height:480px;position:relative;padding:0;border:1px solid;border-color:#fff #000 #fff #000;}
 div.foot	{clear:both;height:20px;padding:10px;position:relative;}

 
 /*=Footer
***************************************************************************/

 div.foot span	            {display:block;float:left;}
 div.foot span.copyright    {float:right;}
 div.foot #sitemap	        {margin:0;border:0;padding:0;width:60px;text-align:center;position:absolute;left:50%;margin-left:-30px;background:#000;}

/*=a
***************************************************************************/


 a.logo		{float:left;display:block;width:300px;height:86px;background:url(tclogowhite.gif) no-repeat;margin:16px 0 0 6px;color:#000;}
 .title a, a p.title	{color:#fff;}

 
 
/*=h
***************************************************************************/

 h2,h3          {height:44px;line-height:44px;margin:0;text-align:center;color:#eee;font-weight:400;font-size:13pt;background:#000 url(fade-black.jpg) repeat-x;}
 div.item  h2   {color:#123;margin-bottom:30px;background:url(grade-2.jpg) repeat-x;}
 
/*=ul [no padding, no border, no bullets ('list-style')]
***************************************************************************/


 ul.menu li		{background:url(menubg.jpg) repeat-x;
 				position:relative;/* to accommodate New! span*/
 				line-height:28px;
 				}/*TODO 1%?????*/
 				
 ul.menu li a.selected,ul.menu li.selected a{color:#ffc;}/*TODO*/
 ul.menu li.selected	{background:#000;}
 
 
 .head ul.menu, .head ul.menu li {border:1px dotted #567;}
 /*testing, testing 123*/
 
 .head ul.menu		{float:right;position:relative;top:38px;right:-2px;border-width:0 0 0 1px;}
 .head ul.menu li	{float:left;border-width:0 1px 0 0;}/*TODO*/
 .head ul.menu li a	{padding:0 16px 0 16px;}
		
	/* SUBMENU */

 .head ul.menu li ul		{background:#000;z-index:1;position:absolute;display:none;left:-1px;top:28px;width:170px;border-top:1px dotted #567;}
 .head ul.menu li ul li		{width:100%;margin-bottom:1px;text-align:left;border-width:0 0 1px 0;}
 .head ul.menu li:hover ul	{display:block;}
 
 /* Items-Menu
 
*****************************************************/
 
 .main ul.menu    	{width:20%;float:left;}
 .main ul.menu li	{width:100%;margin:0 0 1px 0;text-indent:3px;;
 	border-bottom:1px dotted #345;}

 .main ul.many li	{line-height:22px;}
 
		/*=[New!] */
 .main ul.menu li span {position:absolute;top:0;left:-28px;font-size:6pt;color:#789;}
 
 
 
 
 
 
 
 
 /* TODO berriwillock */
 .login p		{padding:0 70px 0 70px;}
 



/*=Home
***************************************************************************/
 .home div.pictures	{position:relative;width:716px;left:50%;margin-left:-358px;}
 .home div.pictures img	{width:170px;height:230px;margin:3px;} .home p	{padding:20px 80px 10px 80px;}

/*=About
***************************************************************************/
 div.about			{width:100%;}
 div.about div		{width:80%;position:relative;margin-left:10%;}
 div.about div img	{float:left;height:400px;width:400px;border:0;position:relative;left:-40px;}
 div.about p		{text-align:justify;line-height:20px;}
 div.about div div	{position:absolute;top:30px;right:-10px;width:320px;height:340px;}
 div.about div div.history {width:270px;right:10px;}
 div.about div div.services{width:210px;right:60px;}
 div.about a.cycle	{position:absolute;font-size:0;right:40px;top:230px;width:30px;height:30px;background:url(next.jpg) no-repeat;color:#000;}
 div.about p.subhead{line-height:30px;text-indent:4px;font-weight:bold;color:#ffc;padding:0;border:1px solid #333;border-width:1px 0 1px 0;background:#111;}
 div.about p.subhead span	{padding-left:10px;color:#f00;font-weight:normal;}




/* ul.block
*************************************************/
/* Container-Generic*/ 
 ul.block            {position:relative;left:1px;float:left;width:80%;background:#ddd;padding-bottom:10px;margin:0 0 20px 0;}
 ul.block li a       {float:left;position:relative;background:#fff;color:#345;outline:0;border:1px solid #eee;left:10px;top:10px;margin:0 10px 10px 0;}
 ul.block li a img   {display:block;border:0;}
 ul.block li a:hover 			{border-color:#aaa;}
 ul.block li a:hover span		{background:#999;background:url(grade-1.jpg) repeat-x 0 60%;}
 ul.block li a span  {position:relative;display:block;width:100%;text-align:center;line-height:50px;height:50px;font-size:12pt;background:url(grade-1.jpg) repeat-x 0 10%;}

 ul.block li a span.info{line-height:22px;height:22px;font-size:10pt;background:#fff;}

 ul.block li a span span,
	ul.block li a:hover span span {position:absolute;font-size:0;color:#fff;top:-17px;left:4px;height:16px;width:50px;background:url(new-item.jpg) no-repeat;}


 ul.block li a span.price{width:100px;height:18px;line-height:18px;position:absolute;right:6px;bottom:52px;text-align:right;}

/* large images on light-grey; blocks of two; DEFAULT */
 ul.block li a img   {width:300px;height:200px;margin:21.5px;}

 span.price em{color:#f00;font-style:normal;}

/* small images on light-grey; blocks of three */
 ul.small            {padding-bottom:4px;}
 ul.small li a		 {margin:0 4px 4px 0;left:4px;top:4px;}
 ul.small li a img   {width:150px;height:100px;margin:41.5px;}
 ul.small li a span  {font-size:9pt;line-height:40px;height:40px;font-size:8pt;}
 ul.small li a span.price{font-size:8pt;bottom:43px;}
/* new-designs*/

 ul.new-designs            {padding:0;position:relative;left:50%;margin:0 0 20px -400px;width:800px;}
 ul.new-designs h3         {border-top:30px solid #000;background:url(grade-3.jpg) repeat-x;}
 ul.new-designs ul         {float:left;width:100%;clear:both;padding-bottom:10px;}
 ul.new-designs ul li a       {/*left:10px;top:10px;margin:0 10px 10px 0;*/}
 ul.new-designs ul li a img   {margin:41px;margin-bottom:10px;}
 ul.new-designs ul li a.middle{left:50%;margin-left:-190px;}

/* ul.new-designs ul li span.info{line-height:24px;height:24px;font-size:10pt;background:#fff;}*/

 ul.menu li a.view-choice{background:#000;color:#345;}


/*=Item
***************************************************************************/

 div.item	        {float:left;background:#fff;width:80%;margin-bottom:20px;}
 div #main-image	{float:left;width:500px;height:333px;background:#fff;position:relative;left:50%;margin:0 0 20px -250px;}
 div #thumb-images	{float:right;margin-right:16px;width:90px;height:300px;overflow:auto;}
 div #thumb-images img{cursor:pointer;float:right;width:70px;height:47px;margin:0 0 4px 0;border:1px solid #fff;}
 div #thumb-images img:hover	{border-color:#00f;}
 
 div.item p.materials	   {float:left;margin:0;width:100%;text-align:center;color:#555;}
 
 .item table			{width:100%;clear:both;}
 .item table tr.head td	{text-align:center;font-weight:bold;}
 .item table td			{font-size:9pt;line-height:28px;padding:0 8px 0 8px;}
 .item table td.price	{text-align:right;}
 .item table td.price span.vat{float:left;color:rgb(40,110,10);}

 /*----------------------- GENERAL COLOURS */
 .item table td			{color:#456;background:url(grade-1.jpg) repeat-x 0 10%;}
 .item table tr.head td	{color:#555;}
 
 #carriage				{float:left;}
 #carriage option		{background:#333;}
 
 
 
 .item table td.dimensions	{padding:0;text-indent:8px;position:relative;}
 div#extra-dimensions		{position:absolute;width:200px;}

 div#extra-dimensions p		{background:url(grade-1.jpg) repeat-x 0% 30%;margin:0;padding:0;color:#333;}






/*=Contact Us
***************************************************************************/

 p.address		{text-indent:40px;}
 p.feedback		{height:120px;border-bottom:1px dashed #666;}



/*=Customers [Logged-In]
***************************************************************************/
/*
 .customers table		{float:left;width:70%;background:#eee;}
 .customers table td	{color:#036;padding:4px;background:url(grade-1.jpg) repeat-x 0 50%;}
 .customers table td.c	{text-align:right;color:#f00;}
*/



 .customers             {margin-bottom:20px;}
 .customers h4			{text-indent:10px;color:#789;}
 .customers p,.customers form,.customers ul{margin-left:7%;}
 .customers ul    		{list-style-position:inside;list-style-type:disc;color:#789;margin-bottom:10px;}
 .customers ul li 		{background:#111;line-height:20px;}
 .customers div.section {background:#111;padding:8px 8px 8px 28px;border:1px solid #333;margin:10px 6% 10px 6%}


/*=Sitemap
***************************************************************************/

#sitemap		    {width:600px;margin:40px auto;padding:20px 60px;border:1px solid #444;background:#111;}
#sitemap p	        {text-align:center;margin:0;}
#sitemap ul			{list-style:none;}
#sitemap ul	ul		{padding-left:50px;border-left:1px dotted #555;}
#sitemap li 		{line-height:18pt;position:relative;background:#111;}
#sitemap li a		{display:inline;cursor:pointer;}
#sitemap.home		{border-bottom:1px dotted #555;width:85%;}
#sitemap ul a.change-view{text-align:center;line-height:12px;width:14px;height:14px;background:#444;position:absolute;left:-22px;top:5px;cursor:pointer;color:#aaa;}
#sitemap ul a.change-view:hover{color:#ffc;}
#sitemap #expand-collapse{color:#999;position:absolute;right:0;}
p#page_content		{clear:both;color:#678;text-align:justify;font-size:9pt;padding-left:20%;}




































/*=Filter/Search
***************************************************************************/

 .head form		    {position:absolute;top:92px;left:110px;}
 .head form input	{background:#111;border:1px solid #444;color:#ffc;text-align:center;}



/*=Generic-Group-Element-Layouts
***************************************************************************/

 form.standard				{position:relative;left:50%;width:60%;margin:0 0 20px -30%;padding:20px 10px 10px;}
 form.standard p			{float:left;width:95%;margin:0;position:relative;padding:4px 0;}
 form.standard p label		{width:20%;display:block;text-align:right;padding-right:10px;}
 form.standard p input		{width:70%;}
 form.standard p textarea	{width:94%;/*height:60px;*/}
 form.standard p.submit input,
    form.standard input.submit	{width:80px;cursor:pointer;color:#090;font-weight:bold;}
 form.standard p label,
 form.standard p input,
    form.standard p textarea	{float:right;}
 form.standard p span		{position:absolute;top:4px;left:12px;}
 form.standard p label,
    form.standard p span		{line-height:22px;}
 form.standard div			{clear:both;}
 form.standard p.check		{text-align:right;}
 form.standard p.check input{width:20px;height:20px;padding:0;margin-left:10px;}


/************************************* COLOURS */
 form.standard				{background:url(wood.jpg) repeat-y;background:#222;border:1px solid #333;}
 form.standard input,
 form.standard textarea 	{background:rgb(220,220,170);}
 form.standard p span		{color:#f00;}			/* error */
 input.submit				{background:rgb(220,220,170);font-weight:bold;}


/*=Order-Form
***************************************************************************/
 .order form			{left:50%;width:90%;margin:10px 0 20px -46%;padding:10px;}	
 .order form table		{border-collapse:collapse;}
 .order form table td		{border:1px solid #000;line-height:22px;}
 .order form table select	{color:#fff;background:#111;}
 .order form select.item-list	{width:400px;}
 .order form input.qty		{width:60px;text-align:right;color:#f00;font-weight:bold;}
 .order form table .numeral	{width:70px;text-align:right;}
 .order form table .delete	{width:70px;text-align:center;}
 .order form table tr.head td,
 .summary			{text-align:center;background:#333;font-weight:500;}
 .summary			{text-align:right;padding-right:4px;}
 .summary input			{/*margin-right:24px;padding:0;*/}
 form.standard input.orderref	{width:98%;}
 .vat				{font-style:italic;text-align:center;color:#090;}
 td.order			{background:#111;color:#ffc;}
 form.standard input.submit	{width:90px;margin:0;}
 .order form .submit-buttons	{border:0;}
 .order form .submit-buttons input {float:right;margin:4px 0 2px 0;}
 form.standard input.cancel	{color:#f00;float:left;margin-top:6px;}

/*****************************************************************/

 table.table01			{border-collapse:collapse;margin:0 auto;}
 table.table01 tr.title td	{text-align:center;}
 table.table01 td		{text-align:right;border:1px solid #333;padding:4px 8px 4px 8px;}			
 table.table01 tr.header td	{text-align:center;background:#222;}
 table.table01 td.itemName	{text-align:left;}
 p.order-refs			{text-align:center;}
 p.order-refs strong		{color:#ff6;}
 textarea.test{width:900px;height:200px;font-family:courier;}
 
 




-->
