/*** towcoffe.com ***/

/* body ->basically defines the whole background-color, the fonts to be used, width of the banner to be used, the space between two sencteces & alignment...*/
body
{
	background-color: #fff;
        font-family: Arial, Helvetica, Verdana, "Lucida Grande", Tahoma;
	font-size: 12px;
	line-height: 16px;
	text-align: justify;
	width: 900px;
	margin-left: auto;
	margin-right: auto;

	
}

/* To make slideshow in front page */
<style type="text/css">

.slideshow { 
       height: 100px;
       width: 500px;
       margin: auto;
       overflow-style: marquee; 
}
 
.slideshow img { 
       height:300px;
       width: 500px;
       padding: 1px ;
       border: 10px solid #ccc;
       background-color: #eee; 
       overflow-style: marquee;
       float: right;
      position: relative;
 left: 55px;
       
}

/* this style for the caption text */
div.acaption {
	color: white;
	float: left;
	position: absolute;
	top: 280px;
	z-index: 1000;
	font-size: 18px;
	right: 150px;
	text-shadow: black 0px 0px 0px;
	font-weight: bold;
        overflow-style: marquee;
        font-family:veranda,aerial narrow,sans seriff; 
        font-style: oblique;
        color: #FFFFFF;
       padding: 5px 5px;
       background: #9B6634; 

}

</style>


/* Changes the text color of links more */


p { 

align: left;
 margin-top: 0; 
margin-bottom: 0; 


}

ul
{
list-style-type: disc;
padding-left: 20px;
margin: 0px;
}

ul ul{
list-style-type: circle;
}

a
{
	color: #9B6634;
	text-decoration: none;
	border-color: #9B6634;
	

}


a:hover
{
    color:#9B6634;
	text-decoration: none;
	border-bottom: none;
   /* border: 1px solid #6E5946;*/
    	
}
 	

#content table tbody tr td b ul.category_list li.active a {
	color: #9B6634;
	
}

#content table tbody tr td b ul.category_list li a {
	color: #9B6634;
	
}

#content table tbody tr td b ul.category_list li a {
	color: #9B6634;
}

#content table tbody tr td b ul.category_list li a {
	color: #9B6634;
}

#content table tbody tr td b ul.category_list li a {
	color: #9B6634;
}

/* Style for the purchase order button */


input#surname {
	padding-right: 50px;
	width: 354px;
	
	
}

#yab-checkout-form fieldset p.yab-shop-required.yab-shop-street label {
	
	float: left;   
	 width: 20px;
	
}

#firstname {
	padding-right: 50px;
	width: 354px;
	
}

p{
	    margin: 3px;
            margin-top:1px;
	    margin-bottom: 1px;	   
}



#yab-checkout-form fieldset {
	
	 
     width: 500px;
	
}

#yab-checkout-form fieldset p.yab-shop-required.yab-shop-firstname label {
	 float: left;   
	 width: 75px;
	 
}

#yab-checkout-form fieldset p.yab-shop-required.yab-shop-zip label {
	width: 20px;
	
}

#yab-checkout-form fieldset p.yab-shop-phone label {
	width: 75px;
}

#yab-checkout-form fieldset p.yab-shop-email.yab-shop-required label {
	width: 75px;
	
}

#yab-checkout-form fieldset p.tou.remember label {
	
	width: 250px;
}

#message {
	
	width: 405px;
	height: 200px;
        padding-left: 0px;
        float: right;

	
}

#street {
	padding-right: 30px;
	width: 354px;	
}

#city {
	padding-right: 30px;
	width: 354px;	
	
}

#postal {
	padding-right: 30px;
	width: 354px;
	
}

#phone {
	padding-right: 50px;
	width: 354px;
	
}

#email {
	padding-right: 50px;
	width: 354px;
	
}

#yab-checkout-form fieldset p.yab-shop-payments label {
	float: left;
	width: 100px;
	padding-right: 30px;
	
}

span#yab-shop-one-payment {
	float: left;
	width: 250px;
	padding-right: 30px;
	
}

#yab-checkout-form fieldset p.yab-shop-text label {
	
	float: left;
	width: 350px;
	
	
}

label.city {
	width: 10px;
	float: left;
	padding-right: 30px;
	
}

#yab-checkout-form fieldset p.yab-shop-required.yab-shop-surname label {
	float: left;
	width: 75px;

}


img
{ 

	border: none;
}

img.animage {
	float: right;
	width: 85px;
	
}

h1, h1 a /* used as Navigation-Title */
{
	margin: 0px;
	color: white;
	font-weight: bold;
	font-size: 14px;
	line-height: 1em;
	border-color: white;
}

