/*
Template Name: Hain Celestial
Version: 2.0
*/


/* Social Timeline */
div.light div.dpSocialTimeline .dpSocialTimeline_item {
	border: 4px solid #495928!important;
	text-shadow: 0 0 0 #495928!important;

}
div.light div.dpSocialTimeline .dpSocialTimeline_item div.dpSocialTimelineContentFoot,
div.light div.dpSocialTimeline .dpSocialTimeline_item div.dpSocialTimelineContentHead {
	background: #495928!important;
	color: #FFF!important;
	border-style: solid!important;
	border-color: #495928!important;
	text-shadow: 0 0 0 #495928!important;
}

div.light div.dpSocialTimeline .dpSocialTimeline_item div.dpSocialTimelineContentFoot {
	background: #495928 url(images/clock.png) 5px 50% no-repeat!important;
	color: #FFF!important;
	border-style: solid!important;
	border-color: #495928!important;
	text-shadow: 0 0 0 #495928!important;

}

div.light div.dpSocialTimeline .dpSocialTimeline_item .user,
div.light div.dpSocialTimeline .dpSocialTimeline_item span.time {
	text-shadow: none!important;
	color: #FFF!important;
	font-family: "Raleway", sans-serif!important;
	font-size: 13px!important;
}

div.dpSocialTimeline .dpSocialTimeline_item div.dpSocialTimelineContent {
	font-size: 13px!important;
	line-height: 150%!important;
	font-family: "Raleway", sans-serif!important;
	text-shadow: 0 0 0 #495928!important;
}

div.dpSocialTimeline .dpSocialTimeline_item a.img_link,
div.dpSocialTimeline .dpSocialTimeline_item div.dpSocialTimelineContent img {
	filter: alpha(opacity=100)!important;
	opacity: 1!important;
}

/* Imports
-----------------------------------------------------------------*/
	@import "style-responsive.css";

	/*@import "reset.css";
	/* Raleway Font */
	@import url(https://fonts.googleapis.com/css?family=Raleway:400,500,700,800);

/* Body
-----------------------------------------------------------------*/
body {
	color: #444;
	font-family: Raleway, sans-serif !important;
	font-weight: 500;
	background: #FFF;
	background-position: 0 0;
	background-repeat: repeat-y;
}

/* Fixes and Styles
-----------------------------------------------------------------*/
.clear {clear: both; overflow: hidden; height: 0;}

strong, b {font-weight: bold;}

p {margin: 0 0 20px 0;}

.bluetext {
	color: #495928;
	background: none;
}

.bluebg {
	background: #495928;
	color: #FFF;
}

.orangetext {
	color: #e7d31e;
	background: none;
}

.orangebg {
	color: #ffffff;
	background: #e7d31e;
}

.greentext {
	color: #479713;
	background: none;
}

.greenbg {
	background: #479713;
	color: #FFF;
}

.redtext {
	color: #d54049;
	background: none;
}

.redbg {
	background: #d54049;
	color: #FFF;
}

/* Container
-----------------------------------------------------------------*/
#container {
	width: 100%;
	margin: 0;
}

#sidebar {
	width: 100%;
  position: relative;
  top: 0;
  left: 0;
  text-align: center;
  padding: 0;
  height: 7rem;
}

#main {
	position: relative;
	top: 0;
	width: 100%;
}

#sidebar .logo {
	padding: 0px 0 40px 0;
	float:left;

}

#sidebar img.hainlogo {
	min-height: 6rem;
  width: auto;
	height: auto;
}

header #sidebar .nav-expander img {
	width: 100%;
	max-width: 100%!important;
	height: auto;
}

/* Top Section
-----------------------------------------------------------------*/
#top-section {
	padding: 30px 30px 0px 17px;
	font-family: "Raleway", sans-serif!important;
}

#top-search, .retailer, #top-navigation, #top-world {
	float:right;
	margin-left: 25px;
	min-height: 25px;
}
#top-world, #top-navigation {
	margin-right: 0;
}
#top-navigation ul {
	list-style: none;
	padding: 0;
	margin: 0;
	text-transform: uppercase;
}

#top-navigation li {
	float: left;
	font-size: 18px;
	margin-right: 25px;
}

@media only screen and (max-width: 1310px) {
	#top-navigation li.three {
		margin-right:0;
	}
}

