/*
Title:		Bella Bagno website
Author:		Daniel Kinsella
written:	05 07 2008 by Celtic Marketing, Inc.
*/

/* universal tags
----------------------------------------- */

body {
	margin: 0px;
	border: 0px;
	font: 11px/18px Arial;
	color: #404040;
	background: #615f5f;
	}

h1 {
	font: 20px/22px Trebuchet MS;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px;
	color: #690496;
	position: relative;
	}
	
h2 {
	font: 14px/18px Arial;
	font-weight: bold;
	margin: 10px 0px 0px 0px;
	padding: 0px;
	border: 0px;
	color: #690496;
	}
	
h3 {
	font: 11px/24px Arial;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
h4 {
	font: 11px/24px Arial;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px;
	color: #690496;
	}
	
h5 {
	font: 14px/18px Arial;
	font-weight: bold;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	border: 0px;
	color: #690496;
	position: relative;
	width: 302px;
	}
	
h6 {
	font: 11px/18px Arial;
	color: #404040;
	font-weight: normal;
	float: left;
	position: relative;
	}
	
h7 {
	font: 20px/22px Trebuchet MS;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px 0px 10px 0px;
	color: #690496;
	}
	
b {
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
sup {
	vertical-align: top;
	line-height: normal;
	}
	
ul {
	display: block;
	list-style-type: square;
	padding: 0px;
	margin: 0px 14px 10px 14px;
	border: 0px;
}

li {
	margin: 0px;
	padding: 0px;
	list-style-type: square;
	border: 0px;
	}
	
/* matot colors and class + id tags
----------------------------------------- */

#bella-purple {
	background-color: #690496;
	}

.bella-purple {
	color: #690496;
	text-align: left;
	}
	
#bella-red {
	background-color: #ed181c;
	}

.bella-red {
	color: #ed181c;
	}
	
#bella-lightpurple {
	background-color: #cea1e5;
	}
	
.bella-lightpurple {
	color: #cea1e5;
	}

/* class tags
----------------------------------------- */

.textalign-right {
	text-align: right;
	}

.outer-container {
	vertical-align: top;
	position: relative;
	width: 777px;
	margin: 0px auto;
	padding: 0px;
	background: #ffffff;
	border: 0px;
	}
	
.main-container {
	vertical-align: top;
	position: absolute;
	width: 777px;
	margin: 0px;
	padding: 7px;
	background: #ffffff;
	border: 0px;
	}
	
.banner {
	vertical-align: top;
	position: relative;
	width: 777px;
	height: 129px;
	margin: 0px;
	padding: 0px;
	background-image:url(../images/Banner_BK.gif);
	background-repeat: repeat-x;
	border: 0px;
	}
	
