
@keyframes tv-on {
	
	
	0%{
		
		transform: scale(2%);
		
		
	}
	80%{
		
		
		transform: scale(2%);
		
		
	}
	
	100%{
		
		
		transform: scale(100%);

		
		
	}
	
	
	
}


@keyframes tv-off {
	
	
	0%{
		
		transform: scale(0%);
		opacity: 1;
		
	}
	80%{
		
		
		transform: scale(2%);
		
		
	}
	
	100%{
		
		
		transform: scale(100%);

		opacity: 0;
		
	}
	
	
	
}


/*#logodiv:hover{
	
	
	
	filter: drop-shadow(7px 7px 1px white);		

	
}*/
	
	
	
@keyframes whiteshine{


0%{
	
	
	drop-shadow: (7px 7px 1px white);
	
}



50%{
	
	
	
	drop-shadow:(20px 20px 1px white);
	
	
}	


100%{
	
	drop-shadow: (7px 7px 1px white);
	
}
}
@keyframes fadeinlogo{
	
	0% {
		
	opacity: 0;
		
		
	}
	
	100%{
		
		
	opacity: 1;

		
	}
	
	
	
}





@keyframes zoom-in{
	
	0%{
	
	transform: scale(100%);	
	}
	
	
	100%{
		
		transform: scale(120%);
	}
	
}

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

		
	}
	
	
	
}


body p{
	
font-family: "brush-script-std", sans-serif;
/* display: relative;
position: relative;
align-items: center; */
justify-content: center;
	/* 
font-weight: 400;
font-style: normal;
text-align: center;
font-size: 500%;
 */
 
 
 text-align: center;
}


#container{
	
	
	display: relative;
	position: relative;
	margin-left: 30%;

	font-family: "poppins", sans-serif;

	justify-content: center;
	align-items: center;
	
}



form{



justify-content: center;
	align-items: center;
	
	display: block;	
	
	
	
}



#launch{
	
	
	font-weight: 400;
	font-size: 500%;
	opacity: 0;
	top: 45%;
	font-family: "poppins", sans-serif;
	font-size: 150%;
	justify-content: center;
	text-align: center;
	display: relative;
	position: relative;

	/* font-weight: 200;
	font-style: normal; */

	animation: fadeinlogo 1s 2.5s forwards;

	
}

#blurb{
	
	justify-content: center;

	font-weight: 400;
	/* font-size: 500%; */
	/* opacity: 0; */
	top: 15%;
	font-family: "poppins", sans-serif;
	/* font-size: 150%; */
	display: flex;
	margin-left: 25%;
	position: relative;
	align-items: center;
	text-align: center;
	
	width: 50%;
	max-width: 45%;
	

	/* font-weight: 200;
	font-style: normal; */

	/* animation: fadeinlogo 1s 2.5s forwards; */
	
	
	
}

#list{
	
	justify-content: center;

	font-weight: 400;
	/* font-size: 500%; */
	/* opacity: 0; */
	top: 15%;
	font-family: "poppins", sans-serif;
	/* font-size: 150%; */
	display: flex;
	margin-left: 25%;
	position: relative;
	align-items: center;
	text-align: center;
	
	width: 50%;
	max-width: 45%;
	

	/* font-weight: 200;
	font-style: normal; */

	/* animation: fadeinlogo 1s 2.5s forwards; */
	
	
}

#weproduce{
	
	justify-content: center;

	font-weight: bold;
	text-shadow: 1px 1px;
	/* font-size: 500%; */
	/* opacity: 0; */
	padding-top: 20px;
	top: 15%;
	font-family: "jaf-mashine", sans-serif;
	/* font-size: 150%; */
	display: flex;
	margin-left: 25%;
	position: relative;
	align-items: center;
	text-align: center;
	
	width: 50%;
	max-width: 45%;
	

	/* font-weight: 200;
	font-style: normal; */

	/* animation: fadeinlogo 1s 2.5s forwards; */
	
	
}