#top-navigation a {
	color: #4a4a4a;
	background: none;
	text-decoration: none;
	border-bottom: 1px solid #FFF;
	text-shadow: 0 0 0 #FFF;
}

#top-navigation a:hover {
	text-shadow: 0 0 0 #4a4a4a;
}

#top-right {
	float: right;
	font-size: 13px;
	text-transform: uppercase;
}

#top-right a {
	color: #4a4a4a;
	background: none;
	text-decoration: none;
}

#top-search-left {float: left;}
#top-search-right {float: left;}


#top-world img {
	vertical-align: middle;
}

#top-search input[type=text] {
	width: 150px;
	padding: 0 10px;
	margin: 0;
	color: #4a4a4a;
	background: #FFF;
	border-style: solid;
	border-width: 0 0 1px 0;
	border-color: #4a4a4a;
	font-family: "Raleway", sans-serif!important;
	color: #949494;
  text-decoration: none;
  font-size: 18px;
}

#top-search input[type=button], #top-search input[type=submit] {
	border: 0;
	padding: 0;
	width: 16px;
	height: 16px;
	cursor: pointer;
	background: url("images/icon-search.png") top left no-repeat;
	color: #000;
}

/* World
-----------------------------------------------------------------*/
#top-world ul, #top-world ul.sub-menu {
	padding: 0;
	z-index: 3000;
	margin: 0;
	text-transform: uppercase;
}
#top-world li, #top-world ul.sub-menu li {
	list-style-type: none;
	display: block;
}
#top-world li a, #top-world li ul.sub-menu li a {
	text-decoration: none;
	color: #000;
	text-transform: uppercase;
	display: block;
}
#top-world li ul.sub-menu li a {
	padding:5px;
}
#top-world li {
	position: relative;
}
#top-world li ul.sub-menu {
	display: none;
	position: absolute;
	top: 20px;
	left: 24px;
	width: 142px;
	border: 1px solid #f6f6f6;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 50%, #f6f6f6 75%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, #ffffff), color-stop(75%, #f6f6f6), color-stop(100%, #ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 50%, #f6f6f6 75%, #ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 50%, #f6f6f6 75%, #ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 50%, #f6f6f6 75%, #ededed 100%); /* IE10+ */
	background: linear-gradient(to bottom, #ffffff 50%, #f6f6f6 75%, #ededed 100%); /* W3C */
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 ); /* IE6-9 */
}
#top-world li:hover ul.sub-menu {
	display: block;
}
#top-world ul.sub-menu li {
	border-bottom: 1px solid #EEE;
	font-size: 11px;
}
#top-world li ul.sub-menu a:hover {
	color: #4a4a4a;
	background: none;
}
#top-world ul.sub-menu img {
	vertical-align: middle;
	padding: 0 3px 0 0;
}

/* Slide-out Navigation
-----------------------------------------------------------------*/
.nav-expander {
	cursor: pointer;
	float: right;
  position: relative;
  right: 2rem;
  top: 1rem;
}

div.main-menu {
	background: #FFF;
	display: block;
	height: 100%;
	position: absolute;
	top: -1500px;
	font-size: 15px;
	width: 100%;
	z-index: 2000;
	font-size: 14px;
	line-height: 35px;
	border:5px solid darkgreen;
	border-bottom:3rem solid darkgreen;
}

div.main-menu {
	height: 100%;
	width:100%;
}

div.main-menu li {
	width:49%;
	display:inline-block;
	font-weight: 500;
	margin: 0;
	padding: 0;
	font-size: 20px;
	letter-spacing: 1px;
	text-transform: uppercase;
	vertical-align: top;
}

div.main-menu ul {
	list-style: none;
	padding: 0;
	margin: 0;
	font-weight: 500;
	letter-spacing: 1px;
	width:100%;
	display:block;
}

div.main-menu #navigation {
	padding:2rem 3rem 0 3rem;
}

div.main-menu .nav-section a {
	color: #4a4a4a;
	background: none;
	text-decoration: none;
}

div.main-menu .nav-section a:hover, div.main-menu .nav-section  li.current-menu-item a,
div.main-menu .nav-section .menu-item-has-children li.current-menu-item a,
div.main-menu .nav-section .menu-item-has-children a:hover {
	font-weight: 500;
}

div.main-menu .nav-section .menu-item-has-children li a {
	font-weight: 400;
}

