@keyframes pop {
	0% {
		height: 0%;
	}
	50% {
		height: 0%;
	}
	100% {
		height: 100%;
	}
}

@keyframes show-text {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.pop-up {
	animation: pop 0.8s ease 3s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	background-color: rgba(255, 255, 255, 0.95);
	display: flex;
	justify-content: center;
	height: 0;
	position: fixed;
	overflow: hidden;
    width: 50%;
    margin-left: 25%;
    margin-right: auto;
	z-index: 30;

}

.pop-up .content {
    align-self: center;
    padding: 30px;
    width: 500px; 
}

.pop-up .content p{
        animation: show-text 1s ease 3.3s;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
        /* font-size: 50px; */
        opacity: 0;
        text-align: center;
}

/* POP UP close button */

input[type="checkbox"] {
	display: none;
}

label {
	animation: show-text 0.8s ease 5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
	color: #000000;
	cursor: pointer;
    font-size: 24px;
	right: 27%;
	opacity: 0;
	position: fixed;
	top: 20px;
	z-index: 40;
}

input[type="checkbox"]:checked ~ div.pop-up {
	display: none;
}

input[type="checkbox"]:checked ~ label {
	display: none;
}


@media only screen and (max-width: 767px){

    .pop-up {
        width: 95%;
        margin: 10px;
        
    }

    .pop-up .content p{
        font-size: 14px;
    }

    .pop-up .content h3{
        margin-top: 25px;
    }

    label {
        right: 30px;
        padding-top: 20px;
    }
    
}