.swiper {
  overflow: hidden;
  position: relative;
  height: 333px; /* Declare the height of the swiper. */
  visibility: hidden; /* Hide until layout is ready. */
  width: 500px;
  border: 2px solid;
  cursor: url(../packages/dnd/cursor/openhand.cur), move; /* Cursor for IE. */
  cursor: url(../packages/dnd/cursor/openhand.cur) 7 5, move; /* Cursor for FF and Chrome (setting midpoint). */
}

.page-container {
  position: relative;
  height: 100%;
}

.page {
  position: absolute;
  width: 100%;
  height: 100%;
}


/* Show other curser during drag. */
.swiper-dragging, .swiper-drag-occurring {
  cursor: url(../packages/dnd/cursor/closedhand.cur), move; /* Cursor for IE. */
  cursor: url(../packages/dnd/cursor/closedhand.cur) 7 5, move; /* Cursor for FF and Chrome (setting midpoint). */
}


/* Page Styling. */
.page {
  color: white;
  font-size: 100px;
  text-align: center;
  display: table;
}

.page p {
  display: table-cell;
  vertical-align: middle;
}

.page1 {
  background-color: #00A0B0;
}

.page2 {
  background-color: #6A4A3C;
}

.page3 {
  background-color: #CC333F;
}

.page4 {
  background-color: #EB6841;
}

.page5 {
  background-color: #EDC951;
}