/* 

screen CSS document
screen.css
client: Bead Paradise
author: Atlantic BT - www.atlanticbt.com
date: 10-12-07

*/


/*======================================
	=Main Styles
======================================*/

/* for 100% height on wrap */
html, body { height: 100%; }

body {
	font-family: Arial, Helvetica, sans-serif; 								
	color: #502b0a;
	text-align: center;	  /* <-- center design in browser for IE */
	background: #e2c17c url(/templates/beadparadise.vtemplate/images/bg_container.jpg) repeat-x center top;
	font-size: x-small;  /* for IE5/Win */
  	font-s\ize: small;   /* for real browsers */
}

div { font-size: 100%; text-align: left; }


/*======================================
	=Typography Styles
======================================*/

/* font rule shortcut: */
/* font: font-style font-variant font-weight font-size/line-height font-family; */


p { }
	#content * { line-height: 1.2em; }
	#content p { margin: 1em 0; }
	#content div { margin: 1em 0; } /* added here since it deals with content */

a { }
	/* base anchor colors/style */
	a:link, a:visited { color: #b8471a; }
	a:hover, a:active, a:focus { color: #4b9582; }
	/* $a:focus dotted outline fix found in moz.css and abt.js (search for "theahrefs") */	
	
	p.top-link { text-align: right; }
	a.top-link, p.top-link a
	{ padding-right: 10px; background: url(/templates/beadparadise.vtemplate/images/icons/i_up-arrow.gif) no-repeat right center; }
	
	
	a.back-link, p.back-link a
	{ padding-left: 10px; background: url(/templates/beadparadise.vtemplate/images/icons/i_l-arrow.gif) no-repeat left center; }



h1, h2, h3, h4, h5, h6 { margin: 1em 0; font: bold 180% Georgia, "Times New Roman", Times, serif; color: #672e11; }
	
	h1 { margin: 0 0 .5em; /*width: 380px;*/ }
		h1 acronym { border: 0; }
	h2 { font-size: 150%; color: #a22616; }
	h3, h4, h5, h6 { font-size: 120%; }
	h4 {  }
	
/*======================================
	=MODAL STYLES
======================================*/

#content.modal_content {
	background:none;
	display:inline;
	float:right;
	height:auto !important;
	min-height:329px;
	padding:18px;

}

#modalEditor.jqmWindow {
background:#DCBA70 url(/templates/beadparadise.vtemplate/images/bg_windoid.jpg) repeat-y scroll center bottom;
}

.jqmwindow {

}

.modalToolBar {
display:none;

}

input.closeModal {
background:#672E11;
border-color:none;
border-style:none;
border-width:none;
padding:2px;
margin-top: 35px;
float: right;
color:#fff;
}





	
/*======================================
	=Other Element Styles
======================================*/

ul, ul li { list-style: none; }

	#main-area ul { margin: 1em 0 1em 1em; }
	#main-area ul li {
		margin: .5em 0;
		padding-left: 20px;
		background: url(/templates/beadparadise.vtemplate/images/icons/i_bullet.gif) no-repeat 0 .1em;
	}

	
ol, ol li { }

	#main-area ol { margin: 1em 0 1em 2em; } /* 40px left margin seems to make the ol line up with the ul */
	#main-area ol li {
		margin: .5em 0;
	}
	
	
	
dl { }

	#content dl { margin: 1em 0; }
	
		#content dl dt { margin: .5em 0; font-weight: bold; }
		#content dl dd { margin: .5em 0 .5em 1em; }


