.back-to-account {
  width: 100%;
  background-color: mr-blue;
}
.pure-pigments-hero {
  background-color: #f6f6f6;
}
.pure-pigments-hero .inner-wrap {
  padding: 2em 5%;
  padding-bottom: 17em;
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .pure-pigments-hero .inner-wrap {
    padding-left: 20%;
    padding-right: 20%;
  }
}
@media only screen and (min-width: 760px) and (max-width: 959px) {
  .pure-pigments-hero .inner-wrap {
    padding: 5em 5.5%;
  }
}
@media only screen and (min-width: 960px) {
  .pure-pigments-hero .inner-wrap {
    padding: 5em 10.25%;
  }
}
.pure-pigment-section-two .inner-wrap {
  padding: 2.5em 7%;
}
@media only screen and (min-width: 0px) and (max-width: 559px) {
  .pure-pigment-section-two .pp-cta {
    text-align: center;
  }
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .pure-pigment-section-two .image-wrap {
    padding: 0 15%;
  }
  .pure-pigment-section-two .pp-cta {
    text-align: center;
  }
}
.pure-pigment-section-three .inner-wrap {
  padding: 2em 5%;
}
.pure-pigment-section-three .image-wrap {
  padding: 0 3%;
  padding-bottom: 1.5em;
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .pure-pigment-section-three .inner-wrap {
    padding: 2em 8%;
  }
}
@media only screen and (min-width: 760px) and (max-width: 959px) {
  .pure-pigment-section-three .inner-wrap {
    padding: 2em 15%;
  }
}
@media only screen and (min-width: 960px) {
  .pure-pigment-section-three .inner-wrap {
    padding: 2em 22%;
  }
}
.value-quote-2 {
  padding: 1em 0;
}
.value-quote-2 .row {
  padding: 2em 0;
}
.value-quote-2 img {
  width: 4.5em;
  height: 4.5em;
  margin-top: 1em;
}
@media only screen and (min-width: 0px) and (max-width: 559px) {
  .value-quote-2 p {
    padding: 0 5%;
  }
  .value-quote-2 .quote-text {
    padding: 0.5em 5%;
  }
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .value-quote-2 p {
    padding: 0 5%;
  }
  .value-quote-2 .quote-text {
    padding: 0.5em 13%;
  }
}
@media only screen and (min-width: 760px) and (max-width: 959px) {
  .value-quote-2 p {
    padding: 0 5%;
  }
  .value-quote-2 .quote-text {
    padding: 0.5em 19%;
  }
}
@media only screen and (min-width: 960px) {
  .value-quote-2 p {
    padding: 0 5%;
  }
  .value-quote-2 .quote-text {
    padding: 0.5em 25%;
  }
}
.pp-video-gallery .inner-wrap {
  padding: 2em 0;
}
.pp-video-gallery .intro {
  padding: 0 5%;
}
.pp-video-gallery .videos .video-ctas {
  padding-bottom: 2em;
}
.pp-video-gallery .videos .video-ctas .video-cta {
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 0 1.5em;
  width: 20em;
  margin-top: 2em;
  text-align: center;
}
.pp-video-gallery .videos .video-ctas .video-cta .video-mark {
  position: absolute;
  top: -2em;
  left: 0;
}
.pp-video-gallery .videos .video-ctas .video-cta img {
  display: block;
  width: 100%;
  margin-bottom: 0.5em;
  border: 3px solid color-ui-4;
}
.pp-video-gallery .videos .video-ctas .video-cta .icon-play {
  position: absolute;
  top: 1em;
  left: 50%;
  margin-left: -0.75em;
}
.pp-video-gallery .videos .video-ctas .video-cta.selected img {
  border: 3px solid #3a2d4a;
}
.pp-video-gallery .videos .videos-wrap {
  position: relative;
  background-color: #fff;
  padding: 1.5em 0;
}
.pp-video-gallery .videos .videos-wrap:before {
  content: '';
  position: absolute;
  top: -4em;
  left: 50%;
  height: 0;
  width: 0;
  border: 2em solid transparent;
  border-left-width: 1.5em;
  border-right-width: 1.5em;
  border-bottom-color: #fff;
}
@media only screen and (min-width: 0px) and (max-width: 559px) {
  .pp-video-gallery .videos .video-ctas .video-cta {
    width: 10em;
    margin: 0 0.5em;
    margin-top: 2em;
  }
  .pp-video-gallery .videos .video-ctas .video-cta .icon-play {
    top: 0.5em;
  }
  .pp-video-gallery .videos-wrap.one:before {
    margin-left: -7em;
  }
  .pp-video-gallery .videos-wrap.two:before {
    margin-left: 4em;
  }
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .pp-video-gallery .videos .video-ctas .video-cta {
    margin-left: 1em;
    margin-right: 1em;
    width: 18em;
  }
  .pp-video-gallery .videos-wrap.one:before {
    margin-left: -11.5em;
  }
  .pp-video-gallery .videos-wrap.two:before {
    margin-left: 8.5em;
  }
}
@media only screen and (min-width: 760px) {
  .pp-video-gallery .videos-wrap .multi-video-player .video-wrap {
    width: 23em;
    margin: 0 1.5em;
  }
  .pp-video-gallery .videos-wrap.one:before {
    margin-left: -13em;
  }
  .pp-video-gallery .videos-wrap.two:before {
    margin-left: 10em;
  }
}
@media only screen and (min-width: 960px) {
  .pp-video-gallery .intro {
    padding: 0 18%;
  }
}
.home-hair-color-kit .inner-wrap {
  padding: 2em 0;
}
.home-hair-color-kit .title-wrap {
  padding: 0 5%;
}
.home-hair-color-kit .image-wrap {
  padding: 0 7%;
}
.home-hair-color-kit .mr-btn .btn-caret {
  display: inline;
  margin-left: 5px;
}
.home-hair-color-kit .mr-btn .btn-caret::before {
  font-weight: bold;
}
.home-hair-color-kit .absolute-tags {
  position: relative;
}
.home-hair-color-kit .tag {
  background-color: rgba(255,255,255,0.95);
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  width: 7%;
  height: 9%;
  text-align: center;
  line-height: 190%;
  position: absolute;
}
.home-hair-color-kit .tag.grey-shadow {
  -webkit-box-shadow: 0.5px 0.5px 20px #e0e0e0;
  -moz-box-shadow: 0.5px 0.5px 20px #e0e0e0;
  -o-box-shadow: 0.5px 0.5px 20px #e0e0e0;
  box-shadow: 0.5px 0.5px 20px #e0e0e0;
}
.home-hair-color-kit .a-tag {
  top: 24%;
  left: 13%;
}
.home-hair-color-kit .b-tag {
  top: 80%;
  left: 80%;
}
.home-hair-color-kit .c-tag {
  top: 80%;
  left: 55%;
}
.home-hair-color-kit .d-tag {
  top: 60%;
  left: 30%;
}
.home-hair-color-kit .e-tag {
  top: 45%;
  left: 48%;
}
.home-hair-color-kit .f-tag {
  top: 68%;
  left: 12%;
}
.home-hair-color-kit .g-tag {
  top: 63%;
  left: 22%;
}
.home-hair-color-kit .h-tag {
  top: 61%;
  left: 75%;
}
@media only screen and (min-width: 560px) and (max-width: 759px) {
  .home-hair-color-kit .tag {
    width: 5%;
    height: 8%;
    line-height: 240%;
  }
  .home-hair-color-kit .a-tag {
    top: 22%;
    left: 13%;
  }
  .home-hair-color-kit .b-tag {
    top: 83%;
    left: 78%;
  }
  .home-hair-color-kit .c-tag {
    top: 83%;
    left: 55%;
  }
  .home-hair-color-kit .d-tag {
    top: 60%;
    left: 31%;
  }
  .home-hair-color-kit .e-tag {
    top: 42%;
    left: 49%;
  }
  .home-hair-color-kit .f-tag {
    top: 68%;
    left: 12%;
  }
  .home-hair-color-kit .g-tag {
    top: 66%;
    left: 22%;
  }
  .home-hair-color-kit .h-tag {
    top: 62%;
    left: 75%;
  }
}
@media only screen and (min-width: 760px) and (max-width: 959px) {
  .home-hair-color-kit .title-wrap {
    padding: 0 12%;
  }
  .home-hair-color-kit .tag {
    width: 4%;
    height: 6.5%;
    line-height: 265%;
  }
  .home-hair-color-kit .a-tag {
    top: 22%;
    left: 13%;
  }
  .home-hair-color-kit .b-tag {
    top: 83%;
    left: 78%;
  }
  .home-hair-color-kit .c-tag {
    top: 83%;
    left: 55%;
  }
  .home-hair-color-kit .d-tag {
    top: 60%;
    left: 31%;
  }
  .home-hair-color-kit .e-tag {
    top: 42%;
    left: 49%;
  }
  .home-hair-color-kit .f-tag {
    top: 68%;
    left: 12%;
  }
  .home-hair-color-kit .g-tag {
    top: 66%;
    left: 22%;
  }
  .home-hair-color-kit .h-tag {
    top: 62%;
    left: 75%;
  }
}
@media only screen and (min-width: 960px) {
  .home-hair-color-kit .title-wrap {
    padding: 0 20%;
  }
  .home-hair-color-kit .tag {
    width: 3%;
    height: 6%;
    line-height: 250%;
  }
  .home-hair-color-kit .a-tag {
    top: 23%;
    left: 19%;
  }
  .home-hair-color-kit .b-tag {
    top: 90%;
    left: 76%;
  }
  .home-hair-color-kit .c-tag {
    top: 89%;
    left: 53%;
  }
  .home-hair-color-kit .d-tag {
    top: 65%;
    left: 33%;
  }
  .home-hair-color-kit .e-tag {
    top: 41%;
    left: 48%;
  }
  .home-hair-color-kit .f-tag {
    top: 71%;
    left: 16%;
  }
  .home-hair-color-kit .g-tag {
    top: 72%;
    left: 25%;
  }
  .home-hair-color-kit .h-tag {
    top: 64%;
    left: 72%;
  }
}
