@charset "utf-8";
img, a, div, input{ behavior: url(iepngfix.htc);}
body  {
	font: 100% Arial, Helvetica, sans-serif;
	background: #603913 url(images/strip_bg.gif) repeat-y top center;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color:#FFF;
}

.containerWrapper 
{
	margin: 0;
	padding: 0;
}

.wrapper {
	background: url(images/bg.jpg) no-repeat center top;
}
.twoColFixLtHdr .container {
	width: 960px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto;
} 
.twoColFixLtHdr .header {
	padding: 0 55px 0 20px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
} 
.header h1 {
	margin: 0;
	text-align: right;
}
.header h1 span {
	display: none;
}

/*////////   NAVIGATION /////////*/
.container .header .nav {
	margin: 10px 0px 0px 0px;
	padding: 0px;
	height: 74px;
	width: 894px;
	list-style: none;
/*	background: url(images/nav.gif) no-repeat right top;*/
}
.container .header .nav li {
	float: right;
	height: 57px;
	text-indent: -9000em;
	margin:0 0px 0 0;
	padding:0 0 0 7px
		}
.nav  a {background: url(images/nav.png) no-repeat;outline:none;height:57px;}
		
.nav a.home {background-position: right top;display: block;width:100px; }
.nav a:hover.home {background-position: right -80px;display: block;width:100px; }
.nav a.events {background-position: -620px top;display: block;width:100px;}
.nav a:hover.events {background-position: -620px -80px;display: block;width:100px;}
.nav a.branches {background-position: -553px top;display: block;width:70px;}
.nav a:hover.branches {background-position: -553px -80px;display: block;width:70px;}
.nav a.jobs {background-position: -439px top;display: block;width:95px;}
.nav a:hover.jobs {background-position: -439px -80px;display: block;width:95px;}
.nav a.request {background-position: -341px top;display: block;width:83px;}
.nav a:hover.request {background-position: -341px -80px;display: block;width:83px;}
.nav a.woc {background-position: -216px top;display: block;width:112px;}
.nav a:hover.woc {background-position: -216px -80px;display: block;width:112px;}
.nav a.customers {background-position: -95px top;display: block;width:112px;}
.nav a:hover.customers {background-position: -95px -80px;display: block;width:112px;}
.nav a.contact {background-position: -9px top;display: block;width:79px;}
.nav a:hover.contact {background-position: -9px -80px;display: block;width:79px;}
		

body#home ul.nav a.home{background: url(images/nav.png) no-repeat right -163px;width:100px; }
body#events ul.nav a.events{background: url(images/nav.png) no-repeat -620px -163px;width:100px; }
body#branches ul.nav a.branches{background: url(images/nav.png) no-repeat -553px -163px;width:70px; }
body#jobs ul.nav a.jobs{background-position: -439px -163px ;display: block;width:95px;}
body#request ul.nav a.request{background-position: -341px -163px ;display: block;width:83px;}
body#woc ul.nav a.woc{background-position: -216px -163px ;display: block;width:112px;}
body#customers ul.nav a.customers{background-position: -95px -163px ;display: block;width:112px;}
body#contact ul.nav a.contact{background-position: -9px -163px ;display: block;width:79px;}

/*////////   END NAVIGATION /////////*/



.twoColFixLtHdr #sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 200px; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 0px;
	margin-top: 35px;
	margin-left: 30px;
}

.twoColFixLtHdr #sidebar1 img
{
	border:0;
}

.twoColFixLtHdr #mainContent {
	margin: 0 0 0 250px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0 60px 0 16px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	text-align: right;
	direction:rtl;
	font: 14px/17px Arial, Helvetica, sans-serif;
	color: #FFFFFF;

} 
.twoColFixLtHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
.wrapper .container #mainContent .mainpage{
	 display:block;
	 width: 250px;
	 font-size: 16px;
	font-weight: bold;
	color: #FFFFFF;
	float: right; 
	
}

/*////////   BAGS	 /////////*/

.container #mainContent .bags {
	float: left;
	width: 370px;
	height: 228px;
	margin-top: 15px;
}
.container #mainContent .bags ul {
	list-style-type:none;
	margin:0;
	padding:0;
}
.container #mainContent .bags ul li {
	float:left;
}