.blink {
	
	animation: blink 1s infinite;
	
}

@keyframes blink{
	

0% { opacity: 0;}

50% { opacity: 1;}

100% { opacity: 0;}	
	
	
}







#logodiv{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 25px;

	/*place-items: center;
	position: relative;

	min-height: 380px;

	margin-top: 10px;
	margin-bottom: 0;

	overflow: hidden;
*/
    

	/* z-index: 111; */
	/* overflow: hidden; */
/* 	
display: grid;
place-items: center;

background-color: blue;
	border-color: red;

position: relative;


top: 50%;
left: 50%;
height: 75%;
width: 35%;
margin: auto;

transform: scale(123%);
align-items: center;
justify-content: center;
min-width: 60%;
width: 100%;	
width: 100%;
height: 100%;

background-color: transparent;
transform: scale(100%);
filter: drop-shadow(7px 7px 1px white);
filter: drop-shadow(2px 2px 2px black);		

 
	transition: filter 0.3s ;
 	animation: zoom-in 1s 2s forwards;
	animation: whiteshine 1s 2s forwards;
	background-color: red;
	
	transform-origin: center;

 

		overflow: hidden;
	 */
}


#mask{
	
	position: absolute;
	/* z-index: 27; */
	/* background-color: purple; */
	
	/* mask-image: image(url("tvset003R.png")); */
	z-index: 99;
	/* overflow: hidden; */
	
	
}




.television {
	
 	
	position: absolute;
	
	overflow: hidden;
	
	
	
}

/* #tvscreen{
	opacity: .4;
	z-index: 94;
	
}
*/

#tvscreen img{
	
	overflow: hidden;
	
	
} 
	
#scanlines{
	position: absolute;
	opacity: .2;	
	z-index: 93;
}



#logo02{
z-index: 15;
/* display: flex; */
	position: absolute;
	/* top: 33%; */
	/* left: 0;
	width: 100%;
	max-width: 250%;

	height: auto; */
	/* transform: scale(200%); */
	/* animation: whiteshine 1s 4s forwards; */
	


	
/* 
	 align-items: center;
	justify-content: center; 
	filter: box-shadow(10px 10px 10px 10px white);
	/* box-shadow: 0 0 10px white; */
	opacity: 0;
	animation: fadeinlogo 1s 3s forwards;
	
}





/* 	display: flex;
	position: absolute;
	

	
	justify-content: center;
	align-items: center;
	width: 100%;
	margin: auto;
	
	height: 100%;
	top: 50%;
	left: 50%;
	
	width: 150px;
	height: 150px;
	
	background-color: orange; */





#tvimg{
	
	z-index: 21;
	position: absolute;
	overflow: hidden;
	/*top: 90;
	left: 0;
	
	width: 40%;
	height: 40%;
	max-width: 40%;
	height: auto;
		transform-origin: center;

	
	
	 */

	
	
	z-index: 99;
/* 	overflow: hidden; */
}

#tv2 {
	
	
	/* z-index: 19;
	display: flex;
	align-items: center;
	justify-content: center; */
	opacity: .2;
	
	
	animation: tv-opacity 1s 2s forwards;
	transform: scale(2%);
	animation: tv-on 2s .1s forwards;
	
	
	
}



#tv {
	
	
		z-index: 20;

	
/* 	display: flex;
	align-items: center;
	justify-content: center; */
	opacity: .2;
	
	

 	animation: tv-opacity 1s 2s forwards;
	transform: scale(2%);
	animation: tv-on 2s .1s forwards;
}




#logo02{
	position: absolute;
	width: 150px;
	
	transform: scale(150%);
	
	/* 
	display: absolute;
	
  
	
	border-color: red;

	width: 35%;
	height: 80%;
	margin-left: 2%;
	margin-top: 5%;
	top: 50%;
	left: 50%;
	/* max-width: 50%;
	max-height: 40%;
	align-items: center;
	justify-content: center;
	
	filter: drop-shadow(5px 5px 5px black);		 */

 
	

   
}
 