div.main-menu .nav-section a:hover:after, div.main-menu .nav-section li.current-menu-item a:after {
    content: " > ";
}

div.nav-section li li {
	font-size: 13px;
	font-weight: 400;
	display: block;
	vertical-align: top;
}

div.nav-section li ul {
	margin: 0 auto 30px 0px;
}

.nav-expanded div.main-menu {
  	left: 0;
}

body.nav-expanded {
	background: url("images/bodybg-lg.png") top left repeat-y;
}

body.nav-expanded #sidebar {display: none;}

body.nav-expanded #main {left: 318px;
}



/* Top-Home-Ticker
-----------------------------------------------------------------*/
#top-ticker {
	font-family: "Open Sans", sans-serif;
	color: #479713;
	background: none;
	letter-spacing: 1px;
	line-height: 13px;
	max-width: 700px;
	margin: 10px 30px 5px 0px;
	float:right;
	text-align: left;
}

#top-ticker #ticker-time {
	text-transform: uppercase;
	font-size: 12px;
}

#top-ticker #ticker-info {
	font-weight: normal;
	font-size: 21px;
}

#top-ticker #ticker-info span.number {
	font-size: 34px;
}

#top-ticker #ticker-info span.stock-info {
	font-size: 23px;
}

#home-brand-info {
	width: 90%;
  margin-left: auto;
  margin-right: auto;
}
/* Home-Brands
-----------------------------------------------------------------*/
#home-brands {
	width: 100%;
	background: url("images/home-brands-bg.jpg") bottom center no-repeat;
	color: #FFF;
}

#home-brands-left {
	width:35%;
	display: inline-block;
	text-align:center;
}

#home-brands-right {
	text-align: left;
	width:60%;
}

#home-brands-left a.more {
	display: block;
	border-style: solid;
	border-width: 3px;
	padding: 5px 10px;
	font-weight: 700;
	font-size: 17px;
	text-decoration: none;
	line-height: 100%;
	margin-top: 20px;
}

#home-brands-blue {
	width:290px;
	text-align: left;
	display: block;
	vertical-align: top;
	height: 160px;
	padding: 10px;
	border:30px solid #4a5927;
	background: white;
	color: #4a5927;
	font-weight: 500;
	font-size: 30px;
	line-height: 120%;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	margin-bottom: 13px;
}

#home-brands-blue a.more {
	border-color: #4a5927;
  color: #4a5927;
  background: none;
  width: 140px;
  margin-left: .5rem;
}
/* this is actually the orange box */
#home-brands-green {
	width:290px;
	text-align: left;
	display: block;
	vertical-align: top;
	height: 160px;
	padding: 10px;
	border:30px solid #578D14;
	background: white;
	color: #578D14;
	font-weight: 500;
	font-size: 30px;
	line-height: 120%;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	margin-bottom: 13px;
}

#home-brands-green a.more {
	border-color: #578D14;
	color: #578D14;
	background: none;
	width: 160px;
	margin-left:.5rem;
}
/* this is actually the 3rd box - background- green */
#home-brands-orange {
	width:290px;
	text-align: left;
	display: block;
	vertical-align: top;
	height: 160px;
	padding: 10px;
	color: #E7D31C;
	background: white;
	border:30px solid #E7D31C;
	font-weight: 500;
	font-size: 30px;
	line-height: 120%;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	margin-bottom: 13px;
}

#home-brands-orange a.more {
	border-color: #E7D31C;
	color: #E7D31C;
	background: none;
	width: 130px;
	margin-left:.5rem;
}

#home-brands-red {
	width:100%;
	height: 160px;
	padding: 10px;
	background: white;
	border:30px solid #A9C589;
	color: #A9C589;
	font-weight: 500;
	font-size: 30px;
	line-height: 120%;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
	text-align: left;
	display:block;
	vertical-align: top;
}

#home-brands-red a.more {
	border-color: #A9C589;
	color: #A9C589;
	background: none;
	width: 180px;
}

#home-brands-blue:hover, #home-brands-green:hover,
#home-brands-orange:hover {
	padding: 20px 20px 0 20px;
}