.bags .bagevents a {
	background:url(images/bags.png) no-repeat left bottom;
	height: 228px;
	width: 140px;
	display:block;
	
}
.bags .bagevents a:hover{
	background:url(images/bags.png) no-repeat left -3px;
	
}
.bags .bagbranches a{
	background:url(images/bags.png) no-repeat -140px bottom;
	height: 228px;
	width: 130px;
	display:block;
}
.bags .bagbranches a:hover{
	background:url(images/bags.png) no-repeat -140px -3px;
	
}
.bags .bagwoc a{
	background:url(images/bags.png) no-repeat -270px bottom;
	height: 228px;
	width: 100px;
	display:block;
}
.bags .bagwoc a:hover{
	background:url(images/bags.png) no-repeat -270px -3px;
	
}
/*////////   FOOTER	 /////////*/
 
.twoColFixLtHdr #footer {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 0px;
	padding-bottom: 10px;
}


#branch 
{
	width:220px;
}

#footer ul {
margin:0;
padding:0;
}
#footer li {
	display:inline;
	list-style: none;
	padding-left: 12px;
	
}
#footer li a, #footer li a:link, #footer li a:visited{
	font: 12px Rod, Arial, sans-serif;
	color: #FFFFFF;
	text-decoration:none;
	outline:none;
}
#footer li a:hover{
	text-decoration:underline;
	color:#990000;
}
#mainContent h2 {
	margin: 0px 0px 7px;
	padding: 0px;
}
#mainContent .contentimg {
	border: 6px solid #cfbfaf;
}

/*//////////////   FORM   ///////////////*/
#mainContent .form {
	font-size: 14px;
	font-weight: bold;
	color: #603913;
	background: url(images/form_bg.png) no-repeat center top;
	padding: 14px 8px 8px;
	width: 644px;
	
}
#mainContent .bg2 {background: url(images/form_bg2.png) no-repeat center top;}
input, textarea, select {
	background: url(images/input_bg.gif) no-repeat right top;
	border: 1px solid #603913;
	font: bold 14px Arial, Helvetica, sans-serif;
	color: #F8F5F3;
	text-align: right;
	padding: 5px 3px 5px 2px;
	width: 140px;
	margin-bottom: 12px;
	margin-top: -5px;
	margin-right: 5px;
}

.checkbox
{
	width:12px;
	height:12px;
	border:0px solid #CECECE;
}

.disable
{
	background-image: none;
	background-color: #867E6F;
}

