/* ==========================================================================
   Media Queries
   ========================================================================== */

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

	
}

@media screen and (max-width: 400px) { 
  @-ms-viewport {
    width: 320px;
  }
	.best-for-gift { left: -15px !important; top:15px !important;}
} 

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

}

@media (max-width: 767px) { 
	.recipe-recommed-wrap { text-align: left;}
	.recipe-thumb { margin-bottom: 30px}
	.best-selling-wrap ul li { width: 49%}
	.sausages-home img { margin-bottom: 20px;}
	.sausages-home h4, .sausages-home p { text-align: center;}
	.best-for-gift { left: 15px; top:20px;}
	.navbarwrap { background: #ffffff;-webkit-box-shadow: 0 6px 0 0 rgba(0,0,0,.2); box-shadow: 0 6px 0 0 rgba(0,0,0,.2); min-height: 70px }
	.navbarwrap  li  a { color: #4b0003; text-transform: uppercase;}
	.navbarwrap  li  a:hover { background: #4b0003; color: #ffffff}
	.navbar-brand { padding: 5px; margin: 0}
}

@media (min-width: 768px) and (max-width: 991px) {
	.best-selling-wrap ul li { width: 23%}
	.best-selling-wrap ul li:last-child { display: none;}
	.navbarwrap li a { background: #4b0003; color: #ffffff; text-transform: uppercase; padding-left: 10px; padding-right: 10px; font-size: 13px}
	.navbarwrap li a:hover, .navbarwrap li a:focus { background: url(../img/hover-triangle.png) 50% 100% no-repeat, #750609;}
	.navbarwrap {  background: #4b0003; border: none; }
	.navbarwrap {  background: #4b0003; border: none; margin-bottom: 50px }
	.navbarwrap li:first-child { display: none;}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.container { max-width: 1000px}
	.best-selling-wrap ul li { width: 18%}
	.navbarwrap li a { background: #4b0003; color: #ffffff; text-transform: uppercase;}
	.navbarwrap li a:hover, .navbarwrap li a:focus { background: url(../img/hover-triangle.png) 50% 100% no-repeat, #750609;}
	.navbarwrap {  background: #4b0003; border: none; }
	.navbarwrap {  background: #4b0003; border: none; margin-bottom: 80px }
}

@media (min-width: 1200px) {
	.container { max-width: 1000px}
	.best-selling-wrap ul li { width: 19%}
	.navbarwrap li a { background: #4b0003; color: #ffffff; text-transform: uppercase;}
	.navbarwrap li a:hover, .navbarwrap li a:focus { background: url(../img/hover-triangle.png) 50% 100% no-repeat, #750609;}
	.navbarwrap {  background: #4b0003; border: none; margin-bottom: 80px }
}