@media only screen and (min-width: 576px) {
	.navbar-light .navbar-nav .nav-link .img {
		max-width: 45px;
		padding: .5rem;
	}
	
	@keyframes fade-left-fade-right {
		0% {
		  margin-left: -100px;
		}
		50% {
		  margin-left: 100px;
		}
		100% {
		  margin-left: -100px;
		}
	  }

	.popup-undangan .mdl-content .partner .popup-content-name .and {
		margin-top: 3rem;
		margin-left: 0;
	}

	.popup-undangan .mdl-content .partner .card-woman {
		margin-top: 7rem;
	}

	
	
	.popup-undangan .mdl-content .partner h1 {
		font-size: calc(3rem + 3vw);
		line-height: calc(1rem + 3vw);
	}

	.popup-undangan .mdl-content .partner .card-men .popup-img-2-1 {
		bottom: -3.5rem;
		max-height: 3rem;
	}

	.popup-undangan .mdl-content .partner .card-woman .popup-img-2-2 {
		top: -2.5rem;
		left: 2rem;
		max-height: 3rem;
	}

	.popup-undangan .mdl-content .open-content {
		padding-bottom: 3rem;
	}

	.core-side {
		max-height: 25rem;
	}
	


	.core-5 .core-side.core-5-img-1 {
		transform:  translateY(-50%);
	}



	


	.core-0 .card-image {
		width: 570px;
		height: 380px;
	}

	.core-0 .countdown .box p {
		font-size: 1.2rem;
	}
	

	.core-1 .content .widget .card-image {
		width: 260px;
    	height: 310px;
	}

	.core-1 .content .widget .card-image::after {
		left: 30px;
		width: 217px;
		height: 295px;
	}

	.core-1 .content .widget .card-image img {
		width: 220px;
		height: 290px;
	}

	.core-1 .content .widget .card-text {
		font-size: 1.1rem;
	}

	.core-2 {
		padding-top: 8rem;
	}

	.core-2 .content .card .card-day {
		font-size: 2rem;
	}

	.core-2 .content .card .card-date {
		font-size: 1.4rem;
	}
	
	.core-2 .content .card .card-hour {
		font-size: 1rem;
	}

	.core-3 video {
		height: 300px;
	}
	
	.core-3 iframe {
		height: 300px;
	}


	.core--4 {
		padding: 3rem 0;
	}

	.core-4 .love-story .meet-time {
		font-size: 1.5rem;
	}

	.core-4 .content .story {
		font-size: .9rem;
	}
	

	.core-5 .content {
		padding: 0 7rem;
	}

	.core-6 .card-text {
		font-size: 1.1rem;
	}
	
	.core-7 .list-comments {
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.core-8 .doa {
		font-size: 1.7rem;
	}
	

	footer {
		padding: 2rem 2rem 8rem;
	}

	footer::before {
		width: 110%;
	}


}

@media only screen and (min-width: 768px) {
	body {
		font-size: 1.4rem;
	}
	
	.popup-undangan .mdl-content .popup-img-1 {
		opacity: 1;
	}
	
	.popup-undangan .mdl-content .popup-img-2 {
		opacity: 1;
	}

	.core-side {
		max-height: 38rem;
	}

	.core-0 .core-side.core-0-img-1 {
		bottom: -25%;
	}

	.core-1 .core-side.core-1-img-1 {
		top: 0%;
		max-height: max-content;
	}

	.core-1 .core-side.core-1-img-2 {
		top: 50%;
	}
	
	/* .core-4 .love-side-story {
		width: 45%;
	}

	.core-4 .love-story.left .love-side-story::before {
		left: -53px;
	}
	

	.core-4 .love-story.left .love-side-story::after {
		left: -40px;
		display: none;
	}
	
	.core-4 .love-story.left:first-child .love-side-story::after {
		left: -40px;
		display: none;
	}
	
	.core-4 .love-story.left .content::before {
		left: -53px;
	}
	
	.core-4 .love-story.left .content::after {
		left: -48px;
	}

	
	.core-4 .love-story.right .love-side-story::before {
		right: -46px;
		left: auto;
	
	}
	
	.core-4 .love-story.right .love-side-story::after {
		right: -35px;
		left: auto;
		display: none;
	}

	.core-4 .love-story.right:last-child .love-side-story::after {
		right: -35px;
		left: auto;
		height: 50%;
	}

	
	.core-4 .love-story.right .content::before {
		right: -46px;
		left: auto;
	}
	
	.core-4 .love-story.right .content::after {
		right: -36px;
		left: auto;
	} */

	.core-4 .love-story .circle-border {
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
    }


    .core-4 .love-story.left {
        display: flex;
        justify-content: end;
    }
    
    .core-4 .love-story.left .love-side-story {
        width: 45%;
        
    }

    .core-4 .love-story.right {
        display: flex;
        justify-content: start;
    }

    .core-4 .love-story.right .love-side-story {
        width: 45%;
    }

  
    .core-4 .love-story .circle-border .circle::after {
        left: 9px;
    }
    
	.core-4 .content .meet-time {
		font-size: 1.4rem;
	}

	.core-4 .content .story {
		font-size: 1rem;
	}

	.core-4 .content .meet-time {
		font-size: 1.4rem;
	}

	.core-4 .content .story {
		font-size: 1rem;
	}


	footer {
		border-radius: 122px 122px 0 0;
	  }
}

@media only screen and (min-width: 992px) {
	.core-3 video {
		height: 400px;
	}
	
	.core-3 iframe {
		height: 400px;
	}

	.core-6 .core-side.core-6-img-1 {
		top: 15rem;
	}



	.core-4 .content .meet-time {
		font-size: 1.7rem;
	}

}

@media only screen and (min-width: 1200px) {
	.popup-undangan .mdl-content{
		padding: 4rem 0 5rem;
	}
}

@media only screen and (min-width: 1400px) {
	.popup-undangan .mdl-content{
		padding: 7rem 0 5rem;
	}
}