/***********************************************/
/* fairTradeCSS.css                             */
/* Use with template fairTradeIndex.html          */
/***********************************************/

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 

body{
	font-family: Arial,sans-serif;
	color: #333333;
	line-height: 1.166;	
	margin: 0px;
	padding: 0px;
	text-align:center;
}

a{
	text-decoration: underline;
}

a:link{
	text-decoration: underline;
}

a:visited{
	text-decoration: underline;
}

a:hover{
	text-decoration: underline;
}
.footlinks {
 font-size: 70%;
 color: #006699;
}
.footlinks a {
	text-decoration: underline;
 color: #006699;
}

h2{
 font-family: Arial,sans-serif;
 font-size: 114%;
 color: #006699;
 margin: 0px;
 padding: 0px;
}

h3{
 font-family: Arial,sans-serif;
 font-size: 90%;
 font-weight: normal;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}

h4{
 font-family: Arial,sans-serif;
 font-size: 100%;
 font-weight: normal;
 color: #333333;
 margin: 0px;
 padding: 0px;
}

h5{
 font-family: Verdana,Arial,sans-serif;
 font-size: 100%;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}


/***********************************************/
/* Layout Divs                                 */
/***********************************************/


#masthead{
	padding: 10px 0px 0px 0px;
	border-bottom: 1px solid #cccccc;
	width: 100%;
}

#mainContainerDiv{
	float: left;
	margin: 0px;
	padding: 0px;
	width:800px;
	height:490px;
	background-color: #ffffff;
}
.latest-image {
	height: 100px;
	width: 90px;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	background-color: #CCCCCC;
	background-image: url(../images/lattest-products-bg.gif);
	background-repeat: no-repeat;
	display: block;
	padding: 0px;
	float: left;
}
*html .latest-image
{
	margin-bottom: 20px;
}

#content .feature p {
	padding: 0px;
	margin-top: 7px;
	margin-bottom: 7px;
}



#navBar{
	float: left;
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
	height: 490px;
	background-image: url(../images/left-nav-bg.gif);
	background-repeat: no-repeat;
}
.left-basket-contents {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #600109;
	text-decoration: none;
}


#headlines{
  float:right;
	width: 20%;
	border-left: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	padding-right: 10px;
}

#content{
	float: left;
	height:450px;
	overflow:auto;
	width:520px;
	background-color: #FFFFFF;
	background-image: url(../images/content-bg.gif);
	background-repeat: no-repeat;
	padding: 20px 40px;
}

#Cartcontent{
	float: left;
	padding-left: 56px;  
	padding-top: 26px;
	height:410px;
	overflow:auto;
}

.greenHeading{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight:normal;
	color: #72A92A;
	margin: 0px;
	padding: 0px;
	font-style: normal;
	line-height: normal;
	font-variant: normal;
	text-decoration: none;
}


.greenHeadingitem{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight:normal;
	color: #72A92A;
	margin: 0px;
	padding: 0px;
	font-style: normal;
	line-height: normal;
	font-variant: normal;
	text-decoration: none;
}

.greenText{
 font-family: Arial,sans-serif;
 font-size: 100%;
 font-weight:100;
 color: #72A92A;
 margin: 0px;
 padding: 0px;
}

.brownText{
 font-family: Arial,sans-serif;
 font-size: 100%;
 font-weight:100;
 color: #5F0008;
 margin: 0px;
 padding: 0px;
}

#privacyLink{
	text-align:center;
	color:#5F0008;
	font-size:70%;
}
#copyRight{
	text-align:center;
	color:#5F0008;
	font-size:70%;
}


#privacyLink a{
	color:#5F0008;
}


#grayText a {

	color:#999999;
}

#grayText{
 float:left;
 font-family: Arial,sans-serif;
 font-size: 80%;
 font-weight:100;
 color:#999999;
 margin: 0px;
 padding-left:250px!important;
 padding-left:30px;
}

#fairtradetopslice{
padding:0;
}


/***********************************************/
/* Components                                  */
/***********************************************/

#siteName{
	margin: 0;
	padding: 0 0 0 10px;
}



/*************** #pageName styles **************/

#pageName{
	margin: 0px;
	padding: 0px 0px 0px 10px;
}

/************* #breadCrumb styles *************/

#breadCrumb{
	font-size: 80%;
	padding: 2px 0px 0 10px;
}


/************** .feature styles ***************/
.commonLeftStyle{
	float:left;
	margin: 0px;
	padding: 0px;
}

.feature{
	padding: 0px 0px 10px 10px;
	font-size: 80%;
	width: 490px;
}

.feature h3{
	padding: 30px 0px 5px 0px;
	text-align: center;
}

.feature img{
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.required-field-image{
	padding: 0px;
	margin: 0px;
}


/************** itemdetail styles *****************/

#itemDetail{
	float: left;
	font-size: 75%;
	padding-left:50px;
}




/*********** #navBar link styles ***********/

#navBar ul {list-style: none; margin: 0; margin-left: 5px; padding-left: 15px;}

/* hack to fix IE/Win's broken rendering of block-level anchors in lists */
#navBar li {
	border-bottom: 0px solid #eee; 	
}