h2, h2 a /* used as Article-Title */
{
	margin: 3px;
	font-weight: bold;
	font-size: 13px;
	line-height: 1em;
	color: #9B6634;
	border-color: #996633;
}


h6, h6 a /* used as Article-Title */
{
           
	 margin: 3px -13px 3px 4px;
	font-weight: bold;
        text-align: center;
	font-size: 12px;
	line-height: 1.2em;
	color: white; 
       
        
        	
}

#sidebar-2 {
	caption-side
	margin-left: 1px;
	float: right;
	/*font-size: 10pt; */
        /* background-color: bluegreen; */
	/* border: 1px outset maroon; */
	padding: 0px;
	color: #a37b42;
		
}
a:link {color: #9B6634}



/* IE7 hack */
*:first-child+html h6, h6 a {

    margin: 3px -10px 3px 13px;
	font-weight: bold;
    text-align:left;
	font-size: 12px;
	line-height: 1.2em;
	color: white;
        
}



/* IE6 hack */
* html h6, h6 a {
        margin: 3px -10px 3px 15px;
	font-weight: bold;
        text-align:left;
	font-size: 12px;
	line-height: 1.2em;
	color: white;
}


h3, h3 a /* for h3 from the tinymce */
{
	margin: 0px;
	font-weight: bold;
	font-size: 13px;
	line-height: 1em;
	color: #9B6634;
	border-color: #996633;
}


h1 a:hover /* used as Navigation/Article-Title */
{
	border-bottom: none;
	color: brown;
}

h2 a:hover
{
  border-bottom:1px solid;
 
}


/*** Layout ***/
/* header part-> basically defines the banner of the site */
#header
{
	position: relative;
	height: 138px;
	width: 900px;


	background: black url(./images/header_towcoffee.jpg) 

/* background: black url(http://localhost:8888/topoftheworldcoffee/images/header_towcoffee.jpg)  */


no-repeat;
      z-index: 9999;
	border: 0px;
	
	
}


/* whole rectangular area below header */
#container
{
	position: relative;
	width: 896px;
	margin-left: auto;
	margin-right: auto;
	padding: 1px;
	padding-bottom: 0px;
	background-color: #DBC68D;
	border: 1px solid black;

}

/* My Comment */

/* Content -> Is the area whre the content lies except the side bar */
#content
{
	padding: 0px;
	zfloat: left;
	width: 880px;
	border: none;		
}

/* sidebar -> Is the sidebar that appears at the righthand side with small box */
#sidebar
{
	width: 200px;
	padding: 0px;
	HIDEmargin-left: 525px;
	border:none;

}


#sidebar1
{
	width: 160px;
	padding: 0px;
	margin-left: 525px;
	border: none;

}


/* footer -> This is for the footer part */
#footer
{
	position: relative;
	background-image: url(./images/footer_bg.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	color: black;
	text-align: right;
	line-height: 1em;
	font-size: 10px;
	zpadding: 5px 20px;
	border: none;
}

/*** Header ***/
/* This is for the Top horizontal menu on the header */
ul.navTop,
div.date
{
	position: absolute;  
	top: 108px;
	left: 0px;
	height: 30px;
	color: white;
	font-weight: bold;
	font-size: 12px;
	line-height: 1em;
	padding: 7px 15px;
	margin: 0px;
	border: none;
}

/* This deals with the place where date to be shown */
div.date
{
	padding: 9px 15px;
	left: auto;
	right: 0px;
}

/* It also defines the top menu position */ 
.navTop li
{
	float: left;
	list-style: none;
	margin-right: 14px;
	position: relative;
	
}

.navTop li ul
{
	position: relative;
	top: 100%;
	left: 0px;
	width: 15em;
	list-style: none;
	margin: 0px;
	padding: 0px;
	border: 1px solid white;
	/* background-color: blue; */
	display: none;
	
}
/* This difines the text color of top horizontal menu & its vertical position */

.navTop li a
{
	color: white;
	display: block;
	width: auto;
	font-weight: bold;
	text-decoration: none;
	border: none;
	padding: 2px;
}

.navTop li ul li
{
	display: block;
	width: 100%;
	padding: 0px;
	margin: 0px;
}

.navTop li:hover ul
{
	display: block;
}

.navTop li:hover ul li,
.navTop li:hover ul li a
{
	background-color: lightgreen;
	color: white;
}

.navTop li:hover,
.navTop li:hover a,
.navTop li ul li:hover,
.navTop li ul li:hover a
{
	background-color: transparent;
	color: brown;
}

/* It sets the navigational titile */
.navTitleLeft, .navTitleRight
{
	background-image: url(./images/title_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 25px;
	padding: 0px 10px;
	vertical-align: middle;
}

.navTitleRight
{
	background-position: right top;
}

/*** Boxes General ***/
/*boxe -> deals with the sidebar box, navigation title box and content box */
.box
{
	margin-bottom: 10px;
	width: 100%;
	table-layout: auto;
	empty-cells: show;
	border-spacing: 0px;
	border-padding: 0px;
        
	
}

.headLeft, .headRight 
{
	height: 10px;
	background-repeat: no-repeat;
	background-position: left top;
	padding: 0px 6px;
	vertical-align: middle;
                
}

/* It helps to set the curve corner in the content box where the text lies */
.headRight
{
	background-position: right top;
        text-align: right;
        width:-25px;
       
       
}

/* sets the border(color) of sidebar box and content box */
.body
{
	border-left: 1px solid black;
	border-right: 1px solid black;
	background-color: white;
	padding: 1px 7px;

}

/* It helps to get a small thin horizontal line below each page */
.seperator
{
	margin: 0px;
	margin-top: 5px;
	line-height: 1px;
	border: none;
	background-color: #996633;
}

/* It helps to set the text font, position, padding below the seperator line */

.footLeft, .footRight
{
	height: 10px;
	background-repeat: no-repeat;
	background-position: bottom left;
	padding: 0px 10px;
	font-size: 9px;
	vertical-align: middle;
}

/* This sets the curve at the right hand side of the container */
.footRight
{
	background-position: right bottom;
	text-align: right;
}

#sidebar .foot span,
#sidebar .seperator
{
	display: none;
}

/*** Box1 Details ***/
/* Upper part of the container */
.box1 .headLeft,
.box1 .headRight
{
	background-image: url(./images/box1_head_bg.gif);
}

.box1 h2,
.box1 h2 a
{
	color: #996633;
	border-color: #DBC68D;
}

/* This is the bottom part of the container */
.box1 .footLeft,
.box1 .footRight
{
	background-image: url(./images/box1_foot_bg.gif);
}

/*** Box2 Details ***/

/* This is upper part of the sidebar */
.box2 .headLeft,
.box2 .headRight
{
	background-image: url(./images/box_head_bg.gif);

}

.box2 h2,
.box2 h2 a
{
	color: white;
	border-color: white;

}


/* This is bottom part of the sidebar */

.box2 .footLeft,
.box2 .footRight
{
	background-image: url(./images/box_foot_bg.gif);
}

.box2 .seperator
{
	display: none;
}
.box2 .foot span,
.box2 .foot span a
{
	color: white;
	border-color: white;
}

/*** Box3 Details ***/
.box3 .headLeft,
.box3 .headRight
{
	background-image: url(./images/box1_head_bg.gif);
}

.box3 h2,
.box3 h2 a
{
	color: blue;
	border-color: blue;
}

.box3 .footLeft,
.box3 .footRight
{
	background-image: url(./images/box1_foot_bg.gif);
}

.box3 .foot span,
.box3 .seperator
{
	display: none;
}

/*** Seperator in Links ***/
.links .spacer
{
	background-color: transparent;
	height: 10px;
}

/*** Image Gallery ***/
/*** Paging ***/
.paging a,
.paging a:hover
{
	border: none;
}

.pagingRight
{
	text-align: right;
}

/*** Forms ***/

form * label
{
	display: block;
	float: left;
	width: 20%;
	text-align: left;
	padding-right: 15px;
	margin-top: 5px;
	width: 60px;
	padding: 1px;
	
}



input.submit {
	    width: 82px;
           margin-top: 3px; 
           float: left;


}




#content table tbody tr td {
	
	position: relative;
	color: black;
}

ul.category_list {
	
	color: #9B6634;
	
}

.entry-body select {
  outline-width: 120px;
  border: 1px solid #928E73;
  display: block;
  float: left;
  padding: 5px 2px;
  
}

input, select, textarea {
  border: 1px solid #6E5946;
  color: #6E5946;
  margin: 3px;
 
 
    
  }

form * label.zemRequired
{
	font-weight: bold;
}
form * input[type=text],

form * input[type=password],
form * input[type=file],
form * textarea,
form * select
{
	display: block;
	float: left;
	margin-top: 5px;
	margin-right: 5px;
	width: 50px;
}

form * input[type=radio],
form * input[type=checkbox]
{
	display: block;
	float: left;
	margin-top: 5px;
	margin-left: 21%;
}

form * input[type=radio] + label,
form * input[type=checkbox] + label,
form * input[type=text] + label,
form * input[type=password] + label,
form * input[type=file] + label,
form * input[type=button] + label,
form * input[type=submit] + label,
form * input[type=reset] + label,
form * input + input
{
	display: block;
	float: left;
	margin-left: 0px;
	width: auto;
	text-align: left;
}

form * br
{
	clear: both;
}

/* This is for image gallery */

.rssThumbFloat a
{
	border: none;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}


#sidelink a{ 
		color: red;
                font-size: 13px;
		/* background-color: #DBC68D; */	
		padding: 3px 0 3px 0;
		text-decoration: none;
		margin-left:0px;
		margin-right:0px; 
		font-weight: bold;              
                text-align:right;
                border:none;
                
	} 

#sidelink a:hover{
		background-color:#B77833;
		color: #FFF; 
                
}	                              

