.dancemd-perspective,.dancemd-perspective body{height:100%;overflow:hidden}
.dancemd-perspective body{background:#222;-webkit-perspective:600px;-moz-perspective:600px;perspective:600px}
.dancemd-docrelative{position:relative;overflow:hidden;padding-bottom:0px;margin-bottom:0px}
.dancemd-modal{position:fixed;top:50%;left:50%;width:50%;height:auto;min-width:320px;height:auto;z-index:2000;visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}
.dancemd-modal-simple{position:fixed;width:100%;height:auto;z-index:2000;visibility:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden;}

.dancemd-modal-transform {
	visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

.dancemd-show {
	visibility: visible;
	display: block!important;
}

.dancemd-overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	visibility: hidden;
	top: 0;
	left: 0;
	z-index: 1000;
	opacity: 0;
	background: rgba(55, 55, 55, 0.6);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show ~ .dancemd-overlay {
	opacity: 1;
	visibility: visible;
}

.dancemd-overlay-show{
	opacity: 1;
	visibility: visible;
}

/*box style*/
.dancemd-dialog{background:white;position:relative;margin:0 auto;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,0.2)}
.dancemd-dialog .dancemd-dialog__hd{margin:0;font-size:14px;font-weight:300;opacity:0.8;background:#F8F8F8;color:#333;border-radius:3px 3px 0 0;border-bottom:1px solid #eee;height:42px;line-height:42px;padding:0 20px}
.dancemd-dialog .dancemd-dialog__bd{margin:0}
.dancemd-dialog .dancemd-dialog__bd.dancemd-dialog__bd-padding{padding:12px 25px 25px}
.dancemd-dialog .dancemd-dialog__bd img{width:100%}
.dancemd-icon{background:url(../images/icon.png) no-repeat}
.dancemd-dialog__setwin{position:absolute;right:10px;top:14px;font-size:0;line-height:initial;cursor:pointer}
.dancemd-dialog__setwin .dancemd-close{display:inline-block;vertical-align:top;position:relative;width:16px;height:16px;margin-left:10px;font-size:12px;line-height:20px;_overflow:hidden;color:#fff;transition:color .3s ease;text-decoration:none;font-weight:600}
.dancemd-dialog__setwin .dancemd-close:focus,.dancemd-dialog__setwin .dancemd-close:hover{color:#9ec6e9;text-decoration:none}
.dancemd-dialog__setwin .dancemd-close1{background-position:1px -40px;cursor:pointer}
.dancemd-dialog__setwin .dancemd-close-round{display:inline-block;position:relative;cursor:pointer;width:26px;height:26px;background:url(../images/round-close.png) no-repeat;background-size:86%;cursor:pointer}
.dancemd-dialog__ft{position:relative;line-height:42px;font-size:14px;display:-webkit-box;display:-webkit-flex;display:flex;text-align:center}
.dancemd-dialog__ft .dancemd-dialog__ft_item{display:block;-webkit-box-flex:1;-webkit-flex:1;flex:1;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);position:relative;padding: 10px 0;}
.dancemd-dialog__ft .dancemd-dialog__btn{display:block;-webkit-box-flex:1;-webkit-flex:1;flex:1;color:#2979ff;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);position:relative}
.dancemd-dialog__ft .dancemd-dialog__btn-cancel{color:#606266}
.dancemd-dialog__ft .dancemd-dialog__btn + .dancemd-dialog__btn:after{content:" ";position:absolute;left:0;top:0;width:1px;height:100%;border-left:1px solid #D5D5D6;color:#D5D5D6;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleX(0.5);transform:scaleX(0.5)}
.dancemd-dialog__ft:after{content:" ";position:absolute;left:0;top:0;right:0;height:1px;border-top:1px solid #d5d5d6;color:#d5d5d6;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(.5);transform:scaleY(.5)}
.dancemd-dialog__btn.primary{color:#07c160}
.dancemd-dialog__btn.blue{color:#10aeff}
.dancemd-dialog__btn.red{color:#FA5151}

/* Individual modal styles with animations/transitions */

/* Effect top */
.dancemd-effect-top{
	top: 0;
}
.dancemd-effect-top .dancemd-dialog {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	opacity: 0;
}
.dancemd-show.dancemd-effect-top .dancemd-dialog {
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
	border-radius: 0;
	opacity: 1;
}

/* Effect bottom */
.dancemd-effect-bottom{
	bottom: 0;
}
.dancemd-effect-bottom .dancemd-dialog {
	-webkit-transform: translateY(100%);
	-moz-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	opacity: 0;
}
.dancemd-show.dancemd-effect-bottom .dancemd-dialog {
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
	border-radius: 0;
	opacity: 1;
}

.dancemd-modal-full{top:0;bottom:0;left:0;right:0;width:100%;height:100%;z-index:2000;display:none;max-width:100%;min-width:100%;transform:inherit}
.dancemd-modal-full .dancemd-dialog{-webkit-overflow-scrolling:touch;width:100%;position:absolute;bottom:0;height:100%;border-radius: 0;}
.dancemd-modal-full .dancemd-dialog .dancemd-dialog__bd{}
.dancemd-modal-full .dancemd-dialog__ft{position:fixed;left:0;width:100%;bottom:0;z-index:9;border-radius:0;padding:15px;background:#fff;box-sizing:border-box;box-shadow:0 0 10px #f5f5f5}

/* Effect 1: Fade in and scale up */
.dancemd-effect-1 .dancemd-dialog {
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	transform: scale(0.7);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-1 .dancemd-dialog {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 2: Slide from the right */
.dancemd-effect-2 .dancemd-dialog {
	-webkit-transform: translateX(20%);
	-moz-transform: translateX(20%);
	-ms-transform: translateX(20%);
	transform: translateX(20%);
	opacity: 0;
	-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
	transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}

.dancemd-show.dancemd-effect-2 .dancemd-dialog {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}

/* Effect 3: Slide from the bottom */
.dancemd-effect-3 .dancemd-dialog {
	-webkit-transform: translateY(20%);
	-moz-transform: translateY(20%);
	-ms-transform: translateY(20%);
	transform: translateY(20%);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-3 .dancemd-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 4: Newspaper */
.dancemd-effect-4 .dancemd-dialog {
	-webkit-transform: scale(0) rotate(720deg);
	-moz-transform: scale(0) rotate(720deg);
	-ms-transform: scale(0) rotate(720deg);
	transform: scale(0) rotate(720deg);
	opacity: 0;
}

.dancemd-show.dancemd-effect-4 ~ .dancemd-overlay,
.dancemd-effect-4 .dancemd-dialog {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.dancemd-show.dancemd-effect-4 .dancemd-dialog {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
	-ms-transform: scale(1) rotate(0deg);
	transform: scale(1) rotate(0deg);
	opacity: 1;
}

/* Effect 5: fall */
.dancemd-effect-5.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-5 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(600px) rotateX(20deg); 
	-moz-transform: translateZ(600px) rotateX(20deg); 
	-ms-transform: translateZ(600px) rotateX(20deg); 
	transform: translateZ(600px) rotateX(20deg); 
	opacity: 0;
}

.dancemd-show.dancemd-effect-5 .dancemd-dialog {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translateZ(0px) rotateX(0deg);
	-moz-transform: translateZ(0px) rotateX(0deg);
	-ms-transform: translateZ(0px) rotateX(0deg);
	transform: translateZ(0px) rotateX(0deg); 
	opacity: 1;
}

/* Effect 6: side fall */
.dancemd-effect-6.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-6 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate(30%) translateZ(600px) rotate(10deg); 
	-moz-transform: translate(30%) translateZ(600px) rotate(10deg);
	-ms-transform: translate(30%) translateZ(600px) rotate(10deg);
	transform: translate(30%) translateZ(600px) rotate(10deg); 
	opacity: 0;
}

.dancemd-show.dancemd-effect-6 .dancemd-dialog {
	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	-webkit-transform: translate(0%) translateZ(0) rotate(0deg);
	-moz-transform: translate(0%) translateZ(0) rotate(0deg);
	-ms-transform: translate(0%) translateZ(0) rotate(0deg);
	transform: translate(0%) translateZ(0) rotate(0deg);
	opacity: 1;
}

/* Effect 7:  slide and stick to top */
.dancemd-effect-7{
	top: 0;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}

.dancemd-effect-7 .dancemd-dialog {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
	opacity: 0;
}

.dancemd-show.dancemd-effect-7 .dancemd-dialog {
	-webkit-transform: translateY(0%);
	-moz-transform: translateY(0%);
	-ms-transform: translateY(0%);
	transform: translateY(0%);
	border-radius: 0 0 3px 3px;
	opacity: 1;
}

/* Effect 8: 3D flip horizontal */
.dancemd-effect-8.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-8 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateY(-70deg);
	-moz-transform: rotateY(-70deg);
	-ms-transform: rotateY(-70deg);
	transform: rotateY(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.dancemd-show.dancemd-effect-8 .dancemd-dialog {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

/* Effect 9: 3D flip vertical */
.dancemd-effect-9.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-9 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-70deg);
	-moz-transform: rotateX(-70deg);
	-ms-transform: rotateX(-70deg);
	transform: rotateX(-70deg);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	opacity: 0;
}

.dancemd-show.dancemd-effect-9 .dancemd-dialog {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 10: 3D sign */
.dancemd-effect-10.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-10 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: rotateX(-60deg);
	-moz-transform: rotateX(-60deg);
	-ms-transform: rotateX(-60deg);
	transform: rotateX(-60deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-10 .dancemd-dialog {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	transform: rotateX(0deg);
	opacity: 1;
}

/* Effect 11: Super scaled */
.dancemd-effect-11 .dancemd-dialog {
	-webkit-transform: scale(2);
	-moz-transform: scale(2);
	-ms-transform: scale(2);
	transform: scale(2);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-11 .dancemd-dialog {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 12:  只显示自己 */
.dancemd-effect-12 .dancemd-dialog {
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	transform: scale(0.8);
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-12 ~ .dancemd-overlay {
	background: #ffffff;
} 

.dancemd-effect-12 .dancemd-dialog h3,
.dancemd-effect-12 .dancemd-dialog {
	background: transparent;
}

.dancemd-show.dancemd-effect-12 .dancemd-dialog {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
}

/* Effect 13: 3D夹缝 */
.dancemd-effect-13.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-13 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(-3000px) rotateY(90deg);
	-moz-transform: translateZ(-3000px) rotateY(90deg);
	-ms-transform: translateZ(-3000px) rotateY(90deg);
	transform: translateZ(-3000px) rotateY(90deg);
	opacity: 0;
}

.dancemd-show.dancemd-effect-13 .dancemd-dialog {
	-webkit-animation: slit .7s forwards ease-out;
	-moz-animation: slit .7s forwards ease-out;
	animation: slit .7s forwards ease-out;
}

@-webkit-keyframes slit {
	50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
	100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@-moz-keyframes slit {
	50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
	100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

@keyframes slit {
	50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
	100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
}

/* Effect 14:  3D Rotate from bottom */
.dancemd-effect-14.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-14 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateY(100%) rotateX(90deg);
	-moz-transform: translateY(100%) rotateX(90deg);
	-ms-transform: translateY(100%) rotateX(90deg);
	transform: translateY(100%) rotateX(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.dancemd-show.dancemd-effect-14 .dancemd-dialog {
	-webkit-transform: translateY(0%) rotateX(0deg);
	-moz-transform: translateY(0%) rotateX(0deg);
	-ms-transform: translateY(0%) rotateX(0deg);
	transform: translateY(0%) rotateX(0deg);
	opacity: 1;
}

/* Effect 15:  3D Rotate in from left */
.dancemd-effect-15.dancemd-modal {
	-webkit-perspective: 1300px;
	-moz-perspective: 1300px;
	perspective: 1300px;
}

.dancemd-effect-15 .dancemd-dialog {
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	transform: translateZ(100px) translateX(-30%) rotateY(90deg);
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	transform-origin: 0 100%;
	opacity: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-15 .dancemd-dialog {
	-webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	-ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
	transform: translateZ(0px) translateX(0%) rotateY(0deg);
	opacity: 1;
}

/* Effect 16:  Blur */
.dancemd-show.dancemd-effect-16 ~ .dancemd-overlay {
	background: rgba(180,46,32,0.5);
}

.dancemd-show.dancemd-effect-16 ~ .container {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	filter: blur(3px);
}

.dancemd-effect-16 .dancemd-dialog {
	-webkit-transform: translateY(-5%);
	-moz-transform: translateY(-5%);
	-ms-transform: translateY(-5%);
	transform: translateY(-5%);
	opacity: 0;
}

.dancemd-show.dancemd-effect-16 ~ .container,
.dancemd-effect-16 .dancemd-dialog {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.dancemd-show.dancemd-effect-16 .dancemd-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}

/* Effect 17:  Slide in from bottom with perspective on container */
.dancemd-show.dancemd-effect-17 ~ .container {
	height: 100%;
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}	

.dancemd-show.dancemd-effect-17 ~ .container,
.dancemd-show.dancemd-effect-17 ~ .dancemd-overlay  {
	-webkit-transform: rotateX(-2deg);
	-moz-transform: rotateX(-2deg);
	-ms-transform: rotateX(-2deg);
	transform: rotateX(-2deg);
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.dancemd-effect-17 .dancemd-dialog {
	opacity: 0;
	-webkit-transform: translateY(200%);
	-moz-transform: translateY(200%);
	-ms-transform: translateY(200%);
	transform: translateY(200%);
}

.dancemd-show.dancemd-effect-17 .dancemd-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.3s 0.2s;
	-moz-transition: all 0.3s 0.2s;
	transition: all 0.3s 0.2s;
}

/* Effect 18:  Slide from right with perspective on container */
.dancemd-show.dancemd-effect-18 ~ .container {
	height: 100%;
	overflow: hidden;
}

.dancemd-show.dancemd-effect-18 ~ .dancemd-overlay {
	background: rgba(143,27,15,0.8);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.dancemd-show.dancemd-effect-18 ~ .container,
.dancemd-show.dancemd-effect-18 ~ .dancemd-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 0% 50%;
	-webkit-animation: rotateRightSideFirst 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 0% 50%;
	-moz-animation: rotateRightSideFirst 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 0% 50%;
	animation: rotateRightSideFirst 0.5s forwards ease-in;
}

@-webkit-keyframes rotateRightSideFirst {
	50% { -webkit-transform: translateZ(-50px) rotateY(5deg); -webkit-animation-timing-function: ease-out; }
	100% { -webkit-transform: translateZ(-200px); }
}

@-moz-keyframes rotateRightSideFirst {
	50% { -moz-transform: translateZ(-50px) rotateY(5deg); -moz-animation-timing-function: ease-out; }
	100% { -moz-transform: translateZ(-200px); }
}

@keyframes rotateRightSideFirst {
	50% { transform: translateZ(-50px) rotateY(5deg); animation-timing-function: ease-out; }
	100% { transform: translateZ(-200px); }
}

.dancemd-effect-18 .dancemd-dialog {
	-webkit-transform: translateX(200%);
	-moz-transform: translateX(200%);
	-ms-transform: translateX(200%);
	transform: translateX(200%);
	opacity: 0;
}

.dancemd-show.dancemd-effect-18 .dancemd-dialog {
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}

/* Effect 19:  Slip in from the top with perspective on container */
.dancemd-show.dancemd-effect-19 ~ .container {
	height: 100%;
	overflow: hidden;
}

.dancemd-show.dancemd-effect-19 ~ .dancemd-overlay {
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
}

.dancemd-show.dancemd-effect-19 ~ .container,
.dancemd-show.dancemd-effect-19 ~ .dancemd-overlay {
	-webkit-transform-style: preserve-3d;
	-webkit-transform-origin: 50% 100%;
	-webkit-animation: OpenTop 0.5s forwards ease-in;
	-moz-transform-style: preserve-3d;
	-moz-transform-origin: 50% 100%;
	-moz-animation: OpenTop 0.5s forwards ease-in;
	transform-style: preserve-3d;
	transform-origin: 50% 100%;
	animation: OpenTop 0.5s forwards ease-in;
}

@-webkit-keyframes OpenTop {
	50% { 
		-webkit-transform: rotateX(10deg); 
		-webkit-animation-timing-function: ease-out; 
	}
}

@-moz-keyframes OpenTop {
	50% { 
		-moz-transform: rotateX(10deg); 
		-moz-animation-timing-function: ease-out; 
	}
}

@keyframes OpenTop {
	50% { 
		transform: rotateX(10deg); 
		animation-timing-function: ease-out; 
	}
}

.dancemd-effect-19 .dancemd-dialog {
	-webkit-transform: translateY(-200%);
	-moz-transform: translateY(-200%);
	-ms-transform: translateY(-200%);
	transform: translateY(-200%);
	opacity: 0;
}

.dancemd-show.dancemd-effect-19 .dancemd-dialog {
	-webkit-transform: translateY(0);
	-moz-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	-webkit-transition: all 0.5s 0.1s;
	-moz-transition: all 0.5s 0.1s;
	transition: all 0.5s 0.1s;
}

/*=====baiyun风格=====*/
.dancemd-ext-baiyun .dancemd-dialog{border-radius: 16px;}
.dancemd-ext-baiyun .dancemd-dialog__hd{background: none;border-bottom: 1px solid #f2f2f2;color: #151516;text-align: center;border-radius: 10px 10px 0 0;height: 60px;line-height: 60px;padding: 0;font-size: 18px;opacity:100;}
/*关闭按钮*/
.dancemd-ext-baiyun .dancemd-dialog__bd{box-shadow:none;}
.dancemd-ext-baiyun .dancemd-dialog__setwin{top: 100%;right: 50%;}
.dancemd-ext-baiyun .dancemd-dialog__setwin .dancemd-close1{background: url("../images/baiyun-close.png") no-repeat center;width: 36px;height: 36px;right: -24px;top: 16px;color: #9c9c9c;background-color: #e0e0e0;border-radius: 50%;margin-left: 0;}

/*=====fancytwo风格=====*/
.dancemd-ext-fancytwo .dancemd-dialog{border-radius:16px;padding: 34px;background: #eedbb1;}
.dancemd-ext-fancytwo .dancemd-dialog__hd{padding:0 0 10px;color:#ffffff;text-align:center;background: inherit;border-bottom:none}
.dancemd-ext-fancytwo .dancemd-dialog__hd .dancemd-title{display:inline-block;width:129px;height:32px;line-height:32px;text-align:center;background:url("../images/fancytwo-hd.png");background-size:100% 100%;background-repeat:no-repeat;color:#ffffff;font-size: 14px;}
.dancemd-ext-fancytwo .dancemd-line{display:inline-block;width:100%;height:20px;background:url("../images/fancytwo-line.png");background-size:100% 100%;background-repeat:no-repeat;}
.dancemd-ext-fancytwo .dancemd-dialog__bd{box-shadow:none}
.dancemd-ext-fancytwo .dancemd-dialog__setwin{top:100%;right:50%}
.dancemd-ext-fancytwo .dancemd-dialog__setwin .dancemd-close{background:url("../images/fancytwo-close.png") no-repeat center;background-size:88%;width:48px;height:48px;right:-24px;top:16px;}
.dancemd-ext-fancytwo.dancemd-ext-fancytwo-ft000 .dancemd-dialog{background:url("../images/fancytwo-ft.png") #eedbb1;background-size:100%;background-repeat:no-repeat;background-position:left bottom}