/* === Design Motion (page-id-19) === */

.page-id-19 .dm-stage .dm-btn,
.page-id-19 .dm-stage .dm-girl,
.page-id-19 .dm-stage .dm-cloud {
  position: absolute;
  display: block;
  z-index: 2;
  transform-origin: top left;
}

.page-id-19 .dm-stage .dm-btn {
  cursor: pointer;
  will-change: transform;
  transition: transform .18s ease;
}

.page-id-19 .dm-stage .dm-girl,
.page-id-19 .dm-stage .dm-cloud {
  pointer-events: none;
}

.page-id-19 .dm-stage .dm-exit   { left:77.7%; top:2.3%; width:21.3%; }
.page-id-19 .dm-stage .dm-chkin  { left:19.6%; top:50.1%; width:22.1%; }
.page-id-19 .dm-stage .dm-rules  { left:42.6%; top:23.9%; width:17.8%; }
.page-id-19 .dm-stage .dm-events { left:19.2%; top:23.2%; width:20.3%; }

.page-id-19 .dm-stage .girl-back  { left:74.6%; top:38.0%; width:23.6%; }
.page-id-19 .dm-stage .girl-front { left:76.3%; top:49.8%; width:22.8%; }
.page-id-19 .dm-stage .cloud-come  { left:48.1%; top:2.3%; width:44.8%; }
.page-id-19 .dm-stage .cloud-leave { left:41.9%; top:14.0%; width:44.8%; }

.page-id-19 .dm-stage .dm-girl,
.page-id-19 .dm-stage .dm-cloud {
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
}

.page-id-19 .dm-stage .visible {
  opacity: 1 !important;
  display: block !important;
}

.page-id-19 .dm-stage .hidden {
  opacity: 0 !important;
  display: none !important;
}



.page-id-19 .dm-stage .dm-appear.hidden {
  opacity: 0;
  transform: translateY(10px) scale(.985);
  will-change: transform, opacity;
}

.page-id-19 .dm-stage .dm-appear.visible.is-in {
  opacity: 1;
  transform: none;
  transition: opacity .45s ease, transform .45s ease;
}

.page-id-19 .dm-stage .dm-cloud.dm-appear.visible.is-in {
  transition-duration: .65s;
}

.page-id-19 .dm-stage .visible { opacity: 1; display: block; }
.page-id-19 .dm-stage .hidden  { opacity: 0; display: none; }
