/* ************** START RESET RULES - DO NOT MODIFY ******************** */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, 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;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	/*vertical-align: baseline;*/
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
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: "" "";
}

/* ************** END RESET RULES ******************** */

/* ************** START MAIN RULES ******************** */


/*
@font-face {
	font-family: 'VanillaRegular';
	src: url('/Vanilla.eot');
	src: local('Vanilla Regular'), local('Vanilla'), url('/Vanilla.woff') format('woff'), url('/Vanilla.ttf') format('truetype'), url('/Vanilla.svg#Vanilla') format('svg');
}

@font-face {
	font-family: 'Severance2001Regular';
	src: url('/SEVERG__.eot');
	src: local('Severance 2001 Regular'), local('Severance2001'), url('/SEVERG__.ttf') format('truetype');
}
*/

body {
	background-color:#99CCFF; /* will need to be set dynamically based on an id on the body tag, or overridden within the template by setting this style dynamically through some CF code in the template */
	font-family:Georgia, "Trebuchet MS", Times,  serif;
	font-size:0.9em;
	line-height:1.1em; /* 16×1.125=18 */
}
/*
body#benjerry, body#contact, body#search{
	background-color:#99CCFF;
}
*/
body#flavors{
	background:url(/assets/images/bg/clouds_flavors.gif) #7f4098 top center;
}

body#company, body#contact-us, body#error{
	background:url(/assets/images/bg/clouds_company.gif) #0076c0 top center;
}

body#activism{
	background:url(/assets/images/bg/clouds_activism.gif) #4aaa42 top center;
}

body#fun{
	background:url(/assets/images/bg/clouds_fun.gif) #F3941E top center;
}

body#scoop-shops{
	background:url(/assets/images/bg/clouds_scoop.gif) #DC83B6 top center;
}

/***** begin OUTERWRAPPER *****/
/* This is a container for the entire page. It is used to constrain the width of the page and allow for browser chrome to avoid the need for horizontal scrolling. IE 5 browser requires the use of text-align: center defined by the body element to center the container. */
#outerWrapper {
	margin: 0 auto 0 auto; 
  	max-width: 1200px;
	width: expression(document.body.clientWidth > 1202? "1200px" : "auto");
	text-align: left;	
}

/***** begin CANVAS *****/
#canvas {
	width: 985px; 
	margin: 0 auto 0 auto;
}

/* html elements must be specified as block */
header, footer, nav, logo{
	display:block;
}

header, #header{ /*includes html5 header tag*/
	height:58px;
	padding:5px 0px 0px 0px;
}

header #bjlogo, #header #bjlogo {/*includes html5 header tag*/
	float:left;
	margin-left:10px;
}

#topNav{
	float:left;
	margin-left:60px;
	/*border:1px solid #000000;*/
}

/*****  ALT CONTENT RULES ********/

#altWrapper{
	text-align:center;
}

ul#topNav-alt, ul#footer-alt{
	margin:8px 0px 8px 0px;
	padding:0px;
	list-style-type:none;
	text-align:center;
}

ul#topNav-alt{
	padding-top:8px 0px 8px 0px;;
}

ul#topNav-alt li, ul#footer-alt li{
	display:inline;
	padding:3px;
	list-style-type:none;		
}

/*
#pageTitle {
	float:left;
	margin-left:60px;
}
*/

#searchContactBox {
	float:right;
}

/***** end CANVAS *****/


/***** begin LEFTCOLUMN *****/
#leftColumn {
  float: left;
  padding: 0px 0px 0px 0px; 
  width: 260px; 
 }

#mainNav {
}

#home-altContent{
	width:1005px;
	margin: 0 auto 0 auto;
}

#home-altContent ul{
	float:left;
}

#home-altContent ul li{
	display:inline;
}

#home-altContent ul li a{
	float:left;
	padding-right:10px;
}

#promo {
	position:relative;
	top:-200px;
	z-index:100;
}
/* end leftColumn */

footer, #mainFooter{/*includes html5 footer tag*/
	/*position:relative;
	top:-180px;
	z-index:101;*/
	width:985px;
	margin: 0 auto 0 auto;
}
/***** end OUTERWRAPPER *****/

