body, html { height:100%; width:100%; margin:0; padding:0; }

@font-face {
    font-family:Phenomena-Regular;
    src: url(font/Phenomena-Regular.otf);
}
@font-face {
    font-family:Phenomena-Bold;
    src: url(font/Phenomena-Bold.otf);
}

.cont { width:80%; padding:0 10%;}

.orange {color:#FFA600;background:#000;}
.yellow {color:#FFDA00; background:#000; padding:0 6px; }

a {color:#FFDA00; background:#000; padding:0 2px ; text-decoration:none; cursor:pointer; }
a:hover {opacity:0.9;}
.content { height:100%; }

.container {   height:100%; width: 100%; }
body { 
    background-image: url("imgs/bg.jpg");
overflow: hidden;position: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	font-family: Phenomena-Regular, Open Sans, Serif;
	font-weight:100;
}


.logo { margin:0 auto;text-align:center; }
.logo img {max-height:100%;  }
.logo a {background:none;}


video  {text-align:center; width:296px; height:638px; position:absolute;left:50%; top:50%; margin:-249px 0 0 -148px; z-index:55;  }

.phone { position:absolute;left:50%; top:50%; margin:-318px 0 0 -246px; z-index:0;   }
.phone img {max-height:100%; height:841px; width:492px;  }


.text { width:400px; height: 240px; font-size:2.4em; position:absolute; top:50%; margin-top:-120px; left:10vw; display:block; opacity:1; }


.apple { position:absolute; top:50%; left:70vw; display: block; width:200px; margin-top:-24px;}
.apple a { display:block; font-size:24px; text-decoration:none; background:url(imgs/apple.png) no-repeat; padding:0 0 0 48px;
color:#000; font-family:Phenomena-Bold;}
.apple a:hover {opacity:0.8;}


.fix { font-family:Phenomena-Bold; margin-bottom:0.4em;	}
.line {
	position: absolute;
	opacity: 0;
	

}

.copy {position: absolute; width:100%; text-align: center; bottom:1em; font-size:0.8em; }


@media all and (max-width: 1366px) 

{
	
	.logo img {width:240px;}
	video  {text-align:center; width:228px; height:487px; position:absolute;left:50%; top:50%; margin:-209px 0 0 -114px; z-index:55;  }

.phone { position:absolute;left:50%; top:50%; margin:-260px 0 0 -188px; z-index:0;   }
.phone img {max-height:100%; height:638px; width:376px;  }


.text { width:320px; height: 240px; font-size:2em; position:absolute; top:50%; margin-top:-120px; left:10vw; display:block; opacity:1; }



} 



@media all and (max-width: 1024px) 

{
.text { width:200px; height: 240px; font-size:18px; position:absolute; top:50%; margin-top:-60px; left:10vw; display:block; opacity:1;}
	
	
	}






/* ----------- iPhone X ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) 

{ 
	.logo { margin:10% auto;text-align:center; }
		
	.logo img {width:800px;}
	video  { display:none;  }

.phone { display:none;   }

.text { width:80vw; height:80vh; font-size:6em; position:absolute; top:50%; left:50%; margin:-20vh 0 0 -40vw; display:block; opacity:1; text-align:center; }


.apple { position:absolute; left:50%; top:80%; display: block; width:340px; height:180px; margin-left:-170px;}
.apple a { display:block; font-size:48px; text-decoration:none; background:url(imgs/apple_black.png) no-repeat; display:inline-block; height:180px;
color:#000; font-family:Phenomena-Bold; padding:14px 0 0 120px}
	
.copy {position: absolute; width:100%; text-align: center; bottom:1em; font-size:2em; }	
	  
}




/* ----------- iPhone 6+, 7+ and 8+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) 

{ 

	.logo { margin:5% auto;text-align:center; }
		
	.logo img {width:600px;}
	video  { display:none;  }

.phone { display:none;   }

.text { width:80vw; height:80vh; font-size:5em; position:absolute; top:50%; left:50%; margin:-20vh 0 0 -40vw; display:block; opacity:1; text-align:center; }


.apple { position:absolute; left:50%; top:80%; display: block; width:340px; height:180px; margin-left:-170px;}
.apple a { display:block; font-size:48px; text-decoration:none; background:url(imgs/apple_black.png) no-repeat; display:inline-block; height:180px;
color:#000; font-family:Phenomena-Bold; padding:14px 0 0 120px}
	
.copy {position: absolute; width:100%; text-align: center; bottom:1em; font-size:2em; }	
	  
}
	


/* ----------- iPhone s ----------- */
	
	@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)

	{
	.logo { margin:5% auto;text-align:center; }
		
	.logo img {width:600px;}
	video  { display:none;  }

.phone { display:none;   }

.text { width:80vw; height:80vh; font-size:5em; position:absolute; top:50%; left:50%; margin:-20vh 0 0 -40vw; display:block; opacity:1; text-align:center; }


.apple { position:absolute; left:50%; top:80%; display: block; width:340px; height:180px; margin-left:-170px;}
.apple a { display:block; font-size:48px; text-decoration:none; background:url(imgs/apple_black.png) no-repeat; display:inline-block; height:180px;
color:#000; font-family:Phenomena-Bold; padding:14px 0 0 120px}
	
.copy {position: absolute; width:100%; text-align: center; bottom:1em; font-size:2em; }	
}