@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;700&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;700&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
	@import url('https://fonts.googleapis.com/css2?family=Inter&family=Itim&display=swap');
	
	:root {
	--poppins: 'Poppins', sans-serif;
	--nunito: 'Nunito Sans', sans-serif;
	--caveat: 'Caveat', cursive;
	--quicksand: 'Quicksand', sans-serif;
	--itim: 'Itim', cursive;
	--inter: 'Inter', sans-serif;
	}

    html, body {position: relative;height: 100%;overflow:hidden}
    body {background: #000;font-family: 'Itim', cursive;font-size: 14px;color: #fff;text-shadow: 0px 2px 2px rgba(0, 0, 0, .5);margin: 0;padding: 0;}
    
    #bodyblur{opacity:.4;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);transition:all 1s ease;} 
    #thisblur{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);position:absolute;top:0;left:0;right:0;bottom:0;}
    #wallpaper{/*animation: jj 7s infinite;*/width:100%;height:100%;transform: scale(1.3);transition:all 1.3s ease;}
    #wallpaper2, #wallpaper3, #wallpaper4{display:none}
    @keyframes jj{0%  {transform: scale(1);} 50% {transform: scale(1.3);} 100% {transform: scale(1);}}

    p{margin-left:50px;margin-right:70px;text-align:left}
    #ket{margin:20px}

    .swiper {width: 100%;height: 100%;padding:0;margin:0;}
    .swiper-slide {text-align: center;font-size: 18px;/*background: #fff;*/display: flex;flex-direction: column;justify-content: center;align-items: center;margin-top:-100px;}
    .textLeft{display:flex;width:100%;height: 180px; overflow: auto;justify-content: left;text-align: left !important;margin-left:70px;}
    .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
    .swiper-pagination{margin-bottom:25vh}
    .swiper-pagination-bullet-active{background-color: #fff !important;opacity:1 !important}
    .swiper-pagination-bullet{background-color:rgba(255,255,255, 1) !important;}
    .swiper-button-next, .swiper-button-prev{display:flex;top:unset;bottom:-100px}
    
    .sembunyi{display: none !important;}
    .stiker{display:flex;justify-content:center;align-items:center;margin-left:auto;margin-right:auto;margin-bottom:20px;transition:all .75s ease}
    .stiker img{width:90px;height:90px;box-shadow: 0 4px 30px rgba(255,255,255, 0.3);backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px);background: rgba(255, 255, 255, .5);border: 2px solid rgba(255, 255, 255, 1);border-radius: 50%;padding:10px;}
    .stiker img.sty2{background:none;filter: drop-shadow(0 4px 8px rgba(255, 255, 255, 0.2));box-shadow: none;backdrop-filter: none;-webkit-backdrop-filter: none;border: none;border-radius: 0;padding:0;width: auto;height:90px;}
	b.merah{color:red}
	b.kuning{color:yellow}
	b.putih{text-shadow:none;padding-left:8px;padding-right:8px;padding-top:2px;padding-bottom:2px;background-color:white;border-radius:12px}
	span.garismerah{border-bottom:2px solid red}
	span.gariskuning{border-bottom:2px solid yellow}
    p{color:white;font-size:15px;line-height:1.5em;}
    .scale0{opacity:0;transform: scale(0);transition: all .9s ease;}
    .scale1{opacity:1;transform: scale(1);transition: all .9s ease;}
    svg{vertical-align: middle;width: 22px;height: 22px;fill: #fff}
    .heart-icon {z-index:100;width: 30px;height: 30px;position: fixed;animation:  heartMove linear 1;top: -10vh;}

	@keyframes heartMove {
	  0% {transform: translateY(-10vh);}
	  100% {transform: translateY(100vh);}
	}
	    svg.line{fill: none;stroke: #fff;stroke-width: 2;}
	    .spin{animation: spin 3s linear infinite alternate;}
	@keyframes spin {
	  from {
	    transform: rotate(20deg);
	  }
	  to {
	    transform: rotate(-20deg);
	  }
	}
	@keyframes moving {
	  from {
	    transform: translateY(0);
	  }
	  to {
	    transform: translateY(3px);
	  }
	}
    .overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;display: flex;flex-direction:column;justify-content: center;align-items: center;background:rgba(0,0,0,.6);z-index:100;}
    .loading-message {font-size: 13px;text-shadow: 0px 2px 2px rgba(0, 0, 0, .8);color:white;text-align: center;}
    .blocklove{display: none;flex-direction: column;justify-content: center;align-items: center;}
    
    .blocktext{margin-top:10px;position:relative;width:100%;height: 180px; overflow: auto;background-color:none;}
    
    .sertifikat {position: relative;width: 330px;height: 236px;text-shadow:none}
	.sertifikat img {border-radius:30px;width: 100%;height: 100%;}
	.text-overlay {position: absolute;top: 35px;left: 0;width: 100%;text-align: center;color: #333;font-size: 14px;font-weight: bold;}
	.text-overlay h1 {font-size: 20px;color:#fff;margin: 0;}
	.text-overlay .sub-title {font-size: 14px;color:yellow;margin-bottom: 10px;}
	.content {font-size: 12px;color:#fff;}
	.real {font-weight: bold;color: #fff;font-size: 12px;}
    
    .swal2-modal > *{color:white}
    .swal2-title{line-height:1.3em;font-size:18px;text-align:center;padding:15px 30px 0 30px;}
    .swal2-container.swal2-backdrop-show{background: rgba(0,0,0,.5);}
    .swal2-timer-progress-bar-container > *{opacity:.7;background:#00B6FF;margin:0 2px}
    .swal2-modal{box-shadow: rgba(255,255,255, 0.3) 0px 7px 29px 0px;background:rgba(0,0,0,.9);max-width:320px;border-right:2px solid #fff;border-left:2px solid #fff;border-radius:4px;top:-50px;}
   
    .cover{margin-top:-120px;display:flex;flex-direction:column;justify-content:center;align-items:center}
    .lovein{font-size:50px;display:flex;align-items:center;justify-content:center;transition:all .3s ease;}
    .lovein svg{width:80px;height:80px;fill:#fefefe}
    .awalan{margin-top:20px;width:220px;min-height:25px;padding:12px;font-size:13px;color:white;background:rgba(0,0,0,.5);border:1px solid #fff;border-radius:50px;display:flex;align-items:center;text-align:left}
    .awalan svg{margin-right:15px;width:25px;height:25px;stroke:white}
    
	.mainMsg{margin-top:140px;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999;}
	.mainSt{display:flex;justify-content:center;align-items:center;margin-left:auto;margin-right:auto;transform:scale(0);transition:all 0.5s ease;}
	.mainSt img{width:80px;height:80px;box-shadow:0 4px 30px rgba(255,255,255,0.3);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);background:rgba(255,255,255,0.4);border:3px solid rgba(255,255,255,1);border-radius:50%;padding:10px;}
	.mainTxt{margin-top:24px;text-align:center;color:white;line-height:1.5em;font-size:19px;font-weight:700;transform:scale(0);transition:all 0.5s ease;}
	.secondTxt{margin-top:16px;text-align:center;color:white;font-size:17px;font-weight:400;transform:scale(0);transition:all 0.3s ease;}
    .thirdTxt{display:none;}
	.txtAlt{font-size:17px;font-weight:400;}
	.caveat{font-family: 'Caveat', cursive;font-weight:700;}
	
	#Tombol {margin-top:24px;position:relative;transform:scale(0);opacity:0;margin-left:auto;margin-right:auto;display:flex;justify-content:center;align-items:center;list-style:none;transition:all .6s ease;}
    #Tombol a {cursor:none;display:inline-flex;justify-content:center;align-items:center;margin:0 8px;min-width:40px;padding:10px;outline:0;border:2px solid white;border-radius:18px;line-height:15px;background:rgba(0,0,0,.5);color:white;font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;box-shadow: rgba(255,255,255, 0.15) 0px 7px 29px 0px;z-index:1;transition:all .6s ease;}
    #Tombol a.biru{background:#3D3BF3}
    #Tombol a.merah{background:#FF2929}
    .heart{position:fixed;width:22px;height:22px;opacity:.4;animation:float 7s ease-in-out forwards;left:0;bottom:0;top:0;z-index:999}
    @keyframes float{0%{transform:translateY(100vh);opacity:.4}10%{opacity:.4}90%{opacity:.4}100%{transform:translateY(-100vh);opacity:0}}
    .heart svg{width:100%;height:100%;stroke:pink}
    #scontainer{width:80%;margin:20px auto;min-height:650px;margin-top:150px;color:#000}@media screen and (max-width:400px){#container{width:100%;margin:50% auto;min-height:800px}}.wrapper{position:fixed}.box div{position:fixed;width:60px;height:60px;background-color:transparent;border:6px solid rgba(255,255,255,.5);border-radius:50%;z-index:0}.box div:nth-child(1){top:12%;left:42%;animation:animate 10s linear infinite}.box div:nth-child(2){top:70%;left:50%;animation:animate 7s linear infinite}.box div:nth-child(3){top:17%;left:6%;animation:animate 9s linear infinite}.box div:nth-child(4){top:20%;left:60%;animation:animate 10s linear infinite}.box div:nth-child(5){top:67%;left:10%;animation:animate 6s linear infinite}.box div:nth-child(6){top:80%;left:70%;animation:animate 12s linear infinite}.box div:nth-child(7){top:60%;left:80%;animation:animate 15s linear infinite}.box div:nth-child(8){top:32%;left:25%;animation:animate 16s linear infinite}.box div:nth-child(9){top:90%;left:25%;animation:animate 9s linear infinite}.box div:nth-child(10){top:20%;left:80%;animation:animate 5s linear infinite}@keyframes animate{0%{transform:scale(0) translateY(0) rotate(0);opacity:.8}100%{transform:scale(1.3) translateY(-90px) rotate(360deg);opacity:0}}