.video-popup-model {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999999999;
	transition: all 0.5s ease;
	opacity: 0;
	font-size: 62.5%;

	&.smooth_show {
		opacity: 1;
	}

    .video-layer{
	   	width: 100%;
		height: 100%;
		background-color: black;
		display: flex;
	    align-items: center;
	    justify-content: center;
	    @media screen and (min-width: 800px) {
	    	background-color: rgba(0,0,0,0.5);
	    }

	    .video-model-close-layer {
	    	width: 100%;
	    	height: 100%;
	    	position: absolute;
	    	top: 0;
	    	left: 0;
	    	right: 0;
	    	bottom: 0;
	    }

	.model-wrapper {
		width: 100%;
		height: auto;
		@media screen and (min-width: 800px) {
			max-width: 65%;
		}

		.videomodel {
			width: 100%;
			height: auto;
			background-color: black;
			 @media screen and (min-width: 800px){
			 	position: relative;
				padding: 1.5rem;
			 	background-color: white;
				border-radius: 2rem;

			 }

			.videoscreen {
				width: 100%;
				border-radius: 2rem;
    			overflow: hidden;
    			background: #000000;

				video , iframe {
					width: 100%;
					object-fit: cover;
					height: auto;
					border: 0;
					outline: none;
					display: block;
				}


			}
		}

		.modelCloseBtn {
			width: 4rem;
			height: 4rem;
			background-color: transparent;
			border: 0.2rem solid white;
			cursor: pointer;
			border-radius: 50%;
			position: absolute;
			top: 1rem;
    		right: 1rem;
			@media screen and (min-width: 800px) {
				background-color: white;
				right:-4rem;
				top: -3rem; 

			}

			&:before, &:after {
				content: ' ';
				width: 0.2rem;
				height: 2.2rem;
				position: absolute;
				left: 1.7rem;
    			top: 0.7rem;
				background-color: white;
				@media screen and (min-width: 800px){
					background-color: black;
				}
				
			}
			&:before {
				transform: rotate(45deg);
			}
			&:after {
				transform: rotate(-45deg);
			}
			&:hover {
				&:before, &:after {
					opacity: 0.8;
				}
			}
		}
	}
	}
}