/*
   COLOUR INDEX
-------------------------------------------------------*/

/*
   BODY
-------------------------------------------------------*/
body {
   text-align: center;
   background: #FFF url(../images/bg-body.gif) repeat-x top left;
   font-size: 12px;
   font-family: Arial, sans-serif;
   color: #333;
}

/*
   CLEARFIX
-------------------------------------------------------*/
.clearfix:after{clear:both;content:'.';display:block;visibility:hidden;height:0}
.clearfix{display:inline-block}
* html .clearfix{height:1%}
.clearfix{display:block}

/*
   TYPOGRAPHY and BASIC ELEMENTS
-------------------------------------------------------*/
/* headings */
h2, h3, h4, h5, h6 {
   
}

h1 {
	text-indent: -9999px;
}

	/* requires w, h,  */
	h1 a, h1 a:visited {
	   display: block;
	   width: 180px;
	   height: 130px;
	   position: absolute;
	   top: 8px;
	   left: 60px;
	   background: url(../images/bg-h1-green.gif) no-repeat top left;
	}

h2 {
   color: #39b2f2;
   font-size: 20px;
   padding-bottom: 10px;
}

   #home h2 {
      padding-left: 30px;
   }

h3 {
   padding-bottom: 5px;
   font-weight: bold;
   font-size: 14px;
}

h4 {
   font-size: 12px;
   font-weight: bold;
   padding-bottom: 5px;
}

/* paragraphs etc. */
p {
   line-height: 1.3;
   padding-bottom: 15px;
}

	p.left {
	   text-align: left;
	}
	
	p.right {
	   text-align: right;
	}
	
	p.center {
	   text-align: center;
	}
	
	#home .ecostore p {
	   font-size: 11px;
	}
	
	p.meta {
		line-height: 1.5;
		font-size: 11px;	
	}
	
	.notice p {
	   margin: 0;
	   padding: 0;
	}

big {
   font-size: 125%;
}

small {
   font-size: 75%;
}

strong {
   font-weight: bold;
}

em {
   font-style: italic;
}

blockquote {
   padding: 0 20px 10px;
}

/* lists - usually have to put #content in front */
#content ul, #sidebar ul {
   line-height: 1.3;
   list-style: disc outside;
   margin-left: 36px;
   padding-bottom: 15px;
}

#content ol, #sidebar ol {
   line-height: 1.3;
   list-style: decimal outside;
   margin-left: 36px;
   padding-bottom: 15px;
}

#content li ul, 
#content li ol, 
#sidebar li ul,
#sidebar li ol {
   padding-bottom: 0;
}

/* links */
a, a:visited {
   color: #39b2f2;
   text-decoration: none;
}

a:hover {
   text-decoration: underline;
}

p.more {
   border: 1px solid #ddd;
   background: url(../images/bg-link-more.gif) repeat-x top left;
   height: 20px;
   line-height: 20px;
   padding: 0 4px;
   margin: 0 0 5px;
   float: right;
}

p.more a {
   background: url(../images/bg-link-arrow.gif) no-repeat left center;
   padding-left: 16px;
}

#topnav p {
   line-height: 30px;
   padding: 0;
   margin: 0;
   color: #fff;
}

/* images */
img {
   border: 0;
}

img.left {
	float: left;
	margin-right: 10px;
	margin-bottom: 15px;
}

img.right {
	float: right;
	margin-left: 10px;
	margin-bottom: 15px;
}

img.center {
	margin: 0 auto 10px;
	display: block;
}

.meta img {
	vertical-align: middle;
}

.img-wrapper-left {
   padding: 4px;
   background: #eee;
   border: 1px solid #ddd;
   float: left;
   margin: 0 10px 5px 0;
   text-align: center;
   color: #999;
   font-size: 11px;
   display: inline;
}

.img-wrapper-right {
   padding: 4px;
   background: #eee;
   border: 1px solid #ddd;
   float: right;
   margin: 0 0 5px 10px;
   text-align: center;
   color: #999;
   font-size: 11px;
   display: inline;
}

.img-wrapper-left img, .img-wrapper-right img {
   display: block;
   margin:auto;
   padding-bottom: 5px;
}

/* horizontal rule */
hr {
  border-color: #ccc;
  border-style: solid;
  border-width: 1px 0 0;
  clear: both;
  margin: 0 0 20px;
  height: 0;
}

/* tables */
#content table {
   margin-bottom: 15px;
}

.calendarBG {
   margin: 10px auto;
}

tr {
   
}

th {
   
}

.calendarBG th {
   text-align: center;
   font-weight: bold;
}

#content td {
   padding: 3px 6px;
   vertical-align:top;
}

