/*

CSS created June 2009
Jamie McCue
Architexture.ca
info@architexture.ca

*/

/***** Reset Settings *****/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, ddress, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;}

ol, ul {
	list-style: none;}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;}

caption, th, td {
	text-align: left;
	font-weight: normal;}

blockquote:before, blockquote:after, q:before, q:after {
	content: "";}

blockquote, q {
	quotes: "" "";}

/***** Global Settings *****/
 
body {
	font:14px/1.25 helvetica, arial, sans-serif;
	color: #FFF;
	text-align: center;
	margin: 0 auto;}
	
/***** Colors *****/

.red { color: #aa2525;}
.blue { color: #1875a2;}
.orange { color: #d74900;}


/***** Structure *****/

#container {	
	text-align: left;
	padding: 0;
	margin: 0 auto 40px auto;}

#header {
	background-color: black;
	text-align: center;
	height: 40px;
	margin: 0 auto;}
	
#headerInside {
	background: transparent url('images/bg-inside.jpg') top center no-repeat;
	text-align: center;
	height: 329px;
	margin: 0 auto;
	padding: 0;}
	
#masthead {
	background: #000 url('images/bg-masthead.jpg') bottom center no-repeat;
	height: 544px;
	text-align: center;
	margin: 0 auto;}
	
.bgHome {
	background: #000 url('images/bg-home.png') top left repeat-x;}
	
.bgInside {
	background: #041d27 url('images/bg-inside-slim.png') top left repeat-x;}
	
#content {
	text-align: left;
	padding: 20px 0 15px 0;
	margin: 0;}
	
#rose img {
	width: 50%;
	height: 50%;}
	
/* body content */

#content ul {
	list-style-type: circle;}
	
ul.thumbs {
	margin: 0;
	padding: 0;
	list-style: none;}
	
ul.thumbs li {
	list-style: none;
	float: left;
	margin: 5px 5px 0 5px;}
	
ul#faq {
	list-style: none;
	margin: 0;
	padding: 0;
	background: transparent url('images/bg-sidebar.gif') bottom center no-repeat;}
	
ul#faq li {
	margin: 0;
	padding: 0;}
	
ul#faq a {
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
	padding: 0 15px 15px 15px;
	display: block;}
	
ul#faq a:hover {
	text-decoration: underline;}
	
/* footer */
	
#footer {
	background: transparent url('images/bg-footer.png') top center no-repeat;
	text-align: center;
	height: 140px;
	margin: 0 auto;
	padding: 15px 0;}
	
#footer ul {
	list-style: none;
	text-align: center;
	margin: 0 auto;
	padding: 5px 0 0 0;
	width: 700px;}
	
#footer ul li, address {
	display: inline;
	margin: 0;
	padding: 5px 12px;
	text-transform: uppercase;
	color: #afcad4;
	font-weight: bold;
	font-size: 11px;
	letter-spacing: 1px;}
	
#footer a {
	text-decoration: none;}
	
/* nav */

ul#nav {
	list-style: none;
	text-align: center;
	margin: 0 auto;
	padding: 14px 0 10px 0;
	background: transparent url('images/trans-black.png') repeat;}
	
ul#nav li {
	display: inline;
	margin: 0;
	padding: 3px 6px;}
	
ul#nav a {
	font-size: 0.9em;
	font-weight: bold;
	color: #afafaf;
	text-decoration: none;
	padding: 5px 8px;
	text-transform: uppercase;}
	
ul#nav a:hover {
	color: #fff;}
		
/* Subnav */

#subnav {
	background: transparent url('images/bg-lower-mid.png') top center no-repeat;
	margin: 0 0 16px 0;}
	
#subnavInside {
	background: transparent url('images/bg-content-top.png') bottom center no-repeat;
	margin: 0 0 16px 0;
	padding: 195px 0 20px 0;}

ul#nav2 {
	list-style: none;
	margin: 15px 0;
	padding: 0;}
	
ul#nav2 li {
	float: left;
	margin: 0;
	padding: 0 5px;}

a.bubblebag, a.bubblenow, a.bubblebox, a.beeline, a.spinpro, a.tumble, a.hemp {
	height: 50px;
	display: block;}
	
