/*****************************************************************************
Project name: Anfal Salts
URL: www.anfalsalts.com
Website type: Custom responsive website design and development
Designed & Developed by: Fifer Communications. www.fifercommunications.com
Website live year: May, 2024
*****/

/* @media(max-width: 600px){ */
  @media only screen and (max-width: 600px) and (min-width: 250px) {
    /* Anfal below header video section styles */
    .video-content {
      padding: 0 50px 0px 50px;
      font-size: 1.125rem;
    }
  
    .video-content h1 {
      /* font-size: 3.375rem;
      line-height: 3.375rem; */
      font-size: 5rem;
      line-height: 5rem;
      margin-bottom: 10px;
    }
  
    .video-content p {
      /* font-size: 1.125rem; */
      font-size: 1.3rem;
    }
    /* End Anfal below header video section styles */
  
    /* Anfal products section start */
    .product-section {
      width: 100%;
    }
    .product-section h2 {
      text-align: center;
      font-size: 2.3rem;
      line-height: 2.8rem;
    }
  
    .product-section p {
      font-size: 1rem;
      text-align: center;
      padding-bottom: 3rem;
    }
    .product-card-container {
      max-width: 100%;
    }
  
    .product-card {
      /*flex-basis: calc(33.333% - 20px);  Adjust the spacing between cards */
      flex-basis: 100%;
    }
  
    .product-card img {
      width: 100%;
      border-radius: 0 60px 0px 60px;
    }
    /* Anfal products section end */
  
    /* Anfal partners section start */
  
    .partner-heading {
      font-size: 3.375rem;
      line-height: 3.375rem;
    }
    .partner-title {
      font-size: 2.4rem;
      line-height: 3rem;
    }
  
    .partner-subtitle {
      font-size: 20px;
    }
  
    .partner-description {
      font-size: 15px;
    }
    /* Anfal partners section end */
   
    /* Pink salt lifestyle styles start */
    .salt-container {
      max-width: 100%;
      margin: 0 auto;
      /* padding: 0 20px; */
    }
    
    .salt-container h2 {
        
     font-size: 2.5rem;
     line-height: 3rem;
        
    }
    
    .salt {
      width: 100%;
      margin: 0 2rem 20px 2rem;
      border-radius: 0 60px 0px 60px;
      
    }
    .salts {
    
      padding: 30px 0;
    }
    
    .salt-container .text-color {
     padding: 0px 40px 0px 40px;
    }
    /* Pink salt lifestyle styles end */

    /* Sustainable sourcing start */
    .sourcing-container {
      max-width: 100%;
      margin: 0 auto;
      
    }

    .sourcing {
      /* width: calc(50.50% - 20px); */
      width: 100%;
      margin-bottom: 40px;
      padding: 30px;
      text-align: center;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .sourcing-container h2 {
      font-size: 3rem;
    line-height: 3.2rem;
    font-weight: normal;
      padding: 1rem 2rem;
    }

    .sourcing-container .sourcing-text-color {
      text-align: center;
      padding: 0px 50px 0px 50px;
    }

    .sourcing h3 {
      font-size: 2rem;
      margin-bottom: 15px;
  }

  .sourcings {
    padding-top: 30px;
    padding-bottom: 0;
}
  /* Sustainable sourcing end */

  /* Bounty section styles start */
   
  .bounty-card-container {
    justify-content: center;
  }

  .bounty-card {
    flex-basis: 100%; /* Make cards take full width */
    max-width: 100%; /* Ensure cards do not exceed the container width */
    text-align: center; /* Center-align the text for mobile */
  }

  .bounty-card img {
    width: 250px; /* Adjust the image size for mobile */
    height: 250px;
    /* If we want the Anfal images to be fully responsive instead of fixed size. */
    /* max-width: 100%; */
    /* height: auto; */
  }

  .bounty-section h2 {
    text-align: center;
    font-size: 3rem;
    line-height: 3.2rem;
    
}

.bounty-card h3 {
  font-size: 24px;
}

.bounty-section {
  background-image: url(../images/bounty-section-bg.jpg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  padding: 2rem 0;
}

.bounty-section p {
  font-size: 24px;
  padding-bottom: 1rem;
  color: #0d1323;
  text-align: center;
}

  
  /* Bounty section styles end */

   /* History section styles start */
   
   .history-card-container {
    justify-content: center;
  }

  .history-card {
    flex-basis: 100%; /* Make cards take full width */
    max-width: 100%; /* Ensure cards do not exceed the container width */
    text-align: center; /* Center-align the text for mobile */
  }

  
  
   .history-section {
    background-image: url(../images/history-section-bg-1-mobile.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  } 
  
  .history-section h2 {
    text-align: center;
    font-size: 2.5rem;
    line-height: 3rem;
    color: #9c7c4a;
    
}

.history-section p {
  text-align: center;
  font-size: 16px;
  padding-bottom: 2rem;
}

  /* History section styles end */

  /* Start Feed additive styles */
  .feed-additive-content h2 {
    
    text-align: left;
    font-size: 2.5rem;
    line-height: 3rem;
    font-weight: normal;
    padding-bottom: 1rem;
}

.feed-additive-content h5 {
    
    text-align: left;
    font-size: 23px;
    line-height: 1.5rem;
    padding-bottom: 0.5rem;
}


.feed-additive-content h3 {
    color: #0d1323;
    text-align: left;
    font-size: 24px;
    line-height: 1.8rem;
    
}

.feed-additive-content h5 {
    text-align: left;
    font-size: 24px;
    line-height: 1.8rem;
}

/* .feed-additive-section {
  padding: 2rem;
} */
  /* End Feed additive styles */

  .timeline-header__title {
    font-size: 38px;
    
}

.nav-link a {
 
  font-size: 24px;
  
}
.navbar {
  
  padding: 1em 1em;
}

  } /*Mobile 600 styles bracket*/

/* Wellness section styles 2 start */
@media only screen and (max-width: 992px) {
  .himalayan-content {
    
    height: 50vh; /* Adjust as needed */
    
  }
  .himalayans-section h2 {
      font-size: 3rem; /* even smaller for tablets */
      line-height: 4rem;

  }

  .himalayans-section p, .himalayans-section .wellness-section-text {
      padding: 0 20px; /* smaller padding for smaller screens */
      font-size: 1rem;
  }

  .himalayans-section h6 {
    
    font-size: 2.5rem;
    line-height: 3rem;
    
    /* padding-bottom: 1rem; */
}

/* header image and tagline */
.header {
  width: 100%;
  background-image: url(../images/anfal_salt_bg_m_t.jpg);
  
}

.header-punchline {
  position: absolute;
  width: 100%;
  left: 50%;
  top: 50%;
  text-align: center;
  padding: 0;
 /* color: bisque; */
 color: white;

}
/* end header iamge and tagline */

  /* Adjust other elements as needed */
}

/* Wellness section styles 2 end */

  /* Anfal products section tablet/ipad */
  
  @media only screen and (max-width: 992px) and (min-width: 601px) {
    .video-content h1 {
      font-size: 5.5rem;
      line-height: 5rem;
      margin-bottom: 10px;
    }
  
    .product-card img {
      width: 100%;
      border-radius: 0 80px 0px 80px;
    }
    .product-card {
      /*flex-basis: calc(33.333% - 20px);  Adjust the spacing between cards */
      flex-basis: 100%;
    }
  
    .partner-heading {
      font-size: 5.5rem;
      line-height: 5rem;
    }

    /* Pink salt lifestyle styles start */
    .salt-container {
      margin: 0 2rem;
      
    }

    .salt {
      border-radius: 0 80px 0px 80px;
      
    }

    .salt-container h2 {
     /* max-width: 100%;    */
     font-size: 70px;
     line-height: 5rem;
        
    }

    .salt-container .text-color {
      padding: 0px 20px 0px 20px;
     }

    
    /* Pink salt lifestyle styles end */
    /* Sustainable sourcing start */
    .sourcing-container .sourcing-text-color {
      text-align: center;
      padding: 0px 50px 0px 50px;
    }
    /* Sustainable sourcing end */

    /* Feed additive tablet styles start */
    .feed-additive-content h2 {
      text-align: left;
      font-size: 52px;
      line-height: 4rem;     
  }

  .feed-additive-content h5 {
    text-align: left;
    font-size: 24px;
    line-height: 1.8rem;
}

  /* .feed-additive-section {
  padding: 2rem;
} */
    /* Feed additive tablet styles end */
  }
  




 