/* fix for browsers that don't need the hack */
html>body #navBar li {border-bottom: none;}


/*********** #sectionLinks styles ***********/

.sectionLinks ul
{
 line-height:165%;
}

/*--- Below , This is newly added class to add bullet arrow image front of the main itmes e.g  "Checkout"  */
.sectionLinks ul li
{
list-style-image:url(../images/left-link-arrow.gif);
}

.sectionLinks ul ul{
	list-style-image:none;
	font-size:80%;
	padding-left: 0px;
}

/*--- Below , This is newly added class to avoid bullet arrow image front of the sub itmes e.g  "Nedace" */
.sectionLinks ul ul li{
	list-style-image:none;
}

.sectionLinks{
	position: relative;
	margin: 0px;
	padding-left: 12px;
	font-size: 90%;
	padding-top: 12px;
	padding-right: 12px;
	padding-bottom: 12px;
}

.sectionLinks h3{
	padding: 0px 0px 5px 0px;
}

.sectionLinks a {
	padding: 0px 0px 0px 0px;
	color:#5F0008;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-decoration: none;
}

.sectionLinks a:hover{
	text-decoration: underline;
}

/*--- Below , This is newly added id to group the fotter(three) blocks in  a main block called footer  */
#footer
{
	width:900px;
	height:200px;
	position:relative;
	float:left;
	margin:0px;
	padding::0px;
}

#fairtradBot1{
	float:left; 
	background:url(../images/fair_trade_r19_c1.jpg); 
	width:294px; 
	height:93px;

}


#fairtradBot2{
	float:left; 
	text-align:center; 
	background:url(../images/fair_trade_r19_c9.jpg); 
	width:314px; 
	height:93px
}

#fairtradBot3{
	float:left; 
	background:url(../images/fair_trade_r19_c21.jpg); 
	width:292px; 
	height:93px;
}


/* NAVIGATOR STYLES */
#primaryNav
{
	list-style:none;
}
#primaryNav a {
  text-decoration: none;  color:#000000;
  font: bold 80% Tahoma;
  line-height: 350%;
  clear:both;
  
 }
 

#primaryNav a:hover { text-decoration: underline; }

#primaryNav {
   height: 45px;
   padding: 0; margin: 0; 
   width: 100%;
   
}
.arrowBg{
	width:inherit;
	background: red;
}

#primaryNav li {
	margin: 0;  
	float: left;
	text-align: left; 
	width:100px;
	margin-right: 0px;
	height: 45px; 
}

#primaryNav li#activeTab {
  width:101px;
}

#primaryNav li#home {
	background: url(../images/fair_trade_home.jpg) no-repeat top center;
}

#primaryNav li#hello {
  background: url(../images/fair_trade_hello.jpg) no-repeat top center;
}

#primaryNav li#howfair {
  background: url(../images/fair_trade_howfair.jpg) no-repeat top center;
}

#primaryNav li#letparty {
  background: url(../images/fair_trade_letparty.jpg) no-repeat top center;
}
#primaryNav li#contactus {
  background: url(../images/fair_trade_contactus.jpg) no-repeat top center;
  width:107px;
}

#primaryNav li#activeTab a {
  color: #003b77;
  font: bold 10px Tahoma;  
}

.arrow{
	padding-left:28px;
	background:url(../images/fair_trade_topicArrow.jpg) 12px;
	background-repeat:no-repeat;	
}

#fairtrade_tab {
	width:507px;
}

#bodyDiv{
	width:900px;
	/*text-align:left;*/
	margin:0 auto;
	text-align:left;
}

#boundDiv{
width:900px;
}

#rightColumn{
	float:right;
}
#realtooltip {
	margin: 0px;
	padding: 30px;
	height: 110px;
	width: 260px;
	position: absolute;
	visibility: visible;
	z-index: auto;
	top: 215px;
	background-color: #000000;
	background-image: url(../images/popup-bg.gif);
	background-repeat: no-repeat;
	right: 300px;
}
#realtooltip h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	color: #72A92A;
	text-decoration: none;
}
#realtooltip p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #666666;
	text-decoration: none;
}



#boundDiv #mainContainerDiv #content .feature form {
	margin: 0px;
	padding: 0px;
}
.img-thumb {
	padding: 2px;
	border: 1px solid #CCCCCC;
	margin: 2px 10px 2px 0px;
}
.product-image {
	border: 3px solid #DADAA7;
	padding: 0px;
	margin: 0px;
}
#latest-shower {
	padding: 0px;
	margin: 0px;
	clear: both;
	overflow: hidden;
}
.cart-details {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;
	text-decoration: none;
}
#sub-cat-list {
	list-style-image: url(../images/sub-cat-star-list.gif);
}
#sub-cat-list a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #5F0008;
	text-decoration: none;	
}
#sub-cat-list a:hover {
	text-decoration: underline;	
}
.page-no-block {
	background-color: #999999;
	margin: 0px 0px 0px 0px;
	padding: 0px 4px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}
.active-page-no-block {
	background-color: #cccccc;
	margin: 0px 0px 0px 0px;
	padding: 0px 4px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}
.footlink {
	font-size: 11px;
	margin: 0px;
	padding: 0px;
	display: inline;
}