a.bubblebag { width: 130px; background: transparent url('images/n-bubblebag2.png') top center no-repeat;}
a:hover.bubblebag { width: 130px; background: transparent url('images/n-bubblebag2.png') bottom center no-repeat;}
a.bubblebagcur { width: 130px; background: transparent url('images/n-bubblebag2.png') bottom center no-repeat; height: 50px; display: block;}

a.bubblenow { width: 128px; background: transparent url('images/n-bubblenow2.png') top center no-repeat;}
a:hover.bubblenow { width: 128px; background: transparent url('images/n-bubblenow2.png') bottom center no-repeat;}
a.bubblenowcur { width: 128px; background: transparent url('images/n-bubblenow2.png') bottom center no-repeat; height: 50px; display: block;}

a.bubblebox { width: 119px; background: transparent url('images/n-bubblebox2.png') top center no-repeat;}
a:hover.bubblebox { width: 119px; background: transparent url('images/n-bubblebox2.png') bottom center no-repeat;}
a.bubbleboxcur { width: 119px; background: transparent url('images/n-bubblebox2.png') bottom center no-repeat; height: 50px; display: block;}

a.beeline 	{ width: 87px; background: transparent url('images/n-beeline2.png') top center no-repeat;}
a:hover.beeline { width: 87px; background: transparent url('images/n-beeline2.png') bottom center no-repeat;}
a.beelinecur { width: 87px; background: transparent url('images/n-beeline2.png') bottom center no-repeat; height: 50px; display: block;}

a.spinpro 	{ width: 89px; background: transparent url('images/n-spinpro2.png') top center no-repeat;}
a:hover.spinpro { width: 89px; background: transparent url('images/n-spinpro2.png') bottom center no-repeat;}
a.spinprocur { width: 89px; background: transparent url('images/n-spinpro2.png') bottom center no-repeat; height: 50px; display: block;}

a.tumble 	{ width: 129px; background: transparent url('images/n-tumble2.png') top center no-repeat;}
a:hover.tumble { width: 129px; background: transparent url('images/n-tumble2.png') bottom center no-repeat;}
a.tumblecur { width: 129px; background: transparent url('images/n-tumble2.png') bottom center no-repeat; height: 50px; display: block;}

a.hemp 		{ width: 161px; background: transparent url('images/n-hemp2.png') top center no-repeat;}
a:hover.hemp { width: 161px; background: transparent url('images/n-hemp2.png') bottom center no-repeat;}
a.hempcur { width: 161px; background: transparent url('images/n-hemp2.png') bottom center no-repeat; height: 50px; display: block;}

/* Slider */

#slider {
    width: 940px;
    margin: 0 auto;
    position: relative;}

.scroll {
    /*height: 520px;*/
    width: 940px;
    overflow: auto;
    overflow-x: hidden;
    position: relative;
    clear: left;}

.scrollContainer div.panel {
    padding: 0px 20px 0px 20px;
    /*height: 520px;*/
    width: 900px;}

.scrollButtons {
    position: absolute;
    top: 150px;
    cursor: pointer;}

.scrollButtons.left {
    left: -20px;}

.scrollButtons.right {
    right: -20px;}

.hide {
    display: none;}

/* Buttons */

ul.buttons, ul.buttons li {
	list-style: none;
	margin: 0;
	padding: 0;}
	
ul.buttons li {
	margin-bottom: 10px;}

a.buyonline 		{ width: 220px; height: 54px; display: block; background: transparent url('images/btn-buyonline.png') top center no-repeat;}
a.buyonline:hover 	{ background: transparent url(images/btn-buyonline-over.png) top center no-repeat;}

a.instructions 		{ width: 220px; height: 54px; display: block; background: transparent url('images/btn-instructions.png') top center no-repeat;}
a.instructions:hover 	{ background: transparent url('images/btn-instructions-over.png') top center no-repeat;}

a.findstore 		{ width: 220px; height: 54px; display: block; background: transparent url('images/btn-findstore.png') top center no-repeat;}
a.findstore:hover 	{ background: transparent url('images/btn-findstore-over.png') top center no-repeat;}

a.website	 		{ width: 220px; height: 56px; display: block; background: transparent url('images/btn-visitwebsite.png') top center no-repeat;}
a.website:hover 	{ background: transparent url('images/btn-visitwebsite-over.png') top center no-repeat;}