acronym { cursor: help;	border-bottom: 1px dotted #353535; }

address { }

blockquote { margin: 1em 0; padding: 0 1em; border-left: 9px solid #e7e7e7; }
	blockquote p { margin: 1em 0; }
	blockquote p.cite { text-align: right; }
	blockquote p.cite cite { font-weight: bold; }
	blockquote p.cite em { display: block; font-style: normal; font-weight: normal; }
	
	body#design-ideas p.cite { margin-right: 2em; text-align: right; }
	
	
	
/*======================================
	=Form Styles
======================================*/
	
	input, textarea, select {
		padding: 2px;
		background: #dce4e9;
		border: 1px solid #502b0a; border-right-color: #efefef; border-bottom-color: #efefef;
	}
	
	#site-search input { border: 3px double #502b0a; background: #fff; }
	
	#inforizons_search_button {margin-bottom:0px; width:28px; height:23px; background:url(/templates/beadparadise.vtemplate/images/b_go.gif) no-repeat; text-indent:-1000em; border-width:0px;
	
	}
	
	select { font-size: 85%; }
	
	input.radio, input.checkbox,
	.radio input, .check input,
	input#b-go { border: 0; padding: 0; width: auto; background: none; }
	
	input.add_to_cart_button {
	background: transparent url(/templates/beadparadise.vtemplate/images/b_add-to-cart.gif) no-repeat scroll 0 0;
	text-indent: -1000em;
	width: 105px;
	height: 30px;
	}
	input.add_to_cart_button_components {
	background: transparent url(/templates/beadparadise.vtemplate/images/b_buy_all.gif) no-repeat scroll 0 0;
	text-indent: -1000em;
	width: 105px;
	height: 30px;
	}
	

	
	form.option_form{
	color: #000;
	}
	



/*======================================
	=Layout Styles
======================================*/

#container { 
	float: left; display: inline;
	width: 100%;
	background: url(/templates/beadparadise.vtemplate/images/bg_body.jpg) repeat-x center bottom;
	min-height: 950px; height: auto !important; height: 950px;
}

#wrap { margin: 0 auto; width: 766px; }

/* =floats and widths */
#masthead, #navbar, #main-area, #site-info { float: left; display: inline; width: 766px; }


#masthead { position: relative; margin-left: 6px; width: 740px; height: 196px;
			background: url(/templates/beadparadise.vtemplate/images/bg_masthead.png) no-repeat 0 0; }

	/* hide accessibility, but leave there for readers */
	#masthead #jump-2-conclusions { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }
	
	#masthead #logo,
	#masthead #logo a { 
		float: left; display: inline;
		width: 185px;
		height: 185px;
	}
		#masthead #logo { position: absolute; left: 3px; top: 9px; }
		#masthead #logo a { text-indent: -9000em; }


#navbar { position: absolute; left: 195px; top: 69px; }
	#navbar h5 { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }


#main-area { position: relative; margin-top: -3px; background: url(/templates/beadparadise.vtemplate/images/bg_main-area.jpg) no-repeat 0 0; }
	
	#main-area #ie-wrap { margin: 0; width: 479px; }
	#content {
		float: right; display: inline;
		padding:  55px 50px 105px 22px;
		width: 479px; /* 551px */
		background: url(/templates/beadparadise.vtemplate/images/bg_beads.png) no-repeat right bottom;
		min-height: 329px; height: auto !important; height: 429px;
	}

		
		
	#secondary-content {
		float: left; display: inline;
		margin-left: 15px;
		padding-top: 102px;
		width: 171px;
	}
	
		#gift-certificates {
			position: absolute;
			right: 8px; top: -20px;
			float: left; display: inline;
			width: 150px; height: 78px;
			background: url(/templates/beadparadise.vtemplate/images/b_gift-certs.png) no-repeat 0 0;
		}
			#gift-certificates p, #gift-certificates a { margin: 0; float: left; display: inline;
															width: 150px; height: 78px; text-indent: -9000em; }
			#gift-certificates h3 { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }
			#gift-certificates a:hover { background: url(/templates/beadparadise.vtemplate/images/b_gift-certs.png) no-repeat 0 -78px; }			
			
		#site-search { padding-left: 15px; }	
			#site-search h3,
			#site-search p { margin: 0; }
			#site-search h3 { font-size: 110%; }
			#site-search label { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }
				#site-search #b-go { margin-bottom: -7px; width: auto; }
				
				
			#inforizons_search_field { 
			width: 95px; 
			background:#FFFFFF none repeat scroll 0 0;
			border:3px double #502B0A;
			}
			

			
			
			
		
				
		#basket { margin: 2em 0; padding-left: 15px; font-size: 90%; }
			#basket p { padding: 4px 0 6px 32px; background: url(/templates/beadparadise.vtemplate/images/icons/i_basket.gif) no-repeat 0 0; line-height: 1em; }
			#basket p a { color: #502b0a; text-decoration: none; }
			#basket p a:hover { color: #b8471a; text-decoration: none; }
			
		
		#mailing-list, #mailing-list h3,
		#mailing-list h3 a { float: left; display: inline; margin: 0; width: 170px; height: 70px;
							text-indent: -9000em; }
		#mailing-list { margin-top: 4px; background: url(/templates/beadparadise.vtemplate/images/b_mailing-list.gif) no-repeat 0 0; }
		#mailing-list h3 a:hover { background: url(/templates/beadparadise.vtemplate/images/b_mailing-list.gif) no-repeat 0 -70px; }
		
		
		


