.color-palette-block {
  padding: 3rem 0;
}
.color-palette-block .color-info {
  display: flex;
    flex-flow: column wrap;
    align-items: center;
    justify-content: space-between;
  border: solid 4px white;
  height: 19vw;
  max-height: 240px;
  padding: 1rem;
  text-align: center;
}
.color-palette-block .color-value {
  font-size: 1.5rem;
}
.color-palette-block .color-name {
  font-size: 11px;
  font-weight: 600;
  opacity: 0.6;
}
.color-palette-block .color-code {
  font-size: 11px;
}


@media all and (max-width: 1023px) {
  .color-palette-block .color-info {
    height: 34vw;
  }
}

@media all and (max-width: 823px) {
  .color-palette-block .color-info {
    height: 26vw;
  }
}

@media all and (max-width: 639px) {
  .color-palette-block .page-block-wrapper {
    margin: 0 4px;
  }
  .color-palette-block .color-info {
    height: 38vw;
  }
}