a.photos	 		{ width: 220px; height: 56px; display: block; background: transparent url('images/btn-photos.png') top center no-repeat;}
a.photos:hover  	{ background: transparent url('images/btn-photos-over.png') top center no-repeat;}

/* Common Formatting */

hr {
	border-top: 1px solid #006486;
	border-right: 1px solid black;
	border-bottom: 1px solid black;
	border-left: 1px solid black;
	height: 2px;}
 
h1, h2, h3, h4, h5, h6 {
	font-family: Helvetica, Arial, Verdana;
	margin:0;
	padding:0;}
 
h1 {
	font-size:2.1em;
	color: #a30000;
	margin: 0 0 5px 0;
	padding: 10px 0 20px 0;}
	
h1.home {
	font-size: 18px;
	color: yellow;
	text-align: center;}
	
h2 {
	font-size:1.9em;
	color: #ffde00;
	margin: 0 0 10px 0;
	padding: 0;}
	
h3 {
	font-size:1.4em;
	color: #FFF;
	font-weight:bold;
	margin: 0 0 15px 0;
	padding: 0;
	letter-spacing: -1px;}

h4 {
	color: #30ccff;
	font-size: 1.1em;
	padding: 0 0 15px 0;
	font-weight: bold;}
 
p {
	font-size: 0.95em;
	color: #fff;
	margin:0;
	padding:0 0 15px 0;}
 
ul {
	list-style:none;
	padding:0 0 18px 40px;
	color: #FFF;}

ol {
	list-style: decimal;
	padding:0 0 18px 20px;
	color: #FFF;}
	
ol li {
	margin-bottom: 20px;}
	
.grid_6 ul {
	list-style: circle;}
 
blockquote {
	margin:0;
	padding:10px 0;
	background: transparent url('images/blockquote-top.png') top center no-repeat;}
	
blockquote div {
	background: transparent url('images/blockquote-bot.png') bottom center no-repeat;}
	
blockquote p {
	font-size: 1.2em;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 1.4em;
	color: #35a8df;
	text-align: center;
	padding: 5px 15px 15px 15px;
	margin: 0;}
 
small {
	font-size:1em;
	color: black;}
 
img {
	border:0;}
 
sup {
	position:relative;
	font-weight: bold;
	font-size: 0.9em;
	color: #555;
	bottom:0.3em;
	vertical-align:baseline;}
 
sub {
	position:relative;
	bottom:-0.2em;
	vertical-align:baseline;}
 
acronym, abbr {
	cursor:help;
	letter-spacing:1px;
	border-bottom:1px dashed;}
	
address {
	display: block;
	font-style: normal;
	margin: 0;
	padding: 10px 0 0 0;}
 
/* Links */
 
a, a:visited {
	color: #fff;}
	
a:hover, #content a:hover {
	color: #35a8df;
	text-decoration: none;
	text-decoration: underline;}
	
#content a {
	color: #fff;
	font-weight: bold;}
	
#footer a {
	color: #afcad4;}
	
#footer a:hover {
	color: #fff;}
	
#breadcrumbs a {
	color: #555555;}
	
a.side {
	background: transparent url('../images/icon-link.gif') left center no-repeat;
	padding-left: 20px;
	font-weight: bold;}
	
#content blockquote a {
	background-color: #007196;
	-moz-border-radius: 10%;
	padding: 7px 8px;
	margin-top: 6px;
	color: #FFF;
	text-decoration: none;
	font-size: 12px;
	text-transform: uppercase;}
	
#content blockquote a:hover {
	background-color: white;
	color: black;}
 
/* forms */

form {
	overflow:hidden;}

.formimg {
	vertical-align: bottom;}

input {
	font-size: 13px;
	padding: 1px;
	border: none;}
	
/*table */

table.details td {
	padding: 10px;}
	
table.details tr {
	background-color: #034259;
	vertical-align: top;}
	
table.details tr.alt {
	background-color: #02202b;}
  
/***** Global Classes *****/
 
.clear         { clear:both; }
 
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left; }
.text-right    { text-align:right; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
  
.img-left      { float:left;margin:4px 10px 4px 0; }
.img-right     { float:right;margin:4px 0 4px 10px; }
 
.nopadding     { padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }
:focus         { outline: 0;}

.back          { text-align: left; margin: 5px 0 0 0; padding: 0;}
.upper         { text-transform: uppercase;}
.hidden        { display: none; width: 0; height: 0;}