#site-info { margin-top: 1em; font: normal 100%/1.2em Georgia, "Times New Roman", Times, serif; color: #502b0a; }
	#site-info p, #site-info ul, #site-info ul li { display: inline; }
	#site-info, #site-info div { text-align: center; }
	
	#site-info address { margin: .75em 0; }
	#site-info address .fn { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }
	#site-info acronym { border: 0; }
	#site-info .tel, #site-info .email { padding: 0; background: none; }
	
	#site-info a { color: #bf3e0b; text-decoration: none; }
	#site-info a.email { color: #bf3e0b; }
	#site-info a:hover { color: #502b0a; text-decoration: underline; }
	
	#site-info address p, #site-info address p.tel,
	#site-info li { padding-left: 8px; margin-left: 8px; border-left: 1px solid #502b0a; }
	#site-info address p.adr { padding: 0; margin: 0; border: 0; }
	#site-info p#photographs{ display: block; margin: .75em 0; }
	

	
/*======================================
	=Page Styles
======================================*/


/* homepage specific */

	#main-area ul.tags  {
	min-height:25px;
	
	}

	#main-area ul.tags li {
	background: none;
	display:block;
	float:left;
	margin: 0px;
	padding-left: 5px;
	}
	
	
	
	div#content div.hproduct-odd {
		float:left;
		width:220px;
		padding: 0 5px 0 5px;
		clear: left;	
	}
		div#content div.hproduct-even {
		float:left;
		width:220px;	
		padding: 0 5px 0 5px;
	}
	
	div#content div.product_component {
	float: left;
	}
		div#content div.product_component a {
		display:block;
		padding: 5px;
		}
		
	img.main_image {
		background:#4E4635;
		padding:3px;
	}
	
div#content img.main_image {
	}

div#content img.main_image.thumbnail {
	max-width:190px;
	}
div#content img.main_image.visual {
	max-width:190px;
	}
	
div#content p.pagination {
	clear:both;
	font-weight:bold;
	padding-top:25px;
	text-align:left;
	text-decoration:none;
	}
	
div#content div div.hproduct-odd .in_stock  {
	background:transparent url(/templates/beadparadise.vtemplate/images/icons/i_bullet.gif) no-repeat scroll 0 0.1em;
	margin:0.5em 0;
	padding-left:20px;	
	}
div#content div div.hproduct-even .in_stock {
	background:transparent url(/templates/beadparadise.vtemplate/images/icons/i_bullet.gif) no-repeat scroll 0 0.1em;
	margin:0.5em 0;
	padding-left:20px;
	}


/* Design Ideas Products */


	#product-lines, #featured-products { float: left; display: inline; }
	#product-lines h2,
	#featured-products h2 { position: absolute; left: -9000em; top: 0; height: 0; line-height: 0em; }
	
	#product-lines ul, #product-lines ul li,
	#featured-products ul, #featured-products ul li { float: left; display: inline;
														margin: 0; padding: 0; background: none; }
	#product-lines ul, #featured-products ul, #featured-products ul li { width: 479px; }
	
	#product-lines ul li { float: left; display: inline; margin-left: 20px; width: 101px;
							font: 85%/1.1em Georgia, "Times New Roman", Times, serif; text-align: center; 
							letter-spacing: -1px; }
		#product-lines ul li.first { margin: 0; }
		#product-lines ul li a { float: left; display: inline; }
		#product-lines ul li img { display: block; }
		
		#product-lines ul li img { margin: 0 auto 4px; }
		#product-lines ul li a { padding: 1px 1px 4px; background: #502b0a; color: #e5ddb0; text-decoration: none; }
		#product-lines ul li a:hover { background: #2c5e4c; }
		
	
	#content #featured-products { margin-top: 2em; }
	#featured-products ul li { margin: .5em 0; font-size: 85%; }	
		#featured-products a.product-thumb { float: left; display: inline; margin: 0 15px 0 0; border: 1px solid #502b0a; }
		#featured-products a.product-thumb:hover { border-color: #2c5e4c; }
		#featured-products h3 { margin: 0 0 .15em; font-size: 150%; }
		#featured-products p { margin-top: .15em; }