select { color:#603913; background:#C2B59B; }

.inputtext {
	background: url(images/input_bg.gif) no-repeat right top;
	border: 1px solid #603913;
	font: bold normal 14px Arial, Helvetica, sans-serif;
	color: #F8F5F3;
	text-align: right;
	padding: 5px 3px 5px 2px;
	width: 350px;
	margin:0 5px 0 0;
	float: right;
}

.formreset{
	background:none;
	border:none;
	padding:none;
	width:20px;
}
.formreset3{
	background:none;
	border:none;
	padding:none;
	width:20px;
	margin:0;
	padding:0;
}
.formreset2{
	background:none;
	border:none;
	padding:none;
	width:120px;
}
.form td {
	text-align: left;
	padding-top: 0px;
}
.submitBtn {
	width:95px;
	height:42px;
	border:none;
	background:none;
	margin: 0px;
	padding: 0px;
}
.enrole {
	float: left;
	margin-left: 5px;
	
	width: 75px;
	text-align: center;
	line-height: 20px;
}
.jobs .jobentry {
	border-bottom: 1px dashed #BDAA92;
	margin-bottom: 5px;
	padding-bottom: 5px;
	position: relative;
	width: 100%;
}
.enrole a, .enrole a:link {
	color: #FFFFFF;
	
	text-decoration:none;
	background: #880408;
	padding:2px;
	display:block;
	outline:none;
}
.enrole a:visited {
color:#BDAA92;

}
.enrole a:hover {
color:#880408;

background: #BDAA92;
}
.jobentry h4 {
	font-size: 14px;
	font-weight: bold;
	color: #890409;
	margin: 0px;
	padding: 0px;
	text-decoration: underline;
}
.popupform {
	background: url(images/pop_up_form.gif) no-repeat center top;
	height: 250px;
	width: 325px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 2000;
	padding-top: 30px;
	padding-right: 30px;
}
.popupform td {
	font-weight: bold;
	color: #FFFFFF;
}
.close {
	position:absolute;
	bottom:55px;
	text-align: center;
	right: 17px;
}
.close a, .close a:link {
	color: #FFFFFF;
    border-bottom: 1px dashed #fff;
	text-decoration:none;
	
	padding:2px;
	display:block;
	outline:none;
}
.close a:visited {
color:#FFFFFF;
border-bottom: 1px dashed #fff;
}
.close a:hover {
color:#BDAA92;
border-bottom: 1px dashed #BDAA92;

}
.popupform .remark 
{
	visibility:hidden;
	font-size: 11px;
	color: #FFFFFF;
	background: #880408;
	float: right;
	padding: 1px 3px;
	margin-top: 3px;
}
.remark {
	font-size: 11px;
	color: #FFFFFF;
	background: #880408;
	float: right;
	padding: 1px 3px;
	margin-top: 0px;
	margin-bottom: 8px;
}
.cumpulsory {
	font-size: 14px;
	font-weight: bold;
	color: #880408;
}
.form h4 {
	float: right;
	margin: 0px 28px 0px 0px;
	padding: 0px;
}
.form .rank td, .form .rank th{
	text-align: center;
	float: none;
	padding-top: 3px;
	padding-bottom: 3px;
	border: 1px solid #927858;
}
.rank {
margin:10px 0;
border-collapse:collapse;
}
.rank th {background:#603913; color:#fff;}
.allshops .area a, .allshops .area a:link, .allshops .area a:visited {
	font-size: 18px;
	font-weight: normal;
	color: #FFFFFF;
	text-decoration: none;
	background: #920F14;
	display: block;
	padding: 4px;
	margin-bottom: 1px;
}
.allshops .area a:hover {
background:#c2b59b;
color:#920F14
}
.shop {
	border-bottom: 1px solid #A58E6C;
	padding-bottom: 5px;
	/*height: 170px;*/
	width:100%;
	overflow:hidden;
	padding-top: 5px;
}
.shop img {
	float: right;
	height: 160px;
	width: 239px;
	margin-left: 10px;
	padding-top: 5px;
	
}
.shop h3 {
	font-size: 20px;
	margin: 5px 0px 2px;
	padding: 0px;
	color: #920F14;
}
.allshops .area .shop a.shopsite {font-size:14px; font-weight:normal; color:#fff; text-decoration:underline;display: inline;background:none; margin:0; padding:0; line-height:20px; outline:none;}
.allshops .area .shop a.shopsite:hover {color:#603912; text-decoration:underline;}
.shop .details {
	font-size: 12px;
}
#woc .wrapper .container #mainContent h3 {
	color: #860309;
	margin: 20px 0px 2px;
	padding: 0px;
}
.aboutcoffee {
	list-style: decimal inside;
	margin: 0px;
	padding: 0px;
}
#woc table td{
	border:1px solid #805225;
	border-collapse:collapse;
	padding:3px;
}
#woc  h2 {
	margin: 0 0 7px 0;
	padding: 0px;
}
#woc  h4 {
	font-size: 14px;
	display: inline;
	padding-left: 2px;
	
}
a:link {color:#fff; text-decoration:underline}
a:visited {color:#BDAA92; text-decoration:underline}
a:hover {color:#860309; text-decoration:underline}
a:active {color::#860309; text-decoration:underline}

.linklist {
	margin: 0;
	padding: 0px;
	list-style: none;
}

/*//////////////   ADMIN INTERFACE   ///////////////*/

.adminnav a:link {color:#fff; text-decoration:underline}
.adminnav a:visited {color:#fff; text-decoration:underline}
.adminnav a:hover {color:#860309; text-decoration:underline}
.adminnav a:active {color::#860309; text-decoration:underline}


.adminnav {
	margin: 0px;
	padding: 0px;
	list-style: none;
	height: 30px;
}
.adminnav li {
	float: right;
	padding: 3px;
	margin-left: 10px;
}
.adminnav .selected {
	background: #890409;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 3px;
}
.admintitle {
	border-top: 1px solid #603912;
	border-bottom: 1px solid #603912;
	padding-top: 1px;
	padding-right: 3px;
	padding-bottom: 3px;
	margin-bottom: 15px;
	color: #FFFFFF;
}
.admintitleGreen {
	border-top: 1px solid #603912;
	border-bottom: 1px solid #603912;
	padding-top: 1px;
	padding-right: 3px;
	padding-bottom: 3px;
	margin-bottom: 15px;
	color: #5ADE2E;
}
.admintitleRed {
	border-top: 1px solid #603912;
	border-bottom: 1px solid #603912;
	padding-top: 1px;
	padding-right: 3px;
	padding-bottom: 3px;
	margin-bottom: 15px;
	color: #880408;
}