html, .x-fullscreen {
  background-color: #fff;
}
.painting {
  background-color: white;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50% 0;
}

.asteroid { background-image: url('http://src.sencha.io/https://github.com/senchalearn/Carousel-demo/raw/gh-pages/images/paintings/asteroid.jpg'); }
.template { background-image: url('http://src.sencha.io/https://github.com/senchalearn/Carousel-demo/raw/gh-pages/images/paintings/template.jpg'); }
.standing { background-image: url('http://src.sencha.io/https://github.com/senchalearn/Carousel-demo/raw/gh-pages/images/paintings/standing.jpg'); }
.sitting  { background-image: url('http://src.sencha.io/https://github.com/senchalearn/Carousel-demo/raw/gh-pages/images/paintings/sitting.jpg'); }
.erect    { background-image: url('http://src.sencha.io/https://github.com/senchalearn/Carousel-demo/raw/gh-pages/images/paintings/erect.jpg'); }

.paintingcard {
  background-color: black;
}
.infocard {
  background-color: black;
  background-image: url('/images/noise.png');
}
.infocard .x-html,
.infocard .x-html a,
.infocard .x-html h1,
.infocard .x-html h2,
.infocard .x-html h3 {
  color: rgba(255,255,255,0.8);
  text-shadow: 0 -1px 0 rgba(0,0,0,0.3),
               0  1px 0 rgba(255,255,255,0.4);
}