/*-=======================================
================ 1350px  =================
=======================================-*/

@media(max-width: 1350px) {
   
}

/*-=======================================
============= END 1350px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1275px  =================
=======================================-*/

@media(max-width: 1275px) {
   .new-products #new-products-greeting h1 {
      font-size: 3.5svh;
   }

   .new-products #new-products-greeting h2 {
      font-size: 2.75svh;
   }

   .new-products #new-products-greeting p {
      font-size: 2.15svh;
   }
}

/*-=======================================
============= END 1275px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1250px  =================
=======================================-*/

@media(max-width: 1250px) {
   
}

/*-=======================================
============= END 1250px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1235px  =================
=======================================-*/

@media(max-width:1235px){
   .home-boxes p {
      font-size: 1.1rem;
   }

   .new-products .hero-wrapper {
      padding: 15px;
   }
}

/*-=======================================
============= END 1235px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1160px  =================
=======================================-*/

@media(max-width:1160px){
   .featured-recipe p {
      font-size: 1.2rem;
   }
}

/*-=======================================
============= END 1160px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1075px  =================
=======================================-*/

@media(max-width:1075px){
   .our-family #allcontent #intro-text p {
      font-size: 1.2rem;
   }
}

/*-=======================================
============= END 1075px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1050px  =================
=======================================-*/

@media(max-width:1050px){
   .departments .departments-box h3 {
      font-size: 1.25rem;
   }

   .departments .departments-box p {
      font-size: 1.1rem;
   }

   .contact .mobile-hide {
      display: none;
   }

   .contact .contact-boxes .email {
      font-size: 1.5rem;
   }
}

/*-=======================================
============= END 1050px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1025px  =================
=======================================-*/

@media(max-width:1025px){
   
}

/*-=======================================
============= END 1025px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 1000px  =================
=======================================-*/

@media(max-width:1000px){
   .btn {
      visibility: hidden;
   }
}

/*-=======================================
============= END 1000px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 991px  ==================
=======================================-*/

@media(max-width:991px){
   /* NAVIGATION */
   .secondary-nav {
      display: none;
   }

   header {
      padding: 20px;
   }

   header .noshow {
      display: initial;
   }

   header .logo img {
      max-width: 250px;
   }

   header label {
      display: initial;
   }

   header .navbar {
      position: absolute;
      top: 100%; left: 0; right: 0;
      background: #fff;
      border-top: 1px solid rgba(0,0,0,.1);
      display: none;
   }

   header .navbar ul li {
      width: 100%;
   }

   header .navbar ul li ul {
      position: relative;
      width: 100%;
   }

   header .navbar ul li ul li {
      background: #eee;
   }

   header .navbar ul li ul li ul {
      width: 100%;
      left: 0;
   }

   #menu-bar:checked ~ .navbar {
      display: initial;
   }
   /* END NAVIGATION */
}

/*-=======================================
============ END 991px  ==================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 980px  ==================
=======================================-*/

/* NOT USED
@media(max-width:980px){
   .home-boxes {
      width: 30%;
   }
}
*/

/*-=======================================
============== END 980px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 925px  ==================
=======================================-*/

@media(max-width: 925px) {
   .departments .hero-wrapper h1 {
      font-size: 2rem;
   }

   .our-family #allcontent #intro-text p {
      font-size: 1rem;
   }
}

/*-=======================================
============== END 925px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 915px  ==================
=======================================-*/

@media(max-width: 915px) {
   .featured-recipe .box {
      width: 45%;
   }

   .featured-recipe h1 {
      font-size: 2.1rem;
   }
}

/*-=======================================
============== END 915px  ================
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 900px  ==================
=======================================-*/

@media(max-width: 900px) {
   
   /* HOME PAGE SLIDESHOW */
   .swiper-button-next {
      margin-right: 20px;
   }

   .swiper-button-prev {
      margin-left: 20px;
   }

   .img_overlay h2 {
      font-size: 1.5rem;
   }

   .img_overlay p.slider-price {
      font-size: 2.5rem;
   }

   .img_overlay p.slider-tag {
      font-size: 1.5rem;
   }

   .img_overlay a {
      text-decoration: none;
      color: #fff;
      padding: 0.6rem 1rem;
      display: inline-block;
      margin-top: 2rem;
      border-radius: 4px;
      transition: all 0.3s ease-in-out;
   }
   /* END HOME PAGE SLIDESHOW */

   .greetings .store1 .store-hours {
      font-size: 1.5rem;
   }

   .home-boxes {
      width: 47%;
   }

   .home-boxes h3 {
      font-size: 1.5rem;
   }
}