.body-container {
	vertical-align: top;
	position: relative;
	width: 777px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.products-container {
	vertical-align: top;
	position: relative;
	width: 777px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.copyright-container {
	vertical-align: top;
	position: relative;
	width: 777px;
	padding: 0px;
	padding: 0px;
	border: 0px;
	}

.logo-container {
	vertical-align: top;
	position: relative;
	width: 304px;
	float: left;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.img-container {
	vertical-align: top;
	position: relative;
	float: left;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.right-copy {
	vertical-align: top;
	position: relative;
	margin: 0px;
	padding: 15px 20px 25px 20px;
	border: 0px;
	}
	
.pdf-rectangle {
	vertical-align: top;
	position: relative;
	width: 247px;
	float: left;
	text-align: right;
	float: right;
	margin: 0px;
	padding: 10px 20px 10px 20px;
	background: #f0e5f5;
	border: 0px;
	}

.body-copy {
	vertical-align: top;
	position: relative;
	width: 400px;
	float: left;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.list-container {
	vertical-align: top;
	position: relative;
	width: 402px;
	float: left;
	margin: 0px 0px 15px 0px;
	padding: 0px;
	border: 0px;
	}
	
.field-container {
	vertical-align: top;
	position: relative;
	float: left;
	margin: 20px 0px 0px 0px;
	padding: 15px 15px 15px 0px;
	border: 0px;
	background: #f3f3f3;
	}
	
.top-info {
	vertical-align: top;
	position: relative;
	width: 387px;
	float: right;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.subheading {
	font: 14px/18px Arial;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.product-copy {
	vertical-align: top;
	position: relative;
	float: left;
	width: 565px;
	margin: 0px;
	padding: 10px 0px 0px 10px;
	border: 0px;
	}
	
.description-copy {
	vertical-align: top;
	position: relative;
	float: left;
	width: 118px;
	height: 235px;
	margin: 5px 5px 0px 0px;
	padding: 10px;
	border: 0px;
	background: #f0e5f5;
	}

.logo {
	vertical-align: top;
	position: relative;
	float: left;
	width: 304px;
	margin: 0px;
	padding: 0px;
	border: none;
	}
	
.sub-navigation {
	vertical-align: top;
	position: relative;
	float: left;
	width: 289px;
	height: 20px;
	margin: 0px;
	padding: 0px 0px 0px 15px;
	border: none;
	}
	
.icon {
	vertical-align: top;
	position: relative;
	float: left;
	width: 75px;
	height: 45px;
	margin: 0px;
	padding: 0px;
	border: none;
	}
	
.bttns {
	vertical-align: top;
	position: relative;
	float: right;
	width: 85px;
	height: 42px;
	margin: 0px;
	padding: 15px 0px 0px 0px;
	border: 0px;
	}
	
.product-img {
	vertical-align: top;
	position: relative;
	float: left;
	width: 116px;
	height: 132px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.product-thmb {
	vertical-align: top;
	position: relative;
	float: right;
	width: 116px;
	height: 132px;
	margin: 0px 0px 10px 10px;
	padding: 0px;
	border: 0px;
	}
	
.scented-thmb {
	vertical-align: top;
	position: relative;
	width: 116px;
	height: 132px;
	margin: 0px 0px 5px 0px;
	padding: 0px;
	border: 1px solid #690496;
	}

.demo-thmb {
	vertical-align: top;
	width: 176px;
	height: 138px;
	margin: 10px 0px 10px 10px;
	padding: 0px;
	border: 1px solid #690496;
	}
	
#demo {
	vertical-align: top;
	width: 640px;
	height: 480px;
	margin: 10px 0px 10px 0px;
	padding: 0px;
	border: 0px;
	text-align: center;
	}

.product-img2 {
	vertical-align: top;
	position: relative;
	float: right;
	margin: 0px 0px 10px 10px;
	padding: 0px;
	border: 0px;
	}

.product-diagram {
	vertical-align: top;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	border: 0px;
	text-align: center;
	}

.pdficon {
	vertical-align: top;
	position: relative;
	float: right;
	width: 15px;
	height: 16px;
	margin: 0px 0px 0px 5px;
	padding: 0px;
	border: 0px;
	}
	
.market-container {
	vertical-align: top;
	position: relative;
	float: left;
	width: 74px;
	height: 94px;
	margin: 0px 5px 25px 0px;
	padding: 5px;
	border: 0px;
	background-color: #690496;
	}
	
.small-container {
	vertical-align: top;
	position: relative;
	text-align: center;
	float: left;
	width: 66px;
	height: 14px;
	margin: 0px 5px 0px 0px;
	padding: 3px;
	border: 0px;
	background-color: #5e038b;
	}
	
.field {
	vertical-align: top;
	position: relative;
	color: #909090;
	float: right;
	width: 193px;
	height: 18px;
	margin: 0px;
	padding: 0px;
	border: 1px solid #909090;
	display: inline;
	}
	
.fieldsm {
	vertical-align: top;
	position: relative;
	color: #909090;
	float: right;
	width: 30px;
	height: 18px;
	margin: 0px;
	padding: 0px;
	border: 1px solid #909090;
	display: inline;
	}
	
.montage-container {
	vertical-align: top;
	position: relative;
	float: left;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	border: 0px;
	}
	
.link-container {
	vertical-align: top;
	position: relative;
	float: left;
	margin: 0px;
	padding: 5px 0px 0px 0px;
	border: 0px;
	font: 12px/15px Arial;
	font-weight: normal;
	color: #fff;
	}
	
.right-column {
	vertical-align: top;
	float: right;
	position: relative;
	width: 270px;
	margin: 0px;
	padding: 15px 0px 15px 15px;
	border: 0px;
	}

/* special navigation id tags
----------------------------------------- */

#quicknav {
	vertical-align: top;
	position: relative;
	float: right;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}

#quicknav a {
	background: #690496;
	display: block;
	height: 94px;
	width: 75px;
	color: #FFFFFF;
	text-decoration: none;
	background-position: top;
	float: left;
	margin: 0px 5px 25px 0px;
	padding: 5px;
	border: 0px;
	}

#quicknav a:hover {
	background-image: url(../images/BttnBK.gif);
	background-repeat: repeat-x;
	cursor: pointer;
	}

#products {
	vertical-align: top;
	float: left;
	position: relative;
	width: 747px;
	margin: 0px;
	padding: 0px 15px 15px 15px;
	border: 0px;
	}

#products a {
	vertical-align: top;
	position: relative;
	width: 692px;
	float: left;
	margin: 5px 0px 5px 0px;
	padding: 5px 50px 5px 5px;
	background-color: #f8f3fa;
	font: 11px/18px Arial;
	color: #690496;
	text-decoration: none;
	border: none;
	}

#products a:hover {
	background-color: #f9f9f9;
	font: 11px/18px Arial;
	color: #404040;
	cursor: pointer;
	}
	
/* regular id tags
----------------------------------------- */

#montage {
	vertical-align: top;
	position: relative;
	float: left;
	width: 400px;
	height: 325px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#hygolet {
	vertical-align: top;
	position: relative;
	width: 247px;
	height: 178px;
	margin: 0px;
	padding: 0px;
	border: none;
	}
	