/* Home Brands - Under 1300
-----------------------------------------------------------------*/
#home-brands-full {
	max-width: 1180px;
	width: 100%;
	position: relative;
	height: 853px;
	display: none;
}
#home-brands-border {
	position: absolute;
	top: 670px;
	left: 0;
	background: #aac689;
	height: 183px;
	width: 1180px;
	z-index: 50;
}
#home-brands-image {
	position: absolute;
	top: 80px;
	right: 0px;
	z-index: 60;
}
#home-brands-image img {
	max-width: 863px;
	width: 100%;
}
#home-brands-nav {
	position: relative;
	top: 0;
	left: 0;
	z-index: 80;
	max-width: 500;
}
#home-brands-nav a.more {
	display: block;
	border-style: solid;
	border-width: 5px;
	padding: 5px 10px;
	font-weight: 500;
	font-size: 17px;
	text-decoration: none;
	line-height: 100%;
	margin-top: 20px;
}

/* Timeline
-----------------------------------------------------------------*/
#the-timeline {
	max-width: 1160px;
	margin: 0 auto;
}

h3.grid-title {
	background: #495928;
	color: #FFF;
	font-size: 40px;
	padding: 15px 20px;
	margin: 13px 0 0 0;
}

.redticker{color:#C00!important;}

/* Footer-Ticker
-----------------------------------------------------------------*/
#the-bottom-ticker {
	width: 100%;
	background: url("images/bodybg-faded.png") top left;
	color: #479713;
	padding: 10px 0;
	display: table;
}

#bottom-ticker {
	font-family: "Open Sans", sans-serif;
	color: #479713;
	background: none;
	font-weight: normal;
	letter-spacing: 1px;
	/*max-width: 840px;*/
	margin: 0 auto;
	text-align: left;
	display: table;
}

#bottom-ticker-left {
	float: left;
	display: table-cell;
	vertical-align: bottom;
}

#bottom-ticker-right {
	float: left;
	display: table-cell;
	vertical-align: bottom;
	padding-top: 6px;
	padding-left:10px;
}

#bottom-ticker #bottom-ticker-time {
	text-transform: uppercase;
	font-size: 16px;
	line-height: 120%;
}

#bottom-ticker-note {font-size: 11px;line-height: 120%;font-weight: 400;}

#bottom-ticker #bottom-ticker-info {
	font-weight: normal;
	font-size: 28px;
	display: table-cell;
	vertical-align: bottom;
}

#bottom-ticker span.number {
	font-size: 60px;
}

#bottom-ticker span.stock-info {
	font-size: 22px;
}

/* Footer-Close
-----------------------------------------------------------------*/
#footer {
	background: #495928;
	color: #FFF;
	text-align: center;
	padding: 20px;
}

#footer a {
	color: #FFF;
	background: none;
	text-decoration: none;
	border-bottom: 1px solid #495928;
	text-shadow: 0 0 0 #5765d8;
}

#footer-nav {
	font-size: 18px;
	text-transform: uppercase;
	font-weight: 400;
}


#footer-nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
}

#footer-nav li {
	display: inline-block;
	padding: 0 20px;
}

#footer-nav a:hover{
	text-shadow: 0px 0px 0px #FFF;
}

#footer-copy {
	padding: 30px 0 0 0;
	font-size: 12px;
	font-family: "Open Sans", Helvetica, sans-serif;
}


.dcwss.dc-wall .stream li {
	border: 2px solid #495928;
}


/* new header section */
body header {
	height:7rem;
	width:100%;
	border-bottom:2px solid darkgreen;
}
header #top-section {
	float:left;
	margin-left:150px;
  padding: 2.5rem 1.5rem 0 0;
	max-width: 85%;
	font-weight: 400;
}
header .logo {
	position: absolute;
  max-width: 10%;
  height:7rem;
	padding:.5rem 1.5rem;
}
header #top-section #top-navigation {

}
header #top-section .retailer {

}
header #top-section .retailer a {
	color: #4a4a4a;
	background: none;
	text-decoration: none;
	border-bottom: 1px solid #FFF;
	text-shadow: 0 0 0 #fff;
	font-size: 18px;
}
header #sidebar {
	display:none;
}
header .nav-expander {
	display:none;
}

@media only screen and (max-width: 768px) {

	header #top-section {
		display:none;
	}
	header #sidebar {
		display:block;
		width:100%!important;
	}
	header .logo {
		top:0;
		position: relative;
		display: inline-block;
	}
	header .nav-expander {
		display:block;
	}
}