/* -------------------------------------------------------------- 
   
   Custom.css
   * ALL custom styles not covered in other sheets
   
   1) HTML Tags
   2) Layout
   3) Images
   4) Spacing
   5) Typography
   6) Links
   7) Lists
   8) News
  
-------------------------------------------------------------- */


/* 2) Layout */

/* png start */
* html img,

/* png end */

.share	{ background: url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/share.jpg); background-repeat:no-repeat; width:546px; height:284px; padding-top:50px; }

.arialGreen	{ font-family: Arial, Helvetica, sans-serif; font-size:11px; color:#545A17; font-weight: normal; }
.container{border:5px solid #ffffff ; width: 990px; margin: 0 auto; background-color:#100e16;}
.header {width: 100%; }
.header-content {
	width: 990px;
	height: 136px;
	margin: 0 auto;
}
.login{background: url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/login-form.gif) left top no-repeat; width:433px; height: 41px; font-family: Arial Narrow; color:#6D791E; font-weight: bold; font-size: 13px;}

.flash { width: 100%; background: url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/flash-bg.jpg) repeat-x; height: 228px; }
.flash-content {
    width: 1024px;
    margin: 0 auto;
}
.content {width:894px; margin: 0 auto;}
.contentsmooth {width:890px; margin: 0 auto; min-height: 500px; }
contentsmooth p {width:590px; margin: 0 auto; min-height: 600px; }
.blockQuote {
    background:url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/block-quote.gif) top left no-repeat;
    padding-left:35px;
    text-align:justify;
}

