/* general layout */
.red-blue-grid-bg {
  position: relative;
}

.red-blue-grid-bg:before {
  content: ' ';
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  left: 24%;
  height: 100%;
  background-size: 160%;
  background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-red-blue-retina.png");
  background-repeat: no-repeat;
  /* transform: rotate(240deg); */
}

@media (min-width: 500px) {
  .red-blue-grid-bg:before {
    background-size: 140%;
    left: 33%;
  }
}

@media (min-width: 660px) {
  .red-blue-grid-bg:before {
    background-size: 120%;
  }
}

@media (min-width: 721px) {
  .red-blue-grid-bg:before {
    left: 36%;
    background-size: 100%;
  }
}

@media (min-width: 1024px) {
  .red-blue-grid-bg:before {
    left: 45%;
  }
}

@media (min-width: 1556px) {
  .red-blue-grid-bg:before {
    left: 57%;
  }
}

.blue-red-grid-bg {
  position: relative;
}

.blue-red-grid-bg:before {
  background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-blue-red.png");
}

@media (max-width: 720px) {
  .blue-red-grid-bg:before {
    background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-blue-red-small.png");
  }
}

.blue-red-grid-bg-rotated {
  position: relative;
}

.blue-red-grid-bg-rotated:before {
  background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-blue-red-rotated.png");
}

.blue-red-grid-bg-2 {
  position: relative;
}

.blue-red-grid-bg-2:before {
  background-image: url("../../assets/img/bg-dot-wave-blue-red-2.png");
}

.blue-red-grid-bg-rotated-two {
  position: relative;
}

.blue-red-grid-bg-rotated-two:before {
  background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-blue-red-rotated-two.png");
}

.red-blue-grid-inverted-bg {
  position: relative;
}

.red-blue-grid-inverted-bg:before {
  content: ' ';
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  width: 100%;
  background-image: url("/master/media/toolbox/assets/img/bg-dot-wave-blue-red-inverted.png");
  background-repeat: no-repeat;
  background-position: top right;
}

@media (max-width: 720px) {
  .red-blue-grid-inverted-bg:before {
    background-image: none;
  }
}