/* TV */

	.tv{
		background-image: url(../img/tv.png);
	    background-repeat: no-repeat;
	    background-size: contain;
	    background-position: center;
	    max-width: 800px;
	}
	/*
	.tv *{
		pointer-events: none;
	}
	*/
	.tv figure{
		padding: 0;
    	padding-right: 0;
    	max-width: 800px;

	    mask-image: url(../img/tv_mask.png);
	    mask-repeat: no-repeat;
	    mask-size: contain;
	    mask-position: center;
	}

	.tv figure.is-provider-youtube .wp-block-embed__wrapper{
		left: -10%;
	}
	.tv .epyt-facade-poster{
		text-align: center;
	}

	.tv .tv-glare,
	.tv .tv-fuzz{
		background-repeat: no-repeat;
	    background-position: center;
	    background-size: contain;
	    height: 100%;
	    width: 100%;
	    position: absolute;
	    z-index: 999;
	    left: 0;
	    top: 0;

	    overflow: hidden;

	    pointer-events: none;
	}

	.tv .tv-glare{
	    background-image: url(../img/tv_glare.png);
	}

	.tv.click_block figure *{
		pointer-events: none;
	}

	.tv .tv-fuzz{
	    mix-blend-mode: overlay;
	}

	.tv.active .tv-fuzz::before{
		content: "";
	    position: absolute;
	    width: 100vw;
	    height: 100vw;
	    left: 0;
	    top: -50vw;
		background-image: url(../img/tv_static.png);

		background-size: 1em 1em;

	    -webkit-animation-name: tvStaticAnimation;
	    -webkit-animation-timing-function: linear;
	    -webkit-animation-duration: 0.66s;
	    -webkit-animation-iteration-count: infinite;
	    animation-duration: 0.66s;
	    animation-iteration-count: infinite;
	}

	.tv.active .tv-fuzz::after{
		content: "";
		position: absolute;
		width: 100%;
		height: 5vw;
		top: 0%;
		background: linear-gradient(to bottom, 
			rgba(255, 255, 255, 0) 0%, 
			rgba(255, 255, 255, 1) 50%, 
			rgba(255, 255, 255, 0) 100%);

	    -webkit-animation-name: tvBarAnimation;
	    -webkit-animation-timing-function: linear;
	    -webkit-animation-duration: 5s;
	    -webkit-animation-iteration-count: infinite;
	    animation-duration: 5s;
	    animation-iteration-count: infinite;
	}

	.tv::before{
		content: "";
	    background-image: url(../img/tv_antennae.png);
	    background-repeat: no-repeat;
	    background-position: center;
	    background-size: contain;
	    width: 100%;
	    height: 15vw;
	    position: absolute;
	    margin-top: -15vw;
	    /* z-index: 999; */
	    z-index: -1;
	}

	.tv.block *{
		pointer-events: none;
	}

	.tv-overlay {
		  position: absolute;
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100%;
		  z-index: 10;
		  background: transparent;
	}

	.tv .tv-controls{
	    display: flex;
	    position: absolute;
	    height: 100%;
	    width: 100%;
	    max-width: 800px;
	    left: 0;
	    pointer-events: none;
	    flex-direction: row;
	    justify-content: flex-end;
	    z-index: 999;
	}

	.tv .tv-controls .tv-channels{
		position: absolute;
	    height: 36%;
	    width: 15%;
	    display: flex;
	    top: 13.5%;
	    right: 10.7%;
	    flex-wrap: wrap;
	    align-content: flex-start;
	    pointer-events: all;
	    flex-direction: row;
    	border-radius: 0.33em;
    	overflow: hidden;
	}
	.tv .tv-controls .tv-channels button{
		width: calc(33.3333333333333%);
    	height: calc(33.3333333333333%);
	    padding: 0;
	    margin: 0;
	    background-color: #C3C2BE;
	    border: 2px solid #B9B8B4;
	    box-shadow: 1px 1px 2px 2px rgb(0 0 0);
	}
	.tv .tv-controls .tv-channels button:active{
		background-color: #B9B8B4;
		border-color: #737172;
	}

	.tv {
		display: none;
	}
	.tv.ready{
		display: block;
	}


	@-webkit-keyframes tvBarAnimation {
	  from {
	    opacity: 0;
	    top: 0%;
	    height: 1vw;
	  }
	  50% {
	    opacity: 1;
	    top: 50%;
	    height: 5vw;
	  }
	  to {
	    opacity: 0;
	    top: 100%;
	    height: 1vw;
	  }
	}

	@-webkit-keyframes tvStaticAnimation {
	  from {
	    opacity: 0.2;
	    -webkit-transform: rotate(0deg);
	  }
	 50% {
	    opacity: 0.3;
	  } 
	  to {
	    opacity: 0.2;
	    -webkit-transform: rotate(360deg);
	  }
	}

	/*
	.tv .wp-block-embed__wrapper::before{
	    content: "" !important;
	    width: 100%;
	    height: 100%;
	    position: relative;
	    z-index: 9999;
	    background-color: #000;
	}
	.tv.show .wp-block-embed__wrapper::before{
		background-color: transparent;
	}
	*/