p.textnew
	{ 
		color: red;
                font-size: 10px;
		background-color: #fff;	
		display: block;
		display:inline; 
		width: 200px;
                height:30px;
		padding: 1px 0 3px 0;
		text-decoration: none;
		margin-left:0px;
		margin-right:auto;  
                margin-top:-80px
		font-weight: bold;  
                border:1px solid green;     
	} 

h6 p {
margin: 0;
padding: 0;
text-align: center;
}



/* to set default link colour */
ul.cat_menu a { color: black }

/* to set active link colour */
ul.cat_menu .active_class a { color: red }
ul.cat_menu .active_class ul a { color: black }


a.yab-to-checkout {
	border: none;
	font-size: 10pts;
	font-weight: Sans-serif;
	float: left;
	border: none;
        padding: 5px 10px;
        color: #FFFFFF;
        padding: 5px 10px;
        background: #9B6634;
        background-image: url(./images/148.png);  
        background-repeat:no-repeat;
        background-position:right center;
        width:  140px;

}

/* this style is for aligning the Zero's */
.yab-checkout-price{
	float: right;	
	position: relative;
       		
}
	


th.yab-checkout-price {
    position: relative;
    padding-left: 11px;    
    float: left;

}


b {
	
	color: #9B6634 ;
	
}