.footer {background: url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/footer.jpg) center #0d101f; width: 100%; height: 125px;
float:left;
clear:both;

}
.footer-content { width: 894px; color: #E2E6C7; margin: 0 auto; font-size: 11px;}

.did-you-know {margin-bottom:-100px; position:relative; top:-40px; padding:0; width: 303px;}
.submit-button { background-color:#545A17; border:0px; color: #FFFFFF; font-size: 11px; padding: 4px; font-weight: bold;}

.submit-button2 { background-color:#545A17; border:0px; color: #C6D537; font-size: 11px; padding: 4px; font-weight: bold;}

.bullets ul { 
	list-style-type:none;
	padding-left:0; 
    margin-left: 0;
}

.bullets li {
	list-style-image:none;
	list-style-type:0;
	background-image:url(http://johnbeavan.com/templates/jbeavan/assets/front/layout/bullet.gif);
	background-repeat:no-repeat;
	padding-left:20px;
	font: 12px/20px Arial, Helvetica, sans-serif;
	color: #707070;
	line-height:26px;
}

.border-right {border-right: 1px solid #E1E0DE; padding-right: 35px;}
.border-right2 {border-right: 1px solid #E1E0DE; padding-right: 5px;}
.border-right3 {border-right: 1px solid #E2E6C7; padding-right: 8px;}
.border-left {border-left: 1px solid #E1E0DE; padding-left: 30px;}

.currency-converter {
    background-image: url(http://johnbeavan.com/templates/jbeavan/assets/order-information/currency-converter.gif);
    width: 203px;
    padding-left: 21px;
    padding-right: 20px;
    padding-top: 10px;
}
#subcontent dl {border: none!important;}
.whatsnew {border: none!important;}

/* 3) Images */
.wrap-right { float: right; clear: left; margin-left: 10px;}
.wrap-left { float: left; clear: right; margin-right: 10px;}
.wrap-left2 { float: left; clear: right; margin-right: 30px;}

/* 4) Spacing */
.padding-top5 {padding-top: 5px;}
.margin-top8 {margin-top: 8px;}
.margin-top10 {margin-top: 10px;}
.margin-top25 {margin-top: 25px;}
.margin-top50 {margin-top: 45px;}
.padding-top1 {padding-top: 1px;}

/* 5) Typography */
.arial-10 {font-size:10px;}
.arial-11 {font-size:11px;}
.grey {color: #707070;}
.right-align {text-align: right;}
.green-numbers {color: #AFBC31; font-size: 16px; font-weight: bold;}
.dark-green {color: #545A17;}

/* 6) Links */
a:link.headerlink { font-family: Arial Narrow; font-size:13px; color: #ffffff; text-decoration:none; font-weight: bold;}
a:visited.headerlink { font-family: Arial Narrow; font-size:13px; color: #ffffff; text-decoration:none; font-weight: bold;}
a:hover.headerlink { font-family: Arial Narrow; font-size:13px; color: #ffffff; text-decoration:none; font-weight: bold;}
a:active.headerlink { font-family: Arial Narrow; font-size:13px; color: #ffffff; text-decoration:none; font-weight: bold;}

a:link.footerlink { font-size:11px; color: #E2E6C7; text-decoration:none;}
a:visited.footerlink { font-size:11px; color: #E2E6C7; text-decoration:none;}
a:hover.footerlink { font-size:11px; color: #545A17; text-decoration:none;}
a:active.footerlink { font-size:11px; color: #E2E6C7; text-decoration:none;}

a:link.login-link { font-size:11px; color: #C6D537; text-decoration:none;}
a:visited.login-link { font-size:11px; color: #C6D537; text-decoration:none;}
a:hover.login-link { font-size:11px; color: #545A17; text-decoration:none;}
a:active.login-link { font-size:11px; color: #C6D537; text-decoration:none;}

a:link.shopping-link { color: #545A17; text-decoration:none;}
a:visited.shopping-link { color: #545A17; text-decoration:none;}
a:hover.shopping-link { color: #79812D; text-decoration:none;}
a:active.shopping-link { color: #545A17; text-decoration:none;}

a:link.opaque {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;display: block;}
a:visited.opaque {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;display: block;}
a:hover.opaque {filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;display: block;}
a:active.opaque {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;display: block;}

pad-bot {border-bottom: 1px solid #DDDDDD;}

/* Header menu */	 
#header_menu {position: absolute; margin-left: 2px;}
#header_menu li {line-height: normal;}
ul#header_menu  {z-index: 10; clear: both;}

#nav {
	height: 2em;
	background: # ;
	border-top: 1px solid #d1d2de;
	border-bottom: 1px solid #d1d2de;
	padding:0;float: middle;
}
#nav ul {
	list-style-type: none; 
	margin: 0; 
	padding: 0; 
	font-size: 95%; 
	text-transform: none;
	width: auto;
	/*
	(Disappearing List-Background)
	http://www.positioniseverything.net/explorer/ie-listbug.html
	*/
	position: relative; /* Fix the Stupid IE6 Bug */
}
#nav ul li {float: left; color: #fff; text-align: center; font-weight: normal;}
#nav ul li a {display: block;   padding: 5px 10px; padding-bottom: 4px; border-left: 0px solid #000; border-right: 1px solid #c8c9e3; color: #fff; text-decoration: none;}

/* Root Level Link Formatting */
#nav ul li a:hover, #nav li a:focus {background: #4b4c4d; border-color: #fff; color: #fff;}
#nav li a:active, #nav ul li a.active {background: #c8c9e3; border-color: #fff; color: #4b4c4d;}

/* Current page Customisations*/
#nav li.menu-current a		{background: #c8c9e3; color: #000; border-bottom: 1px solid #000;}
#nav li.menu-current a		{font-weight: normal;} 

/* 2nd Child menu */
#nav .menu li ul {position: absolute; width: 12em; margin: 0; display: none; text-transform: none; border: 0px solid #000; border-top: 0; font-size: 100%;}
#nav .menu li ul li {width: 12em; text-align: left; font-weight: normal; margin: 0; padding: 0; line-height: 1.2em;}
#nav .menu li ul a {width: 11.5em; padding: .6em .1em .6em .4em; background: #d1d2de; color: #000; border: 1px solid #000;}

/* 2nd Child link hover */
#nav .menu li ul a:hover {background: #c8c9e3; border: 1; color:#000;}

/* Show and hide */
#nav .menu li:hover ul, #nav .menu li a:focus ul, #nav .menu li.subMenu ul {display: block;}
#nav .menu li ul ul { display: none;}
#nav .menu li:hover ul ul, #nav .menu li.subMenu ul ul {display: none;}
#nav .menu li:hover ul, #nav .menu li li:hover ul, #nav .menu li.subMenu ul, #nav .menu li li.subMenu ul {display: block;}


/* 3rd Child Menu Appreances */
#nav .menu li ul li ul li a 	{ width: 11.5em; padding: .6em .1em .6em .4em; background: #c8c9e3; color: #000; }

/* Positioning the Pop-out Drops */
#nav li {position: relative;}

#nav ul ul ul {
	position: absolute;
	top: 1px;
	left: 100%;
}




/* end menu */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

.break{
clear:both;
float:left;
width:600px
}
.eblock{
width:400px;
}
.etitle{
width:100px;
}