/* end homepage specific */


/* all inner pages specific */

	/* =shows */
	body#shows #content div.vevent abbr { border: 0; }
	/* end =shows */

	/* =classes */
	
	body#classes #content div.vevent { padding-top: 12px; border-top: 1px solid #91704D; }
	body#classes #content div.vevent p { margin-left: 10px; }
	body#classes #content div.vevent abbr { border: 0; }
	body#classes #content div.vevent h3.summary { text-transform: uppercase; color: #a22616; }
	body#classes #content div.vevent p.materials { font-style: oblique; }
	
	/* end =classes */

/* end inner pages specific */





/*======================================
	=Navigation Styles
======================================*/

/* =navigation */
	#navbar ul, #navbar ul li, #navbar ul li a {
		float: left; display: inline;
		width: 152px; height: 40px; /* n-home */
	}
	
	#navbar ul { position: relative; width: 507px; height: 74px; }
		#navbar ul li { position: absolute; left: 0; top: 0; /* n-home */ }
		
		#navbar ul li, #navbar ul li a { text-indent: -9000em; }
		#navbar ul li#n-faq, #navbar ul li#n-faq a { left: 182px; width: 127px; height: 36px; }
		#navbar ul li#n-shop, #navbar ul li#n-shop a { left: 376px; width: 114px; height: 36px; }
		#navbar ul li#n-ideas, #navbar ul li#n-ideas a { top: 40px; width: 152px; height: 33px; }
		#navbar ul li#n-ordering,
		#navbar ul li#n-ordering a { left: 162px; top: 35px; width: 211px; height: 39px; }
		#navbar ul li#n-about, 
		#navbar ul li#n-about a { left: 390px; top: 35px; width: 118px; height: 39px; }
		
		#navbar ul li a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat 0 -73px; }
		#navbar ul li#n-faq a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat -182px -73px; }
		#navbar ul li#n-shop a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat -376px -73px; }
		#navbar ul li#n-ideas a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat 0 -113px; }
		#navbar ul li#n-ordering a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat -162px -108px; }
		#navbar ul li#n-about a:hover { background: url(/templates/beadparadise.vtemplate/images/sp_nav.jpg) no-repeat -390px -108px; }						
						
/* end navigation */		

			
			
/* =shop-nav THIS IS THE NEW NAVIGATION */

div#shop-nav{
	border:3px solid #BB9E62; 
	background: #897256;
	float:left;
}

div#shop-nav ul, div#shop-nav ul li{
	margin:0;
	padding:0;
	list-style:none;
	display:block;
	float:left;
}
		
div#shop-nav ul.navigation li{
	width: 164px; 
	background: none;
	position:relative;
}

#shop-nav ul.navigation li a { 
	color:#ffffff; 
	font-size: 12px;
	font-weight: bold;
	font-family: "Times New Roman", serif;
	padding:10px 0px;
	text-transform: uppercase; 
	text-decoration: none;
	text-align: center;
	text-shadow:  #262626 2px 2px 2px;
	filter: Shadow(Color=#262626,Direction=135,Strength=2);	
	display:block;
	width:100%;
}

div#shop-nav ul.navigation li.odd{ background:#897256;  }
div#shop-nav ul.navigation li.even{ background:#654e32; }

div#shop-nav ul.navigation li.odd:hover { background:#578977;  }
div#shop-nav ul.navigation li.even:hover { background:#578977; }