/*-=======================================
=============== END 900px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 855px  ===================
=======================================-*/

@media(max-width: 855px) {

   /* UNUSED 
   .greetings .greetings-left h2 {
      
   }
   */

   .greetings .store1 .phone, .greetings .store2 .phone {
      font-size: 3.25svh;
   }

   .flexcontainment img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 65%;
   }
}

/*-=======================================
=============== END 855px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 840px  ===================
=======================================-*/
   
@media(max-width: 840px) {
  .our-family #allcontent #intro-text p {
      font-size: 1.1rem;
   }

   .services h1 {
      font-size: 2.25rem;
   }

   .services p {
      font-size: 1.5rem;
   }

   footer .mobile-hide {
      display: none;
   }

   footer #footer-savings {
      margin-left: 10px;
   }
}

/*-=======================================
=============== END 840px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 800px  ===================
=======================================-*/
   
@media(max-width: 800px) {
   
}

/*-=======================================
=============== END 800px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 768px  ===================
=======================================-*/

@media(max-width: 768px) {

   .swiper-button-next {
      margin-right: 10px;
   }

   .swiper-button-prev {
      margin-left: 10px;
   }

   .img_overlay h2 {
      font-size: 1.25rem;
   }

   .img_overlay p.slider-price {
      font-size: 2rem;
   }

   .img_overlay p.slider-tag {
      font-size: 1.25svh;
   }

   .departments .departments-box {
      width: 48%;
   }
}

/*-=======================================
=============== END 768px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 749px  ===================
=======================================-*/

@media(max-width: 749px) {
   .greetings .store1 .hidden, .greetings .store2 .hidden {
      display: none;
   }

   .contact .hero h1 {
      font-size: 1.85rem;
   } 

   .contact .hero #contact-intro {
      font-size: 1.25rem;
   }
}

/*-=======================================
=============== END 749px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 740px  ===================
=======================================-*/

@media(max-width: 740px) {
   .our-family #allcontent #intro-text p {
      font-size: .9rem;
   }
}

/*-=======================================
=============== END 740px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 730px  ===================
=======================================-*/

@media(max-width: 730px) {
   .our-family #allcontent .boxes {
      width: 85%;
      margin: 10px auto;
   }

   .our-family #allcontent .boxes p {
      font-size: 1.2rem;
   }

   .our-family #topbrand img {
      width: 60%;
   }

   .our-family #topbrand h2 {
      font-size: 1.25rem;
      line-height: 2rem;
   }
}

/*-=======================================
=============== END 730px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
================= 700px  =================
=======================================-*/

@media(max-width: 700px) {
   .contact .contact-boxes, .contact .map {
      width: 75%;
   }

   .contact .contact-container {
      flex-direction: column;
      align-content: center;
   }

   p.slider-tag {
      display: none;
   }

}

/*-=======================================
=============== END 700px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 680px ===================
=======================================-*/

@media(max-width: 680px) {
   .greetings .greetings-left h1 {
      font-size: 1.3rem;
   }

   .greetings .greetings-left h2 {
      font-size: 1.1rem;
      line-height: 1.2rem;
   }

   .greetings-left, .store1, .store2 {
      width: 28%;
   }

   .greetings .store1 p.phone, .greetings .store2 p.phone {
      font-size: 1.45rem;
   }

   .greetings .store1 p.store-hours, .greetings .store2 p.store-hours {
/*      font-size: 1rem;*/
      line-height: 1.4rem;
   }

   .services #flex-container ol {
      font-size: 1.4rem;
   }
}

/*-=======================================
=============== END 680px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 675px  ===============
=======================================-*/

@media(max-width: 675px) {
   .departments .departments-box p {
      font-size: .95rem;
   }

}

/*-=======================================
=============== END 675px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 670px  ===============
=======================================-*/

