.blog-view-wrapper {
  background-color: #fff3d7;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.blog-view-wrapper .BlogBtnsMobileContainer {
  display: -ms-flexbox;
  display: none;
  width: 85.5vw;
  margin-top: 3.66vw;
  z-index: 1;
  -webkit-align-items: flex-start;
  -webkit-box-align: flex-start;
  -ms-flex-align: flex-start;
  flex-direction: row;
  justify-content: end;
}
@media (max-width: 769px) {
  .blog-view-wrapper .BlogBtnsMobileContainer {
    display: flex;
  }
}
.blog-view-wrapper .BlogBtnsMobileContainer .RstAO {
  cursor: pointer;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACiSURBVHgB7ddRCoAgDAbgFR2h+2b37Q5mgS9iy6bLUf/3EKEiMhw/EgEAqBpKF3o/++wGw1a8h8RIxk3cZKjako7FisWK5tY8FfZcL+eIP6C/O2AL3DVhKxi49D9zMEeKzDcJQG/qF7y2ub6XJFJcAjVNEikugVoliZQ7PtIEMt8kAL1VXdQ3GuAfSVL7TlFPktp3imaSnPOa7xTzTQIAoGwHCsRdjr1rbQgAAAAASUVORK5CYII=);
  background-size: auto;
  background-size: cover;
  width: 9.66vw;
  height: 9.66vw;
}
.blog-view-wrapper .BlogBtnsMobileContainer .BtnsGroups {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (min-width: 769px) {
  .blog-view-wrapper .BlogBtnsMobileContainer {
    margin-top: 9.66vw;
  }
  .blog-view-wrapper .BlogBtnsMobileContainer .RstAO .BlogBtnsMobileContainer {
    display: none;
  }
}
.blog-view-wrapper .blog-btns-container {
  display: flex;
  flex-direction: row;
  margin-top: 2.38vw;
  margin-bottom: 2.38vw;
}
@media screen and (max-width: 768px) {
  .blog-view-wrapper .blog-btns-container {
    display: none;
  }
}
.blog-view-wrapper .blog-btns-mobile-container {
  display: flex;
  width: 85.5vw;
  margin-top: 9.66vw;
  margin-bottom: 7.5vw;
  z-index: 1;
  align-items: flex-start;
}
@media screen and (min-width: 769px) {
  .blog-view-wrapper .blog-btns-mobile-container {
    display: none;
  }
}
.blog-view-wrapper .blog-btns-mobile-container .btns-groups {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.blog-view-wrapper .blog-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  -moz-column-gap: 1.5vw;
       column-gap: 1.5vw;
}
@media screen and (max-width: 900px) {
  .blog-view-wrapper .blog-container {
    row-gap: 0vw;
  }
}
@media screen and (max-width: 768px) {
  .blog-view-wrapper .blog-container {
    grid-template-columns: 1fr;
    row-gap: 5rem;
  }
}
.blog-view-wrapper .view-more-button-container {
  margin-top: 2.98vw;
  margin-bottom: 7.14vw;
}
@media screen and (max-width: 768px) {
  .blog-view-wrapper .view-more-button-container {
    margin-top: 12vw;
    margin-bottom: 16.91vw;
  }
}

.blog-title {
  font-family: Roboto;
  font-style: normal;
  font-weight: 900;
  font-size: 1.55vw;
  line-height: 2.4vw;
  /* identical to box height, or 115% */
  text-transform: uppercase;
  color: #7c61a7;
  margin-top: 5.95vw;
}
@media screen and (max-width: 768px) {
  .blog-title {
    font-size: 5.31vw;
    line-height: 7.25vw;
    margin-top: 14.9vw;
  }
}

.confirm-button {
  font-family: Barlow;
  font-style: normal;
  font-weight: bold;
  font-size: 3.86vw;
  line-height: 11.6vw;
  /* identical to box height, or 187% */
  text-align: center;
  letter-spacing: 2.66667px;
  text-transform: uppercase;
  width: 62.8vw;
  color: #6c00ff;
  background-color: #ffff14;
  margin-top: 12vw;
  margin-bottom: 7.25vw;
  cursor: pointer;
}

.filter-title {
  font-family: Barlow;
  font-style: normal;
  font-weight: 500;
  font-size: 3.38vw;
  line-height: 5.31vw;
  /* identical to box height, or 157% */
  text-align: center;
  letter-spacing: 0.875px;
  text-transform: uppercase;
  color: #ffffff;
  margin-top: 1.25vw;
  margin-bottom: 7.25vw;
}

.filter-seperator {
  width: 85vw;
  height: 1px;
  background-color: #d8d8d8;
  margin-bottom: 7.25vw;
}

.filter-button-container {
  cursor: pointer;
  background: url("/contentservice/getContent?documentName=PR_WCS01_UCM01204274");
  background-size: cover;
  width: 9.66vw;
  height: 9.66vw;
}

.sheet-wrapper {
  background: #000;
}
.sheet-wrapper .blog-btns-mobile-select-container.is-visible {
  width: 100vw;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #000000;
  position: fixed;
  bottom: 0;
  left: 0;
}
.sheet-wrapper .blog-btns-mobile-select-container.is-visible .blog-btns-mobile-group {
  width: 85.5vw;
  display: flex;
  flex-wrap: wrap;
}