@charset 'utf-8';
/*
Theme Name: Montana Harvest of The Month Child Theme
Template: healthy-farm
Theme URI: https://mtharvestofthemonth.org
Version: 1.0
Author: NCAT IT / ThemeREX
Author URI: https://www.ncat.org
License: GNU General Public License
License URI: license.txt
Description: Mostly for tweaks to the original theme.
Text Domain: healthy-farm
*/

@import url("../healthy-farm/style.css");


/* Theme customization starts here
-------------------------------------------------------------- */

/* The sidebar menu */
.sidenav {
   /*height: 100%; Full-height: remove this if you want "auto" height */
  width: 8.9%; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
  margin-top: 10%;
  text-align: center;
}

/* The navigation menu links */
.sidenav a {
  padding: 6px 8px 6px 6px;
  text-decoration: none;
  font-size: 14px;
  display: block;
  background-color:#EFEACC;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}
.sidenav li { 
	list-style-type: none;
}
.sidenav ul {
	padding-left:0px;
}

@media only screen and (max-width:599px){
	.sidenav{
		display:none;
	}
	
	.mobile-menu{
		display: block !important;
	}
}

.mobile-menu{
	display: none;
}

@media only screen and (min-width: 600px){
	.sidenav {
		display: block !important;
	}
	.mobile-menu{
		display: none !important;
	}
}
/*=== header =========================================================================================*/

#header{ position: relative; min-height: 150px;  }

/*--- logo ---*/
.logoHeader{ width: 150px;  margin: 0 auto 10px auto; float: left;}
.logoHeader a{ display: block; text-align: center; letter-spacing: 0; color: #eb413e; padding: 40px 15px 0 15px; }
.logoHeader img{ width: 100%; }
.logoHeader .logo_bg_size{ display: block; text-decoration: none; height: 0;}
.subTitle{ text-align: center; font-weight: 600; font-size: 20px; color: #000; margin: 0 auto 60px auto; letter-spacing: 2px; text-transform: uppercase;}
.hideMenuDisplay .topMenuShow .logoHeader a{ padding: 5px 15px; }
.hideMenuDisplay .topMenuShow .logoHeader img{ width: 80%; }

.logoStyleBG .logoHeader a{  padding: 0; color: #fff; }
.logoStyleBG .logoHeader .logo_bg_size{ width: 0; height: 0; border-color: #eb413e transparent transparent transparent; border-style: solid; border-width: 45px 55px 0 55px;}

/*--- top menu ---*/
#header .menuFixedWrapBlock{ height: 0; }
#header .openTopMenu:before,
#header .openTopMenu:after,
.openMobileMenu:before,
.openMobileMenu:after,
.menuStyleFixed #header.fixedTopMenuShow .menuFixedWrap{ 
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
	        transition: all 0.5s ease; }

.wrapTopMenu > a{ color: #fff; text-transform: uppercase; text-decoration: none; }

/*--- button openTopMenu ---*/
#header .openTopMenu{ display: block; width: 45px; position: absolute; top: 0; left: 0; height: 45px; background: #eb413e; z-index: 5; font-size: 20px; font-weight: 900;  line-height: 45px; text-align: center; color: #fff; overflow: hidden; }
#header .openTopMenu:before,
#header .openTopMenu:after{ font-family: "fontello"; width: 45px; height: 45px; display: block; text-align: center; line-height: 45px; font-size: 26px;}

#header .openTopMenu:before{ content: '\e81b'; }
#header .openTopMenu:after{ content: '\e878'; }
#header .topMenuShow .openTopMenu:before{ margin: -45px 0 0 0; }
#header .topMenuShow .openTopMenu:after{  }

.visibleMenuDisplay #header .openTopMenu{ display: none;}

.openMobileMenu{ display: none; width: 45px; position: absolute; top: 0; left: 0; height: 45px; background: #eb413e; z-index: 6; font-size: 20px; font-weight: 900;  line-height: 45px; text-align: center; color: #fff; overflow: hidden; }
.openMobileMenu:before,
.openMobileMenu:after{  font-family: "fontello"; width: 45px; height: 45px; display: block; text-align: center; line-height: 45px; font-size: 26px; }

.openMobileMenu:before{ content: '\e865'; }
.openMobileMenu:after{ content: '\e878'; }

.menuMobileShow .openMobileMenu:before{ margin: -45px 0 0 0;}
.menuMobileShow .wrapTopMenu .topMenu > ul{ display: block; }

/*--- top menu fixed ---*/
.menuStyleFixed #header .menuFixedWrap{ top: -200px;}
.menuStyleFixed #header.fixedTopMenuShow .menuFixedWrap{ position: fixed; top: 0; left: 30px; right: 30px; z-index: 199;}
.bodyStyleBoxed.menuStyleFixed #header.fixedTopMenuShow .menuFixedWrap{ width: 1240px; margin: 0 0 0 -620px; left: 50%; right: auto;}

.admin-bar .menuStyleFixed #header.fixedTopMenuShow .menuFixedWrap{ top: 32px; }

.menuSmartScrollShow.menuStyleFixed #header.fixedTopMenuShow .menuFixedWrap{ top: -150px; }
.menuSmartScrollShow.menuStyleFixed #header.fixedTopMenuShow.smartScrollDown .menuFixedWrap{ top: 0;}
.admin-bar .menuSmartScrollShow.menuStyleFixed #header.fixedTopMenuShow.smartScrollDown .menuFixedWrap{ top: 32px;}


/*--- top mainMenu ---*/
.wrapTopMenu,
.wrapTopMenu .topMenu > ul > li > a,
#header .usermenuArea a:before,
.menuStyle1 #header ul > li > ul li a:before,
.hideMenuDisplay .logoHeader a,
.hideMenuDisplay .logoHeader img,
.hideMenuDisplay .logoHeader .logo_bg_size{
	-webkit-transition: all 0.5s ease;
	   -moz-transition: all 0.5s ease;
	     -o-transition: all 0.5s ease;
	        transition: all 0.5s ease; }
.wrapTopMenu { }
.wrapTopMenu:after{ content: ''; height: 0; display: block; clear: both;} 
.wrapTopMenu .topMenu a{ font-size: 14px !important; }
.wrapTopMenu .topMenu > ul{ padding: 0; text-align: center; text-shadow: none;}
.wrapTopMenu .topMenu > ul > li{ list-style-type: none; display: inline-block; position: relative; }
.wrapTopMenu .topMenu > ul > li > a{ height: 45px;line-height: 45px;color: #8c8c8c;padding: 0 10px;margin: 0 10px;text-transform: uppercase;font-weight: 600; }
.wrapTopMenu .topMenu > ul > li > a{ position: relative; display: inline-block;}
.wrapTopMenu .topMenu > ul > li > a:before{ content: ''; height: 1px; background-color: #fff; position: absolute; bottom: 15px; left: 50%; right: 50%; opacity: 0;
	-webkit-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s 0.5s ease;
	   -moz-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s 0.5s ease;
	     -o-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s 0.5s ease;
	        transition: left 0.5s ease, right 0.5s ease, opacity 0.5s 0.5s ease; }
.wrapTopMenu .topMenu > ul > li.sfHover > a:before,
.wrapTopMenu .topMenu > ul > li > a:hover:before{ left: 20px; right: 20px; opacity: 1; 
	-webkit-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s ease;
	   -moz-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s ease;
	     -o-transition: left 0.5s ease, right 0.5s ease, opacity 0.5s ease;
	        transition: left 0.5s ease, right 0.5s ease, opacity 0.5s ease; }

.wrapTopMenu .topMenu > ul > li > ul{ display: none; position: absolute; left: 50%; padding: 10px 15px; min-width: 150px;
	border-style: solid; border-width: 1px 1px 1px 1px; border-color: #eb413e; width: 180px; margin: 0 0 0 -105px; z-index: 30; }
.wrapTopMenu .topMenu > ul > li > ul:before{ content: ''; display: block; position: absolute; left: 50%; top: -8px; width: 0; height: 0; margin: 0 0 0 -9px;  border-color: transparent transparent #fff transparent; border-style: solid; border-width: 0 9px 8px 9px; }
.wrapTopMenu .topMenu > ul > li > ul > li > ul:before { content: ''; display: block; position: absolute; left: 0; top: 15px; width: 0; height: 0; margin: 0 0 0 -9px; border-style: solid; border-width: 8px 8px 8px 0px; }
.wrapTopMenu .topMenu > ul > li > ul:after{ content: ''; position: absolute; top: -11px; left: -1px; right: -1px; height: 10px; display: block; background-color: #fff; opacity: 0; }
.wrapTopMenu .topMenu > ul > li > ul li{ list-style: none; text-align: left; position: relative; display: block; }
.wrapTopMenu .topMenu > ul > li > ul li a{ margin: 0; padding: 7px 0; display: inline-block; white-space: pre-line; position: relative; word-break: break-all;}
.wrapTopMenu .topMenu > ul > li > ul li a:before{width: 30px; } .wrapTopMenu .topMenu > ul > li > ul li.sfHover > a:before,
.wrapTopMenu .topMenu > ul > li > ul li a:hover:before{ width: 100px;}

.wrapTopMenu .topMenu > ul > li > ul li.menu-item-has-children{ padding: 0 15px 0 0; }
.wrapTopMenu .topMenu > ul > li > ul li.menu-item-has-children:after{ content: '\e84f'; font-family: "fontello"; text-align: center; width: 10px; height: 10px; line-height: 10px; position: absolute; right: 0; top: 50%; display: block; margin: -5px 0 0 0;  font-size: 12px; }

.wrapTopMenu .topMenu li.menu-item-has-children .menu-item-has-children:after{
	font-family: "fontello";
	content: '\e816';
	display: inline-block;
	margin-left: 5px;
	position: static;
}

.menuStyle1 #header li.menu-item-has-children .menu-item-has-children:after{
	color: inherit;
}

.wrapTopMenu .topMenu > ul > li > ul > li ul{ display: none; position: absolute; left: 100%; top: -9px; border-style: solid; border-width: 1px; padding: 10px 15px; margin: 0 0 0 15px; z-index: 4; }

/*--- user menu area ---*/
#header .usermenuArea{ float: right; padding: 0 10px 0 30px; }
#header .usermenuArea ul.usermenuList{}
#header .usermenuArea > ul.usermenuList .usermenuControlPanel > ul { min-width: 100px ; width: 100px; margin: 0 0 0 -65px;  text-shadow: none; position: absolute;z-index:1000 !important;}
#header .usermenuArea > ul.usermenuList .usermenuControlPanel > ul:before {
content: '';
display: block;
position: absolute;
left: 50%;
top: -8px;
width: 0;
height: 0;
margin: 0 0 0 -9px;
border-color: transparent transparent #fff transparent;
border-style: solid;
border-width: 0 9px 8px 9px;
}
#header .usermenuArea ul.usermenuList .usermenuCurrency{display: none;}
#header .usermenuArea > ul.usermenuList .usermenuCurrency > ul { min-width: 100px ; width: 100px; margin: 0 0 0 -65px;  }

/*--- lang ---*/
#header .usermenuArea ul.usermenuList .usermenuLanguage > a:before{ display: none; }
#header .usermenuArea ul.usermenuList .usermenuLanguage > a span,
#header .usermenuArea ul.usermenuList .usermenuLanguage > a img{ display: inline-block;}
#header .usermenuArea ul.usermenuList .usermenuLanguage > ul{}
#header .usermenuArea ul.usermenuList .usermenuLanguage > ul li{}
#header .usermenuArea ul.usermenuList .usermenuLanguage > ul li a{ padding:  5px 0;}
#header .usermenuArea ul.usermenuList .usermenuLanguage > ul li a img{ display: inline-block; margin: 0 5px 0 0; }

/*--- cart ---*/
#header .usermenuArea ul.usermenuList .usermenuCart{}
#header .usermenuArea ul.usermenuList .usermenuCart ul { width: 300px; right: -22px; left: auto;    z-index: 1;}
#header .usermenuArea ul.usermenuList .usermenuCart ul:before{ right: 30px; left: auto;}
#header .usermenuArea ul.usermenuList .usermenuCart aside:last-child { padding-bottom:0; margin-bottom:10px;}
#header .usermenuArea ul.usermenuList .usermenuCart .widgettitle { font-size: 20px; letter-spacing: 2px; text-transform: uppercase; font-style: normal; font-weight: 700; line-height: 160%;}
#header .usermenuArea ul.usermenuList .usermenuCart ul ul { display:block; position:static; margin: 0; padding: 0;  }

#header .usermenuArea ul.usermenuList .usermenuCart.sfHover .widget_shopping_cart{ display: block !important;} 
#header .usermenuArea ul.usermenuList .usermenuCart .hide_cart_widget_if_empty .cart_list{ color: #000; border: none;}

#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li {margin-bottom:10px; padding: 0; padding-left: 1.5em;}
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li a.remove {
	font-weight: 600;
	font-size: 14px;
	line-height: 12px;
	text-transform: none;
	/* margin-top: 13px; */
	padding: 0;
	top: 13px;}

#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li + li{ border-width: 1px 0 0 0; border-style: solid; border-color: rgba(255,255,255,0.1); }
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li a { color: #4c4841; font-weight: 600; font-size: 14px; line-height: 22px; text-transform: none; padding: 0;}
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li a:before{ display: none;}
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area ul li .quantity{ border: none; color: #000; font-size: 14px; font-weight: 400;}


#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons{ margin: 0 0 5px 0; }
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons a,
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons a:hover,
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons a:after,
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons a:hover:after { text-decoration:none !important; font-size:14px !important; }
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.buttons a { padding: 12px 15px; display: inline-block; float: none; margin-right: 10px; width: auto; letter-spacing: 0; color: #fff; background: #80b500; border: 0; border-radius: 5px;}
#header .usermenuArea ul.usermenuList .usermenuCart .widget_area p.total { margin: 0 0 10px 0; border-width: 1px 0 0 0; border-style: solid; border-color: rgba(255,255,255,0.4); color: #fff; z-index:1000 !important}
/*--- login ---*/
#header .usermenuArea ul.usermenuList .usermenuLogin{}

/*=== tpp menu =========================================================================================*/
.usermenuArea a{ font-size: 12px; }
.usermenuArea > ul{ padding: 0; text-align: center; }
.usermenuArea > ul > li{ list-style-type: none; display: inline-block; position: relative; vertical-align: top;}
.usermenuArea > ul > li > a{ display: block; height: 45px; line-height: 45px; color: #fff; margin: 0; padding: 0 10px; color: #fff; letter-spacing: 1px; display: block; float: left;  font-size: 12px; position: relative; text-decoration: none; }
.hideMenuDisplay .usermenuArea > ul > li > a{ color: #eb413e;}
.usermenuArea > ul > li > a span{color: #8c8c8c;}
.hideMenuDisplay .usermenuArea > ul > li > a:before{ background-color: #eb413e; }
.hideMenuDisplay .topMenuShow .usermenuArea > ul > li > a{ color: #fff;}
.hideMenuDisplay .topMenuShow .usermenuArea > ul > li > a:before{ background-color: #fff; }

.usermenuArea > ul > li > a{ position: relative; display: inline-block; color: #8c8c8c;}
.usermenuArea > ul > li > a:before{ content: ''; height: 1px; background-color: #fff; position: absolute; bottom: 15px; left: 50%; right: 50%;}
.usermenuArea > ul > li > a.cart_button:before {
    content: '\e872';
    font-family: fontello;
    position: relative;
    font-size: 15px;
    line-height: 45px;
    display: inline-block;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    height: auto !important;
	background: transparent;
}
.usermenuArea > ul > li > a .cart_total{
    display: none;
}
.usermenuArea > ul > li.sfHover > a:before,
.usermenuArea > ul > li > a:hover:before{ left: 10px; right: 10px; }
.usermenuArea > ul > li > ul{ display: none; position: absolute; left: 50%; top: 55px; padding: 20px; min-width: 150px;
	border-style: solid; border-width: 1px 1px 1px 1px; border-color: #eb413e; width: 180px; margin: 0 0 0 -105px}
.usermenuArea > ul > li > ul:before{ content: ''; display: block; position: absolute; left: 50%; top: -8px; width: 0; height: 0; margin: 0 0 0 -9px;  border-color: transparent transparent #fff transparent; border-style: solid; border-width: 0 9px 8px 9px; }
.usermenuArea > ul > li > ul:after{ content: ''; position: absolute; top: -11px; left: -1px; right: -1px; height: 10px; display: block; background-color: #fff; opacity: 0; }
.usermenuArea > ul > li > ul li{ list-style: none; text-align: left; position: relative; display: block; }
.usermenuArea > ul > li > ul li a{ margin: 0; padding: 7px 0; display: inline-block; white-space: nowrap; position: relative;}
.usermenuArea > ul > li > ul li a:before{     margin-right: 5px;}
.usermenuArea > ul > li > ul li.sfHover > a:before,
.usermenuArea > ul > li > ul li a:hover:before{ left: 0%; right: 0%; }

.usermenuArea > ul > li > ul li.menu-item-has-children{ padding: 0 15px 0 0; }
.usermenuArea > ul > li > ul li.menu-item-has-children:after{ content: '\e84f'; font-family: "fontello"; text-align: center; width: 10px; height: 10px; line-height: 10px; position: absolute; right: 0; top: 50%; display: block; margin: -5px 0 0 0;  font-size: 12px; }

.usermenuArea > ul > li > ul > li ul{ display: none; position: absolute; left: 100%; top: -9px; border-style: solid; border-width: 1px; padding: 10px 15px; margin: 0 0 0 15px;}



/*--- style1 ---*/
.menuStyle1 #header ul > li > ul{  border: 1px solid #ddd; top: 44px; background-color: #fff; text-shadow: none; width: 100%;}
.menuStyle1 #header ul > li > ul li a{ color: #8c8c8c;
font-size: 10px;
text-transform: uppercase;
font-weight: 600;}
.menuStyle1 #header ul > li > ul li a:before{ background-color: #fff; }
.menuStyle1 #header ul > li > ul li.sfHover > a,
.menuStyle1 #header ul > li > ul li a:hover{ color: #fff;}


.menuStyle1 #header ul > li > ul li.sfHover > a:before{ width: 100%; }

.menuStyle1 #header ul > li > ul li.menu-item-has-children:after{ color: #fff; }
.menuStyle1 #header ul > li > ul > li ul{ margin: 0 0 0 25px; top: -8px;}


/*--- style2 ---*/
.menuStyle2 #header ul > li > ul{ background-color: #fff;  top: 55px; }
.menuStyle2 #header ul > li > ul li a{ color: #4c4841;}
.menuStyle2 #header ul > li > ul li a:before{ background-color: #eb413e; }
.menuStyle2 #header ul > li > ul li.sfHover > a,
.menuStyle2 #header ul > li > ul li a:hover{ color: #eb413e;}
.menuStyle2 #header ul > li > ul li.menu-item-has-children:after{ color: #4c4841; }
.menuStyle2 #header ul > li > ul > li ul{ background-color: #fff; border-color: #eb413e; top: -8px; }


.hideMenuDisplay .wrapTopMenu { height: 0; }
.hideMenuDisplay .wrapTopMenu .topMenu { height: 0; overflow: hidden;}
.hideMenuDisplay .topMenuShow .wrapTopMenu .topMenu { height: auto; overflow: visible; }
.hideMenuDisplay .wrapTopMenu .topMenu > ul > li > a { line-height: 16px; height: 16px; opacity: 0;}
.hideMenuDisplay .topMenuShow .wrapTopMenu { min-height: 45px; }
.hideMenuDisplay .topMenuShow .wrapTopMenu .topMenu > ul > li > a{ line-height: 45px; height: 45px; opacity: 1; font-weight: 600 ;}