.calendarBG td {
   padding: 3px;
}

/*.tableCellTwo img {
   border: 1px solid #DCDAC7;
}*/

/* forms */
label {font-weight:bold;}
fieldset {padding:1.4em;margin:0 0 1.5em 0;border:1px solid #ccc;}
legend {font-weight:bold;font-size:1.2em;}

input[type=text], input[type=password], input.text, input.title, textarea, select {background-color:#fff;border:1px solid #bbb;}
input[type=text]:focus, input[type=password]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus {border-color:#666;}
input[type=text], input[type=password], input.text, input.title, textarea, select {margin:0.5em 0;}

input.text, input.title {width:300px;padding:5px;}
input.title {font-size:1.5em;}

textarea {width:390px;height:250px;padding:5px;}

input[type=checkbox], input[type=radio], input.checkbox, input.radio {position:relative;top:.25em;}

form.inline {line-height:3;}
form.inline p {margin-bottom:0;}

.error, .notice, .success {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.success a {color:#264409;}


/*
   CONTAINER
-------------------------------------------------------*/
#container {
   margin: 0 auto;
   text-align: left;
/*   background: url('960_grid_12_col.gif') repeat-y top left;*/
}

/*
   TOPNAV
-------------------------------------------------------*/
#topnav {
   height: 30px;
   text-align: right;
}

#topnav ul {
   display: inline;
}

#topnav li {
   display: inline;
   line-height: 30px;
}

#topnav a, #topnav a:visited {
   color: #fff;
   padding: 9px 5px;
}

#topnav a:hover {
   text-decoration: none;
   background: url(../images/bg-topnav.gif) repeat-x top left;
}

#search-form {
   background: url(../images/bg-search-form.gif) no-repeat top left;
   width: 189px;
   height: 30px;
}

#search-form input.txt {
   float: left;
   border: none;
   background: none;
   width: 155px;
   padding: 7px 0 0 10px;
   margin: 0;
   color: #999;
}

#search-form input.btn {
   float: left;
   padding: 7px 0 0 0;
}

/*
   BRANDING
-------------------------------------------------------*/
#branding {
	height: 145px;
	position: relative;
}

/*
   MAIN NAVIGATION
-------------------------------------------------------*/
#mainnav {
	height: 145px;
	text-align: center;
}

#mainnav ul {
   
}

#mainnav li {
	float: left;
}

#mainnav li a {
   float: left;
   display: block;
   width: 100px;
   height: 100px;
   margin-top: 33px;
}

/*
   SUBNAV
-------------------------------------------------------*/
#subnav h3 {
   color: #fff;
   width: 180px;
   height: 31px;
   line-height: 31px;
   padding: 0 10px;
   background: url(../images/bg-subnav-h3.gif) no-repeat top left;
}

#subnav ul {
   margin-bottom: 20px;
}

#subnav li ul {
   margin-bottom: 0;
}

#subnav li {
   list-style: none;
   border-bottom: 1px solid #eee;
}

   #subnav li li {
      border-bottom: none;
      padding-left: 20px;
      background: url(../images/bg-subnav-li.gif) no-repeat 10px 3px;
   }

#subnav li a, #subnav li a:visited, #subnav li.here li a {
   padding: 8px 10px 8px 12px;
   margin-right: 10px;
   display: block;
   background: url(../images/bg-nav-sub.gif) no-repeat right center;
   color: #666;
   font-weight: normal;
}

#subnav li a:hover, #subnav li.here li a:hover, #subnav li.here a, #subnav li a.here {
   color: #39b2f2;
   text-decoration: none;
}

/*
   CONTENT
-------------------------------------------------------*/
#content {
   padding-bottom: 24px;
}

#breadcrumb {
   padding-bottom: 15px;
   font-size: 11px;
   line-height: 1.5;
}

/* PADDING */
.padding-all {
   padding: 13px 10px 24px;
}

.padding-trl {
   padding: 13px 10px 0;
}

.padding-rl {
   padding: 0 10px;
}

.padding-tb {
   padding: 13px 0 24px;
}

/* Misc styles */
div.date {
   text-align: center;
   text-transform: uppercase;
   color: #999;
}

div.date big {
   font-size: 28px;
}

.cats {
   display: block;
   padding-bottom: 15px;
   font-size: 11px;
   color: #999;
}

.related_product {
   height: 200px;
}

.prod_thumb {
   height: 110px;
}

.onsale {
   color:red;
}

.comment-date {
   font-family: Arial;
	font-size: 11px;
	color: #999;
	padding: 0;
}

.comment-date strong {
   color: #333;
}

.comment {
   padding: 0 40px;
   margin: 10px 0;
}



