/******************************
REDDIWIP SPECIFIC COLORS
******************************/
/******************************
COLORS
******************************/
/******************************
REDDIWIP SPECIFIC COLORS
******************************/
/******************************
COLORS
******************************/
/******************************
REDDIWIP SPECIFIC COLORS
******************************/
/******************************
COLORS
******************************/
/******************************
REDDIWIP SPECIFIC COLORS
******************************/
/******************************
COLORS
******************************/
/*****************************************************
BEGIN FUNCTIONS
*****************************************************/
/*****************************************************
BEGIN FUNCTIONS
*****************************************************/
/*****************************************************
BEGIN EXTENDS
*****************************************************/
/*****************************************************
END EXTENDS
*****************************************************/
/* line 5, ../../sass/components/page.scss */
.cream-bg, .cream-bg.page {
  background-image: url("../../images/global/mobile/bg-cream.jpg") !important;
}
@media (min-width: 768px) {
  /* line 5, ../../sass/components/page.scss */
  .cream-bg, .cream-bg.page {
    background-image: url("../../images/global/bg-cream.jpg") !important;
  }
}
/* line 13, ../../sass/components/page.scss */
.cream-bg .category-description {
  padding: 60px 0;
  max-width: 721px;
  margin: 0 auto;
}
/* line 18, ../../sass/components/page.scss */
.cream-bg .category-description p {
  color: #002b60;
}
@media (min-width: 768px) {
  /* line 18, ../../sass/components/page.scss */
  .cream-bg .category-description p {
    color: #140601;
  }
}

/* line 28, ../../sass/components/page.scss */
.page.coffee-bg {
  background-color: #000000 !important;
  background-image: url("../../images/global/bg-coffee.png") !important;
  background-size: contain;
  background-position: 0 100px;
  background-repeat: no-repeat;
}
@media (max-width: 380px) {
  /* line 28, ../../sass/components/page.scss */
  .page.coffee-bg {
    background-position: 0 300px;
  }
}
/* line 39, ../../sass/components/page.scss */
.page.coffee-bg .product-category-page {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 527px;
}
@media (max-width: 767px) {
  /* line 39, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page {
    padding-top: 0;
    background-size: 100%;
    height: auto;
    background-position: 0 20px;
    background-repeat: no-repeat;
  }
}
@media (min-width: 768px) {
  /* line 39, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    background-position: 0 0;
  }
}
@media (max-width: 767px) {
  /* line 60, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page .category-hero {
    position: static;
    margin: 50px 0;
  }
}
@media (max-width: 767px) {
  /* line 67, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page .text-container {
    position: static;
    text-align: center;
  }
}
/* line 75, ../../sass/components/page.scss */
.page.coffee-bg .product-category-page .category-description p {
  color: white;
}
@media (max-width: 767px) {
  /* line 74, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page .category-description {
    margin-top: 40px;
  }
}
@media (min-width: 768px) {
  /* line 74, ../../sass/components/page.scss */
  .page.coffee-bg .product-category-page .category-description {
    width: 90%;
    max-width: 960px;
    margin: 50px auto 0;
  }
}

/* line 93, ../../sass/components/page.scss */
.cream-bg, .cream-bg.page {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* line 100, ../../sass/components/page.scss */
.cream-bg .category-description p, .coffee-bg .category-description p {
  font-size: 18px;
  font-weight: 500;
  padding: 0 30px;
  text-align: center;
}