.myMask{
    position: fixed;opacity: 0;width: 100%;height: 100%;visibility: hidden;top: 0;left: 0;z-index: 1000;background: rgba(0,0,0,0.6);-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;
}
.myPop{    
    position: fixed;top: 50%;left: 50%;height: auto;z-index: 2000;visibility: hidden;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;backface-visibility: hidden;
    transform: translate3d(-52%,-50%,0);-webkit-transform: translate3d(-52%,-50%,0);-moz-transform: translate3d(-52%,-50%,0);-ms-transform: translate3d(-52%,-50%,0);
}
.myPop .popContent{
	width: 100%;color: #fff;position: relative;border-radius: 3px;margin: 0 auto;background-color: #fff;
}
.effect_show ~ .myMask{
	opacity: 1;
    visibility: visible;
}
#effect_0 .popContent{
    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);
}
.effect_show#effect_0 .popContent{
    opacity: 1;
}
#effect_2{
	-webkit-perspective: 1300px;
    -moz-perspective: 1300px;
    perspective: 1300px;
}
#effect_1 .popContent{

	-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);
}
.effect_show#effect_1 .popContent{
	-webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
}

#effect_2 .popContent{
	-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;
}
.effect_show#effect_2 .popContent{
	    -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_show{
	visibility: visible;
}
.myPop .popContent .popTop{
	height: 40px;line-height: 40px;
}
.myPop .popContent .popMain{
    padding: 29px 40px 30px;
    margin: 0;
    font-weight: 300;
    font-size: 1.15em;
}
.myPop .Tclose{
	position: absolute;top: -45px;right: 0px;cursor: pointer;
}
.myPop .Tclose i{
	color: #fff;font-size: 30px;
}