/* NEWS */
.news {
   background: url(../images/bg-news.gif) no-repeat top left;
}

.news h2 {
   background: url(../images/bg-news-h2.gif) no-repeat top left;
}

.main_image {
	float: left;
	width: 440px;
	height: 330px;
	background: #000;
	position: relative;
	overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
	color: #fff;
}

.main_image .desc{
	position: absolute;
	bottom: 0;
	left: 0; /*--Stick the desc class to the bottom of our main image container--*/
	width: 100%;
	display: none; /*--Hide description by default, if js is enabled, we will show this--*/
}

.main_image .block {
	width: 100%;
	background: #111;
	border-top: 1px solid #000;
	padding: 5px;
}

.main_image .block p {
   padding: 0;
}

.image_thumb {
	float: left;
	width: 160px;
	height: 330px;
	background: #000;
	text-align: center;
	margin-bottom: 10px;
}

.image_thumb ul {
	margin: 0;
	padding: 4px 0 0;
	list-style: none;
}

.image_thumb a img, .image_thumb a:visited img {
   border: 1px solid #000;
   margin-bottom: 1px;
}

.image_thumb a:hover img {
   border: 1px solid #fff;
}

.image_thumb ul li .block {display: none;}

/* ECOSTORE */
.ecostore {
   background: url(../images/bg-ecostore.gif) no-repeat top left;
}

.ecostore h2 {
   background: url(../images/bg-ecostore-h2.gif) no-repeat top left;
}

/* ACTION */
.action {
   background: url(../images/bg-action.gif) no-repeat top left;
}

.action h2 {
   background: url(../images/bg-action-h2.gif) no-repeat top left;
}

/* ASK ASHLEY */
.ask-ashley {
   background: url(../images/bg-ask-ashley.gif) no-repeat top left;
}

.ask-ashley h2 {
   background: url(../images/bg-ask-ashley-h2.gif) no-repeat top left;
}

/* TIPS */
.tips {
   background: url(../images/bg-tips.gif) no-repeat top left;
}

.tips h2 {
   background: url(../images/bg-tips-h2.gif) no-repeat top left;
}

/* EVENTS */
.events {
   background: url(../images/bg-events.gif) no-repeat top left;
}

.events h2 {
   background: url(../images/bg-events-h2.gif) no-repeat top left;
}

/* SPONSORS */
.sponsors {
   background: url(../images/bg-sponsors.gif) no-repeat top left;
}

.sponsors h2 {
   background: url(../images/bg-sponsors-h2.gif) no-repeat top left;
}

.sponsors a img, 
.sponsors a:visited img {
   border: 1px solid #ddd;
   margin: 0 2px 4px;
}

.sponsors a:hover img {
   border: 1px solid #bbb;
}

.sponsor {
	height: 200px;
	text-align: center;
}

.mini-sponsor {
   background: #fff;
   border: 1px solid #ddd;
   margin: 0 2px 4px;
   width: 92px;
   height: 92px;
   float: left;
   text-align: center;
}

/* PROGRAMS */
.programs {
   background: url(../images/bg-programs.gif) no-repeat top left;
   padding-bottom: 24px;
}

.programs h2 {
   background: url(../images/bg-programs-h2.gif) no-repeat top left;
}

/*
 Sidebar
*/
#sidebar a img, #sidebar a:visited img {
	border: 1px solid #ddd;
	display: block;
	margin: 0 auto 4px;
	padding: 10px;
}

#sidebar a:hover img {
	border: 1px solid #bbb;
}


/*
   FOOTER
-------------------------------------------------------*/
#stocking {
   height: 50px;
   background: url(../images/bg-stocking.gif) repeat-x top left;
   border-bottom: 1px solid #dcdac7;
}

#footer {
   color: #979155;
   padding-top: 15px;
}

.mission {
   text-align: left;
   font-style: italic;
}

.copyright {
   text-align: right;
}

/*
   DIAGNOSTICS
-------------------------------------------------------*/
/*  
img[alt=""] {border: 3px dotted red;}

a[href="#"] {background: lime;}
a[href=""] {background: fuchsia;}
a[href^="http://cleancalgary.org"] {background: fuchsia;}*/


/*
   GALLERIA
-------------------------------------------------------*/
#content ul.gallery {
   list-style: none;
   margin-left: 0;
}

.gallery li {
   height: 50px;
   width: 50px;
   padding: 5px;
   margin: 2px;
   border: 1px solid #ddd;
   list-style: none;
   float: left;
}

.gallery li div {
   
}

.gallery li div .caption {

}

.galleria_wrapper {
   text-align: center;
   height: 250px;
   margin-bottom: 10px;
}