#icon-BG {
	vertical-align: top;
	position: relative;
	float: left;
	width: 227px;
	height: 113px;
	margin: 0px;
	padding: 15px;
	border: 0px;
	}

#logo {
	vertical-align: top;
	position: relative;
	float: left;
	width: 304px;
	height: 109px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#copyright {
	vertical-align: top;
	float: left;
	width: 747px;
	font: 10px/14px Arial;
	color: #fff;
	padding: 15px;
	margin: 0px;
	background: #690496;
	border: 0px;
	}
	
#left-column {
	vertical-align: top;
	float: left;
	position: relative;
	width: 400px;
	margin: 0px;
	padding: 15px;
	border: 0px;
	}
	
#right-column {
	vertical-align: top;
	float: right;
	position: relative;
	width: 287px;
	margin: 0px;
	padding: 15px 0px 15px 15px;
	border: 0px;
	}
	
#right-text {
	vertical-align: top;
	float: left;
	position: relative;
	width: 287px;
	}

#right-column a {
	vertical-align: top;
	position: relative;
	text-decoration: none;
	width: 287px;
	float: left;
	margin: 0px;
	padding: 0px;
	background-color: #fff;
	font: 12px/18px Arial;
	color: #690496;
	border: none;
	}

#right-column a:hover {
	background-color: #f9f9f9;
	color: #404040;
	cursor: pointer;
	}

	
#right-diagram {
	vertical-align: top;
	float: right;
	position: relative;
	width: 302px;
	margin: 0px;
	padding: 15px 0px 15px 0px;
	border: 0px;
	}
	
#right-diagram-2 {
	vertical-align: top;
	float: right;
	position: relative;
	width: 302px;
	margin: 0px;
	padding: 15px 0px 15px 0px;
	border: 0px;
	}
	
#list-left {
	vertical-align: top;
	float: left;
	position: relative;
	width: 191px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#list-right {
	vertical-align: top;
	float: left;
	position: relative;
	width: 196px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#field-left {
	vertical-align: top;
	float: left;
	position: relative;
	width: 387px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#list-leftw {
	vertical-align: top;
	float: left;
	position: relative;
	width: 300px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#list-rightsm {
	vertical-align: top;
	float: right;
	position: relative;
	width: 30px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
