.main,body,html{width:100%;height:100%}.btn,h1,h6{text-transform:uppercase}.btn,.progress,.progress .bar{border-radius:5rem}.btn,.btn--round,.progress,h1,h6,p{text-align:center}.progress,.step.current{display:block}*,.step .btnbox.btnSinglbox .btn--primary{margin:0}.btn,.step__header{margin-bottom:1rem}body{overflow-x:hidden;font-family:Montserrat,Arial,Helvetica,sans-serif;font-size:16px;line-height:1.4;color:#333;min-width:320px;background:50%/cover #fff;z-index:0}h1{font-size:3.5rem}.btn,h6{font-size:1.6rem}p{font-size:1.8rem}h1,h6,p{text-shadow:0 -1px 0 rgba(0,0,0,.4),0 1px 0 rgba(0,0,0,.4),-1px 0 0 rgba(0,0,0,.4),1px 0 0 rgba(0,0,0,.4)}*{padding:0;box-sizing:border-box}html{font-size:62.5%}.btn{transition:.25s}.main{position:relative;z-index:1}.progress{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%);z-index:3;width:90%;max-width:20rem;height:.5rem;overflow:hidden;background:#00000038}.videobgbox,.videobgbox:after{position:fixed;left:0;top:0;right:0;bottom:0}.step,.video{transform:translate(-50%,-50%)}.video,.videobgbox,.videobgbox:after{height:100%;width:100%}
.progress .bar {
    width:0;
    height:100%;
    background-image:linear-gradient(90deg,#20ffe3,#095a4d);
    transition: width 0.5s ease;
}
.videobgbox:after{content:"";display:block;background:0 0/2px 2px #0006;z-index:0}.video{position:absolute;left:50%;top:50%;transition-duration:0s;object-fit:cover}.btnbox{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}.btn,.btnbox{-ms-flex-align:center;align-items:center}.btn{width:100%;height:6rem;line-height:6rem;padding:0 2rem;position:relative;display:inline-block;color:#000;text-decoration:none;letter-spacing:.1rem;cursor:pointer;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;border:0}.btn--primary{margin-left:2rem;background-color:#00000091;color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.4),inset 0 2px 2px hsl(0deg,0%,100%,.2);box-shadow:0 0 5px #fff,0 0 10px #00ffd8,0 0 11px #00ffc0,0 0 0 #00ffe2,0 0 2px #00f6ff,0 0 0 #00ffc6,0 0 21px #7dffde,0 0 22px #c8ffee}.btn--primary:active,.btn--primary:hover{color:#66f9dd;font-weight:700}.btn--accent{color:#fff;background-color:#c154c1;box-shadow:0 2px 6px rgba(0,0,0,.4)}.btn--accent:hover{background:#c050c0;box-shadow:0 2px 6px rgba(0,0,0,.3)}.btn--accent:active{background-color:#c154c1;box-shadow:none}
.btn--round {
    min-width:8.6rem;
    height:8.6rem;
    background:#fff;
    border-radius:6rem;
    padding:0 15px;
    color:#fff;
    font-size:1.4rem;
    width:8.6rem;
}
.btn--round.btn--primary{background-color:#00000075}.btn--round.btn--accent{background:#7c7c7c70}.stepbox{left:0;top:0;z-index:2}.step,.stepbox{width:100%;height:100%;position:relative}.step{max-width:40rem;top:50%;left:50%;display:none;padding:2rem;color:#fff}.step .btnbox.btnSinglbox{-ms-flex-pack:center;justify-content:center;width:100%}.step .btnbox.btnSinglbox .btn{margin-left:0;width:100%}.step__inner{width:100%;height:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.step__body,.step__footer{margin-bottom:2rem}.style_alt .btn--primary{box-shadow:0 0 5px #fff,0 0 10px #fff,0 0 20px #fff,0 0 0 #0ff,0 0 14px #0ff,0 0 0 #0ff,0 0 41px #0ff,0 0 22px #0ff}.style_alt .progress .bar{background-image:linear-gradient(90deg,#20ffea,#2ebfff)}@media (min-width:375px){html{font-size:75%}}@media (min-width:768px){html{font-size:87.5%}}@media (min-width:992px){.btnbox .btn{max-width:26rem}.btnbox .btn--round{width:1rem;height:3rem}.btnbox.btnSinglbox .btn{max-width:100%;width:100%;margin-left:0}.step{max-width:60rem;padding-left:10rem}}@media (max-width:600px){h6{font-size:22px}}@media (max-width:400px) and (max-height:570px){.step__header{margin-bottom:1.5rem}}@media (max-width:400px) and (max-height:460px){h1{font-size:3rem}p{font-size:1.6rem}h6{font-size:19px}}

@keyframes heartfade {
    0% {
        opacity : 1;
    }
    50% {
        opacity : 0;
    }
}
.heart {
    z-index : 999;
    animation : heartfade 20s linear;
    position : absolute;
}
.heart:before,
.heart:after {
    content : "";
    background-color : #fc2a62;
    position : absolute;
    height : 30px;
    width : 45px;
    border-radius : 15px 0px 0px 15px;
}
.heart:before {
    transform : rotate(45deg);
}
.heart:after {
    left : 10.5px;
    transform : rotate(135deg);
}