#flag-bkg {
	
	transform: scale(200%);
	visibility: hidden;
	
	
}

 
 #OFF {
	 
	 /* position: absolute;
	 opacity: 1;

	  	animation: tv-opacity 1s 2s reverse; */

	
	/*animation: tv-off 1s .1s forwards;*/
 }
 


/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	
#logodiv {
	top: 20%;
	width: 200%;
	margin-left: -120px;
	max-width: 600px;
	  	transform: scale(80%);

	  
}
 
/* body {background: red;} */


#launch {
	top: 35%;
	
	
}



}


	/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  /* body {background: green;} */
  
	
	#logodiv {
	top: 20%;
	transform: scale(80%);

	
	  
	  
}


#launch {
	top: 35%;
	
	
}

}



#launch {
	top: 28%;
	
	
}

	


	

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	
  /* body {background: blue;} */

#logodiv {
	top: 20%;
	transform: scale(80%);

	
	  
	  
}

}





/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	
	
/* body {background: orange;} */

#logodiv {


	/* top: 30%;
	transform: scale(80%); */

	position: relative;
	  
	  
}



}



/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1300px) {
/*   body {background: pink;} */
  
  
}



#logo02 img{


	transition: filter 0.2s ease;

}

#logodiv:hover #logo02 img{

	filter:
		drop-shadow(4px 0px 1px white)
		drop-shadow(-4px 0px 1px white)
		drop-shadow(0 4px 1px white)
		drop-shadow(0 -4px 1px white);
		




}


.television img {


	transition: filter 0.3s ease;



}


#logodiv{

	position: relative;
	/* transition: box-shadow 0.25s; */



}


#logodiv::after{


	content: "";
	position: absolute;

	left 50%;
	bottom: 18px;

	width: 260;
	height: 24px;

	transform: translateX(-50%) scale(0.8);
	 background: rgba(0, 0, 0, 0.45);

	 border-radius: 50%;
	 filter: blur(10px);


	 opacity: 0;

	 transition: opacity 0.25s ease,
	 transform 0.25s ease;

	 pointer-events: none;
	 z-index: -1;



}





#logodiv:hover .television img {



	/* filter: drop-shadow(0 10px 8px rgba(0, 0, 0, 0.35))!important; */




}



#logodiv:hover::after{


	opacity: 1;
	transform: translateX(-50%) scale(1);




}
/* 
#logodiv:hover {


	box-shadow: 0 12px 18px rgba(0, 0, 0, 0.35); 



} */

.tv-ground-shadow {


	position: absolute;
	width: 280px;
	height: 18px;

	left: 50%;
	bottom: 5px;

	transform: translateX(-50%) scale(0.8);
	background: rgba(0, 0, 0, 0.18);
	border-radius: 50%;
	 
	filter: blur(8px);
	opacity: 0;

	transition: opacity 0.25s ease, transform 0.25s ease;

	pointer-events: none;
	z-index: 0;



}


#logodiv:hover .tv-ground-shadow{


	opacity: 1;
	transform: translateX(-50%) scale(1);



}


#tvimg img{


	transition: filter 0.3s ease, transform 0.3 ease;




}


/* 
#logodiv:hover #tvimg img{



	filter:
	    drop-shadow(8px 0px 10px white)
		drop-shadow(-8px 0px 1px white)
		drop-shadow(0 8px 1px white)
		drop-shadow(0 -8px 1px white);
	



} */


.enter-text {


	text-align: center;
	margin-top: 18px;

	transform: translateY(-40px);

	font-size: 22px;
	font-weight: 500;
	letter-spacing: 3px;

	color: #444;
	cursor: pointer;

	transition: al o.25s ease;

	



}


.enter-text:hover {


	filter: drop-shadow(0px 0px 1px black);

	

}