@media(max-width: 670px) {
   .img_overlay a {
      margin-top: 0;
   }

   .new-products .hero-wrapper {
      flex-direction: column-reverse;
      align-items: center;
   }

   .hero-wrapper #new-products-greeting {
      width: 90%;
      margin-top: 20px;
   }

   .hero-wrapper #new-products-hero-image {
      width: 65%;
      margin-top: 15px;
   }

   .hero-wrapper #new-products-hero-image img {
      width: 100%;
   }

   .hero-wrapper #new-products-greeting h1 {
      font-size: 1.5rem;
   }

   .hero-wrapper #new-products-greeting h2 {
      font-size: 1.2rem;
   }

   .hero-wrapper #new-products-greeting p {
      font-size: 1.1rem;
   }
}

/*-=======================================
=============== END 670px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 650px  ===============
=======================================-*/

@media(max-width: 650px) {
   .greetings {
      flex-direction: column;
      align-items: center;
   }

   .greetings .greetings-left, .greetings .store1, .greetings .store2 {
      width: 95%;
   }

   .greetings .greetings-left h1 {
      font-size: 1.75rem;
   }

   .greetings .greetings-left h2 {
      margin-top: 1px;
   }

   .greetings .store1 p.store-hours {
      font-size: 1.7rem;
      line-height: 1.7rem;
   }

   .about #hero h1 {
      font-size: 2rem;
   }

   .about #hero h2 {
      font-size: 1.5rem;
   }

   .about #content h3 {
      line-height: 1.75rem;
      font-size: 1.3rem;
   }

   .about #content p {
      font-size: 1.2rem;
   }
}

/*-=======================================
=============== END 650px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 625px  ===============
=======================================-*/

@media(max-width: 625px) {
   #news-banner p {
      font-size: 1.1rem;
   }

   .featured-recipe h1 {
      font-size: 1.8rem;
      width: 90%;
      display: block;
      margin: 10px auto;
   }

   .featured-recipe p {
      font-size: 1.15rem;
   }
}

/*-=======================================
=============== END 625px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== 600px  ===============
=======================================-*/

@media(max-width: 600px) {
   .departments .hero-wrapper h1 {
      font-size: 1.5rem;
      padding: 0 10px;
   }
}

/*-=======================================
=============== END 600px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
================ 580px ===================
=======================================-*/

@media(max-width: 580px) {
   .new-products-boxes {
      max-width: 75%;
   }

   .services h1 {
      font-size: 2.25rem;
   }

   .services h2 {
      font-size: 2rem;
   }

   .services #flex-container ol {
      font-size: 1.4rem;
   }

   .services #flex-container .box {
      width: 47%;
   }
}

/*-=======================================
=============== END 58opx  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 560px  ===============
=======================================-*/

@media(max-width: 560px) {
   .departments .departments-box {
      width: 96%;
   }

   .departments #content-boxes {
      justify-content: space-around;
   }
}

/*-=======================================
=============== END 560px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
================= 550px ==================
=======================================-*/

@media(max-width: 550px) {
   .featured-recipe #flex-container {
      flex-direction: column-reverse;
      align-items: center;
   }

   .featured-recipe #flex-container .box.right {
      width: 50%;
   }

   .featured-recipe #flex-container .box.left {
      width: 97%;
   }

   #new-products-greeting a.button {
      font-size: 1.25rem;
   }
}

/*-=======================================
=============== END 550px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 535px  ===============
=======================================-*/

@media(max-width: 535px) {
   .home-boxes {
      width: 97%;
   }

   .home-contentboxes {
      justify-content: center;
   }
}

/*-=======================================
=============== END 535x  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
================= 525px ==================
=======================================-*/

@media(max-width: 525px) {
   #new-products-content-boxes .new-products-boxes {
      width: 47%;
   }
}

/*-=======================================
=============== END 525px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 475px  ===============
=======================================-*/

@media(max-width: 475px) {
   .services h1 {
      font-size: 1.75rem;
      line-height: 2rem;
   }

   .services p {
      font-size: 1.3rem;
   }

   .services #flex-container ol {
      font-size: 1.15rem;
   }

   footer #footer-container {
      font-size: .7rem;
   }

   footer #footer-container h4 {
      font-size: .8rem;
   }
}

/*-=======================================
=============== END 475px  ===============
=======================================-*/

/*-======================================================-*/

/*-=======================================
=============== END 450px  ===============
=======================================-*/

@media(max-width: 450px) {
   
}

/*-=======================================
=============== END 450px  ===============
=======================================-*/

/*-======================================================-*/