/*Sub Navigation*/	

div#shop-nav ul.navigation li ul {display: none;}
div#shop-nav ul.navigation li:hover ul {
	display: block;
	position: absolute; 
	top: 0; 
	left: 164px; 
	margin: 0px; 
	z-index: 100;
	color: #fff; 
	background: none;
	font: 10px Verdana, sans-serif; 
	text-align: left;
}

div#shop-nav ul.navigation li ul li a { 
	padding:5px 0;
}


div#shop-nav ul.navigation li ul li.odd{ background:#897256;  }
div#shop-nav ul.navigation li ul li.even{ background:#654e32; }

div#shop-nav ul.navigation li ul li.odd:hover { background:#578977;  }
div#shop-nav ul.navigation li ul li.even:hover { background:#578977; }

 /*end shop-nav */


/*Visual Menu*/
#main-area ul.visual-menu, #main-area ul.visual-menu ul, #main-area ul.visual-menu li{
	margin:0;
	padding:0;
	list-style:none;
	background:none;
}

#main-area ul.visual-menu ul{
	display:block;
}

#main-area ul.visual-menu li{
	width: 230px;
	display:block;
	float:left;
	margin:0 0 0 0;
	text-align:center;
	min-height:200px;
}

#main-area img.visual-menu {
	max-width:175px;
	max-height:155px;
	display:block;
	margin:auto;
}

#main-area ul.visual-menu li li{
	display:inline;
	width:auto;
	float:none;
}

#main-area ul.visual-menu li a{
	float:left;
	clear:left;
	text-align:center;
	width:100%;
}

#main-area ul.visual-menu li li a{
	float:none;
	margin:none;
	width:auto;
	text-align:left;
}

/*======================================
	=Custom Styles and Microformats
======================================*/

.error { color: #c00; font-weight: bold; padding-left: 15px;
			background: url(/templates/beadparadise.vtemplate/images/icons/i_alert.gif) no-repeat 0 .3em; }
			
.note { font-size: 90%; font-style: italic; }

.tel { padding: 0 0 0 16px; list-style: none; background: url(/templates/beadparadise.vtemplate/images/icons/i_phone.gif) no-repeat 0 .4em; }
.email { padding: 0 0 0 16px; list-style: none; background: url(/templates/beadparadise.vtemplate/images/icons/i_email.gif) no-repeat 0 .4em; }
.fax { padding: 0 0 0 16px; list-style: none; background: url(/templates/beadparadise.vtemplate/images/icons/i_fax.gif) no-repeat 0 .4em; }
	

/*======================================
	=Programming Styles
======================================*/

/* EDITOR STYLES */
/* reflects editor.css */
.image-left { float: left; display: inline; margin: 0 10px 10px 0; }
.image-right { float: right; display: inline; margin: 0 0 10px 10px; }
.image-center { display: block; }
.image-mid-left { float: left; display: inline; margin: 10px 10px 10px 0; }
.image-mid-right { float: right; display: inline; margin: 10px 0 10px 10px; }
.note { font-size: 90%; font-style: italic; }
.font-8pt { font-size: 8pt; }
.font-10pt { font-size: 10pt; }
.font-12pt { font-size: 12pt; }
.font-14pt { font-size: 14pt; }

.font-family-arial { font-family: Arial, Helvetica, sans-serif; }
.font-family-times { font-family: "Times New Roman", Times, serif; }
.font-family-georgia { font-family: Georgia, "Times New Roman", Times, serif; }
.font-family-verdana { font-family: Verdana, Arial, Helvetica, sans-serif; }
.font-family-verdana { font-family: Tahoma, Arial, sans-serif; }

/* REMOVE FONT TAG SIZE CONTROL */
font { font-size: 100%; }
/* END EDITOR STYLES */

 

/* overriding for standard_templates/cool_button
because the orange doesn't look good on Bead Paradise background */
button.orange{
	background-color:rgb(246,128,28);
	background-color:rgba(246,128,28, .5);
	border:1px solid #F6801C;
}
button.cool.orange:active{
	background-color:rgba(246,128,28, 1);
}