#sidebar-2 span.yab-empty {
	color: #9B6634 ;
}

.yab-add-select-grind{
            width: 180px;
            align: left;
}

.yab_shop_add_select{
	          float: left;
              width: 80px;
}



/* gap between the content and the sidebar right */
td {
	   
		padding-right: 3px;
}

  /*end */


/* for the link that had been kept on the checkout page */
#content table tbody tr td b form input {
	
	border: none;
	font-size: 20pts;
	font-weight: Sans-serif;
	float: right;
	border: none;
        padding: 5px 10px;
        color: #FFFFFF;
        padding: 5px 10px;
        background: #9B6634;
        a:link {color: #9B6634}
	
} /* End checkout page */


/* For shifting the Currency on the right hand side */
.yab-shop-price{
	float: right;
}



.submit-edit{
	width: 80px;

	
}
.submit-del{
	width: 50px;
}
img.image {

	position: relative;
	height: 30px;
	width: 40px;
	float: left;
	padding-left: 130px;

	
}


/* this style for the arrow on the "back to shop link" button */
#content table tbody tr td b form input.input {
	 background-image: url(./images/147.png);
	 background-repeat: no-repeat;
	 background-position: left top;
	 width: 190px;
	 padding-left: 35px;
	 height: 26px;


}



#yab-checkout-form fieldset p.submit input.submit {
	
   	float: right;
	width: px;
        border: none;
	font-size: 10pts;
	font-weight: Sans-serif;
	border: none;
        padding: 5px 10px;
        color: #FFFFFF;
        padding: 5px 10px;
        background: #9B6634;
        /* position: absolute; */
        /*  margin-top: -7px;  */
        /*  margin-left: 20px; */
       
} /*End */



/* this for the text appering on the navTop */
p.text_navtop {
        border: 1px solid #9B6634;
	width: 430px;
	background-color: #9B6634;
	color: white;
	position: absolute;
	margin-top: -38px;
	font-family:veranda,aerial narrow,sans seriff;
	font-size: 13px;
	margin-left:35px;

}

#content table tbody tr td b form table tbody tr td {
	
	position: absolute;	
	width: 250px;
	margin-left: 65px;
	
}


p.text_order {
        border: 1px solid #9B6634;
	width: 430px;
	background-color: #9B6634;
	color: white;
	position: absolute;
	margin-top: -147px;
	font-family:veranda,aerial narrow,sans seriff;
	font-size: 13px;
	margin-left: 20px;

}