#sharethis{
	float:right;
	margin-bottom:3px;
}

#sharethis span {
	width:16px;
	margin-left:0px;
	margin-right:0px;
	padding-right:0px;
}

#sharethis #ck_facebook{
	position:relative;
	top:4px;
}

#sharethis #tweet_btn {
	position:relative;
	top:4px;		
}

#sharethis #___plusone_0 {
	position:relative;
	top:4px;		
}

/***** start FONT SPECS *****/

@font-face {
    font-family: 'PlatzCondensed';
    src: url('/assets/fonts/Platz/platzcondensed-webfont.eot');
    src: url('/assets/fonts/Platz/platzcondensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('/assets/fonts/Platz/platzcondensed-webfont.woff') format('woff'),
         url('/assets/fonts/Platz/platzcondensed-webfont.ttf') format('truetype'),
         url('/assets/fonts/Platz/platzcondensed-webfont.svg#PlatzCondensed') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1,h2,h3,h4 {
	/*font-family:"Trebuchet MS", Verdana, sans-serif;*/
	/*font-family:"PlatzCondensed", Verdana, sans-serif;*/
	margin-bottom:0px;
	line-height:1em;
	/*text-shadow: 0 0 1px rgba(51,51,51,0.5);*/
}

/* note: all <H1>s are controlled by sIFR */
h1 {
	font-size:3em;
	/*margin-bottom: 0.35em;*/
}

h2 {
	font-size:2em;
	margin-bottom: 0.25em;
}

h3 {
	font-size:1.5em;
	margin-bottom: .15em;
}

h4 {
	font-size:1.25em;
	margin-bottom: 0em;
}

.small {
	font-size:0.85em;
}

.micro {
	font-size:0.55em;
}

div.pageHeaderWrapper {
	width:670px;
	height:auto;
	margin-bottom:10px;
}

h1.pageHeaderStandard {
	color:#FFFFFF;
	padding: 0px 0px 10px 14px;
}

body#flavors h1.pageHeaderStandard {
	background:url(/assets/images/bg/pageHeader/flavors.gif) no-repeat;
}

body#company h1.pageHeaderStandard, body#contact-us h1.pageHeaderStandard, body#error h1.pageHeaderStandard{
	background:url(/assets/images/bg/pageHeader/company.gif);
}

body#activism h1.pageHeaderStandard{
	background:url(/assets/images/bg/pageHeader/activism.gif) #4aaa42;
}

body#fun h1.pageHeaderStandard{
	background:url(/assets/images/bg/pageHeader/fun.gif) #F3941E;
}

body#scoop-shops h1.pageHeaderStandard{
	background:url(/assets/images/bg/pageHeader/scoop-shops.gif) #0076c0;
}

h1.scoop-shops, h2.scoop-shops, h3.scoop-shops, h4.scoop-shops {
	color:#AF006E;
}

p {
	margin: 10px 0px 0px 0px;
}

ol{list-style-type:decimal;}

ul{list-style:disc;}

ul, ol{
	margin-left:30px;
	margin-top:5px;	
}
ul.circle {
	list-style:circle;
}

ul.yellowdot{
	list-style-image:url(/assets/images/bullets/yellow_dot.gif);	
}

li{
	margin-bottom:5px;
}

a {
	color: #3366cc;
}

a:hover {
	color: #0099FF;
}

/* Using floated elements and a clear float class is a common method to accomplish multiple column tableless layouts. If floated elements are used without being cleared the elements following will wrap around the floated element. This class should be applied to an element after the last floated element and before the close of the container with floated elements. */
.clearFloat {
  clear: left;
  display: block;
}

/***** HACKS *****/

<!--[if IE 5]>
/* IE 5 does not use the standard box model, so the column widths are overidden to render the page correctly. */
#leftColumn {
  width: 260px;
}
<![endif]-->

<!--[if IE]>
/* The proprietary zoom property gives IE the hasLayout property which addresses several bugs. */
#canvas {
  zoom: 1;
}

<![endif]-->