#spacer-column {
	vertical-align: top;
	float: left;
	position: relative;
	margin: 0px;
	padding: 15px 10px 15px 30px;
	border: 0px;
	}
	
#spacer {
	vertical-align: top;
	position: relative;
	float: left;
	width: inherit;
	height: inherit;
	margin: 0px;
	padding: 0px;
	border: none;
	background-image:url(../images/dots.gif);
	background-repeat: repeat-y;	
	}

#left-nav {
	vertical-align: top;
	position: relative;
	color: #fff;
	float: left;
	margin: 0px;
	padding: 0px 0px 0px 5px;
	border: 0px;
	}

/* navigation
----------------------------------------- */

a:link, a:visited { 
	text-decoration: underline;
	color: #690496;
	border: none;
	}
	
a:hover, a:active { 
	text-decoration: underline;
	color: #404040;
	border: none;
	}
	
a.rightstuff:link {
	text-decoration: underline !important;
	color: #690496 !important;
	display: block !important;
	position: relative !important;
	}

a.rightstuff:hover {
	background-color: #f9f9f9 !important;
	color: #404040 !important;
	}

a.pdf-navigation:link, a.pdf-navigation:visited {
	font: 11px/22px Arial;
	color: #404040;
	padding: 0px;
	margin: 0px;
	border: none;
	text-decoration: underline;
	}
	
a.pdf-navigation:hover, a.pdf-navigation:active {
	color: #690496;
	}

a.side-navigation:link, a.side-navigation:visited {
	font: 13px/28px Arial;
	font-weight: bold;
	color: #690496;
	padding: 0px;
	margin: 0px;
	border: none;
	text-decoration: underline;
	}
	
a.side-navigation:hover, a.side-navigation:active {
	color: #404040;
	}
	
a.small-navigation:link, a.small-navigation:visited {
	font: 10px/14px Arial;
	font-weight: normal;
	text-align: center;
	color: #fff;
	padding: 0px;
	margin: 0px;
	border: 0px;
	text-decoration: none;
	}
	
a.small-navigation:hover, a.small-navigation:active {
	color: #cea1e5;
	}

a.policy:link, a.policy:visited {	
	font: 10px/14px Arial;
	color: #fff;
	font-weight: normal;
	text-decoration: underline;
	padding: 0px;
	border: 0px;
	}

a.policy:hover, a.policy:active {
	color: #cea1e5;
	}

a.image-nav:link, a.image-nav:visited {	
	font: 12px/25px Arial;
	font-weight: bold;
	text-decoration: none;
	color: #ffffff;
	padding: 0px 0px 0px 5px;
	margin: 0px;
	border: 0px;
	}

a.image-nav:hover, a.image-nav:active {
	color: #e0e0e0;
	}

a.image-buttons:link, a.image-buttons:visited,
a.image-buttons:hover, a.image-buttons:active {
	text-decoration: none;
	border: 0px;
	}
	
a.logo-link:link, a.logo-link:visited, 
a.logo-link:hover, a.logo-link:active {
	text-decoration: none;
	border: 0px;
	}

#thumbBox{ /*Outermost DIV for thumbnail viewer*/
position: absolute;
left: 0;
top: 0;
width: auto;
padding: 10px;
padding-bottom: 0;
background: #313131;
visibility: hidden;
z-index: 500;
cursor: hand;
cursor: pointer;
}

#thumbBox .footerbar{ /*Footer DIV of thumbbox that contains "close" link */
font: bold 16px Tahoma;
letter-spacing: 5px;
line-height: 1.1em;
color: white;
padding: 5px 0;
text-align: right;
}


#thumbBox #thumbImage{ /*DIV within thumbbox that holds the enlarged image */
background-color: white;
}

#thumbLoading{ /*DIV for showing "loading" status while thumbbox is being generated*/
position: absolute;
visibility: hidden;
border: 1px solid black;
background-color: #EFEFEF;
padding: 5px;
z-index: 500;
}