/*
Read this for customize the layout.
The main TAG elements, like BODY, HTML, FORM, UL, LI, TD, H1, H2 are in the generic.css.
Edit in generic.css especially the BODY TAG. body { ... } for default font, background color, font size etc.
*/
/* Container, the big layout settings */
#container {
	width: 980px; /* you can setup as 100% like width: 100%; */
	min-width:980px; /* For all browsers apart from IE6 all you need ismin-width:Xpx; */
	margin: 10px auto; /* To centre your website within the browser, add relative positioning to the outer div, then set the margin to auto. */
    position: relative;
	background-color: #fff; /* set up background color if you need; */
	border: 1px solid #ccc; /* just uncomment it if you not need border */
}

/* Content */

#column1 {
	float: left;
	width: 645px;
	padding-left:5px;
}
/* Sidebar */

#column2 {
	float: right;
	width: 320px;
	padding-left:10px;
}

/* Header */

#header {
	height: 110px;
	margin: 0 auto;
	text-transform: uppercase;
}

#logo {
	background: url(../images/logo2.gif) no-repeat;
	height: 100%;
	}
	
#logo h1 {
    position:absolute;
    text-indent: -5000px;
}
			
/* Menu Header */

#menu {
	float: right;
	padding-top: 14px;
}
#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}
#menu li {
	display: inline; /* this do the trick to show all in one line */
}
#menu a {
	display: block;
	float: left;
	padding: 10px 20px;
	text-decoration: none;
	font-size: .85em;
	font-weight: bold;
}
#menu a:hover {
	text-decoration: underline;
}
/*
#menu .current_page_item a {
	background-color: #C3C3C3;
}
*/
/* You can float image automatically to left or right */	
.floatright
{
float: right;
margin: 0 0 10px 10px;
border: 0px solid #666;
padding: 2px;
}
.floatleft
{
float: left;
margin: 0 0 10px 10px;
border: 0px solid #666;
padding: 2px;
}

/* 
START HERE PARTS FROM SITE usually #NAME is connected to HTML template name.
EX: #left_menu will use programtemplates/left_menu.html

ATTENTION: When you edit this parts, enable DEBUG, to not cache the files.
*/

/* left_menu - the most important in many cases because a multitude of possibilities, 
you can use jQuery, Modal, or any other CSS menu solutions. */

#left_menu h2, #shopping_cart h2, #search h2, #newsletter h2, #product_topviewed h2, #product_latest h2, #headline_giftprod h2, #login h2, #news_top_daily h2, #faq_top_daily h2 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	color: #5C4C1B;
	background-color:#CCE27E;
	padding: 2px 5px;
	border-bottom:1px solid #999;
}

#left_menu ul, #product_topviewed ul, #product_latest ul, #headline_giftprod ul, #faq_top_daily ul, #news_top_daily ul { 	
	margin: 0;
	padding-left: 10px;
	list-style: none;
}
#left_menu li, #product_topviewed li, #product_latest li, #headline_giftprod li, #faq_top_daily li, #news_top_daily li {
	background-image: url(../images/skin1/bullets.gif);
	background-repeat: no-repeat;
	background-position: 0 0.55em;
	padding:0px 0px 0px 10px;
	line-height: 1.5;
	color:#58373E; 
	font-size: 12px;
}
#left_menu li {border-bottom:1px solid #ccc; margin:10px 0px;}

#left_menu li ul li {border-bottom:none; }

#left_menu li a {
	color:#630A24;
	text-decoration:none;
}

/* shopping_cart if is shop site - in main template*/

/* search - in main template*/

/* newsletter - in main template*/

/* headline_prod (special products) */
#headline_prod h1 {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	color: #5C4C1B;
	padding: 2px 5px;
	border-bottom:1px solid #A5CB13;
}
#headline_prod h2 {color: #3D000F; 	font-family:Verdana, Geneva, sans-serif;
	font-size:14px; text-align:center; font-weight:bold;}

#headline_prod h2 a {color: #3D000F; text-decoration:none;}

#headline_prod p {
	text-align:justify; font-size:11px;
	padding: 2px 5px;
}
#headline_prod img { 
	margin: 2px auto; /* center the image */
}

/* product_topviewed (TOP10 Products) */

/* product_latest (Last Added Products) - we just copied in this case from product_topviewed */

/* headline_giftprod (If your site is shop, and you setup GIFT products.) - we just copied in this case from product_topviewed */

/* faq_top_daily (for FAQ section, latest FAQ) - we just copied in this case from product_topviewed */

/* news_top_daily (News section, latest news) - we just copied in this case from product_topviewed */


/* Footer */

#footer {
	padding: 30px 0;
	background: #FFF;
	text-align: center;
	font-size: smaller;
}
#left_menu li a1 {
	color:#666666;
	text-decoration:none;
}
