@charset "UTF-8";
/* CSS Document */

/* CSS RESET */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,input,textarea,blockquote,th,td { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }

/********Overall***********/
body{background-color:#000000; margin:0px 0px 0px 0px; color:#999b9e; letter-spacing: 1px; line-height: 200%; text-align:justify; font-size:18px;font-family:'UniversLTW01-47LightCn',Helvetica Neue,Helvetica,Arial,sans-serif;}

a:link{color:#CD0A1F; text-decoration:none;}
a:active{color:#CD0A1F; text-decoration:none;}
a:visited{color:#999b9e; text-decoration:none;}
a:hover{color:#4eabcf; text-decoration:none;}
.clear{clear:both;}


/*********main image*************/
#cardBackgroundiphone{
	display:none;
	width:100%;
	margin:0 auto;	
	z-index: -1;}
	
#cardBackgroundipad{
	display:none;
	width:768px;
	max-width:768px;
	margin:0 auto;	
	z-index: -1;}

#cardBackground{
	width:1000px;
	max-width:1000px;
	margin:0 auto;	
	z-index: -1;
}


/*********video*************/

.youtubeVideo{
	position:absolute;
	width:390px;
	height:240px;
	margin:0 auto;	
	top:434px;
	left:49.5%;
	margin-left: -249px;
}


/*********social*******/
#twitterButton 

{
	position:absolute;
	width:41px;
	height:41px;
	margin:0 auto;	
	top:327px;
	left:50%;
	margin-left: -69px;
	opacity:.1;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;

}
a:hover #twitterButton{
	
	opacity:1;
}

#facebookButton

{
	position:absolute;
	width:41px;
	height:41px;
	margin:0 auto;	
	top:327px;
	left:50%;
	margin-left: -23px;
	opacity:.1;
	transition: opacity .15s ease-in-out;
   -moz-transition: opacity .15s ease-in-out;
   -webkit-transition: opacity .15s ease-in-out;

}
a:hover #facebookButton{
	
	opacity:1;
}

/****************tapes**********/

#iphoneTop, #iphoneFeliz, #iphoneDeck, #iphoneRudolph, #iphoneHannuk, #iphoneDreidel, #iphoneWex, #iphoneJingle {display:none;}


#felizTape {top:490px;}
#hallsTape {top:522px;}
#rudolphTape {top:553px;}
#hanukkahTape {top:582px;}
#dreidelTape {top:611px;}
#wexTape {top:643px;}
#jingleTape  {top:674px;}

#felizTape, #hallsTape, #rudolphTape, #hanukkahTape, #dreidelTape, #wexTape, #jingleTape
{
	position:absolute;
	width:126px;
	height:20px;
	margin:0 auto;	
	left:50%;
	margin-left: 188px;
	opacity:.01;
	transition: opacity .10s ease-in-out;
   -moz-transition: opacity .10s ease-in-out;
   -webkit-transition: opacity .10s ease-in-out;

}

a:hover #felizTape, a:hover #hallsTape, a:hover #rudolphTape, a:hover #hanukkahTape, a:hover #dreidelTape, a:hover #wexTape, a:hover #jingleTape{
	opacity:1;
}



	

		

/***Final Laptop Responsive****/
@media screen and (max-width:766px) and (min-width:001px){
	#cardBackground{
	width:769px;
	max-width:769px;
	margin:0 auto;	
	z-index: -1;}

	.backgroundStyle{
	width:768px;
	max-width:768px;
	margin:0 auto;	
	z-index: -1;}
	


	#twitterButton{
	width:30px;
	margin-left: -52px;
	height:30px;
	left:385px;
	top:252px;}


	#facebookButton{
	left:385px;
	width:30px;
	margin-left: -17px;
	height:30px;
	top:252px;}
		

	.backgroundStyle{
	width:768px;
	max-width:768px;
	margin:0 auto;	
	z-index: -1;}
	
	#videoBox{
	margin:0 auto;	
	z-index: 2;}

.youtubeVideo{
	left:432px;
	width:312px;
	height:192px;
	top:335px;

}



#felizTape, #hallsTape, #rudolphTape, #hanukkahTape, #dreidelTape, #wexTape, #jingleTape
{		width:104px;		height:18px;		left:385px;
}

#felizTape 	{top:375px;	width:100px;	height:18px;	left:385px; margin-left: 143px;}
#hallsTape 	{top:399px;width:100px;	height:18px;	left:385px; margin-left: 143px;}
#rudolphTape 	{top:423px;width:100px;	height:18px;	left:385px; margin-left: 143px;}
#hanukkahTape 	{top:446px;width:100px;	height:18px;	left:385px; margin-left: 143px;}
#dreidelTape 	{top:470px;width:100px;	height:18px;	left:385px; margin-left: 143px;}
#wexTape 		{top:494px;width:100px;	height:18px;	left:385px; margin-left: 143px;}
#jingleTape  	{top:516px;width:100px;	height:18px;	left:385px; margin-left: 143px;}

}



/***************************** RESPONSIVE IPAD  ***************/
@media screen and (max-width:769px) and (min-width:767px) and (orientation:portrait){
	
	#cardBackgroundipad{
	display:block;}  

	#cardBackground{
	display:none;}


	#twitterButton{
	width:40px;
	margin-left: -52px;
	height:40px;
	left:319px;
	top:407px;}


	#facebookButton{
	width:40px;
	margin-left: -52px;
	height:40px;
	left:372px;
	top:407px;}
		

	.backgroundStyle{
	width:768px;
	max-width:768px;
	margin:0 auto;	
	z-index: -1;}
	
	#videoBox{
	margin:0 auto;	
	z-index: 2;}

.youtubeVideo{
	left:365px;
	width:380px;
	height:286px;
	top:515px;

}



#felizTape 	{top:585px;	width:145px;	height:28px;	left:412px; margin-left: 143px;}
#hallsTape 	{top:622px;width:145px;	height:28px;	left:412px; margin-left: 143px;}
#rudolphTape 	{top:655px; width:145px;	height:28px;	left:412px; margin-left: 143px;}
#hanukkahTape 	{top:689px;width:145px;	height:28px;	left:412px; margin-left: 143px;}
#dreidelTape 	{top:723px;width:145px;	height:28px;	left:412px; margin-left: 143px;}
#wexTape 		{top:758px;width:145px;	height:28px;	left:412px; margin-left: 143px;}
#jingleTape  	{top:793px;width:145px;	height:28px;	left:412px; margin-left: 143px;}



}


/****smaller laptop responsive******/
@media screen and (max-width:849px) and (min-width:770px){


#twitterButton{
	width:30px;
	margin-left: -52px;
	height:30px;
	left:50%;
	top:252px;}


#facebookButton{

	left:50%;
	width:30px;
	margin-left: -17px;
	height:30px;
	top:252px;}
		
	#cardBackground{
	width:769px;
	max-width:769px;
	margin:0 auto;	
	z-index: -1;}

	.backgroundStyle{
	width:768px;
	max-width:768px;
	margin:0 auto;	
	z-index: -1;}
	
	#videoBox{
	margin:0 auto;	
	z-index: 2;}

.youtubeVideo{
	left:56%;
	width:312px;
	height:192px;
	top:335px;

}



#felizTape, #hallsTape, #rudolphTape, #hanukkahTape, #dreidelTape, #wexTape, #jingleTape
{		width:104px;		height:18px;		left:50%;
}

#felizTape 	{top:375px;	width:100px;	height:18px;	left:50%; margin-left: 143px;}
#hallsTape 	{top:399px;width:100px;	height:18px;	left:50%; margin-left: 143px;}
#rudolphTape 	{top:423px;width:100px;	height:18px;	left:50%; margin-left: 143px;}
#hanukkahTape 	{top:446px;width:100px;	height:18px;	left:50%; margin-left: 143px;}
#dreidelTape 	{top:470px;width:100px;	height:18px;	left:50%; margin-left: 143px;}
#wexTape 		{top:494px;width:100px;	height:18px;	left:50%; margin-left: 143px;}
#jingleTape  	{top:516px;width:100px;	height:18px;	left:50%; margin-left: 143px;}




}


/****largest laptop responsive******/
@media screen and (max-width:1000px) and (min-width:850px){

#videoBox{
	margin:0 auto;	
	z-index: 2;}

.youtubeVideo{
		left:493px;
}

#twitterButton{
		left:500px;}

#facebookButton
{
		left:500px;}

#felizTape{
		left:500px;}

#felizTape, #hallsTape, #rudolphTape, #hanukkahTape, #dreidelTape, #wexTape, #jingleTape, #facebookButton, #twitterButton
{		left:500px;}
}

/***************************** RESPONSIVE IPHONE  ***************/

@media only screen and (max-device-width:568px) and (min-device-width:1px){
	#iphoneTop, #iphoneFeliz, #iphoneDeck, #iphoneRudolph, #iphoneHannuk, #iphoneDreidel, #iphoneWex, #iphoneJingle {display:block;}
	#cardBackgroundiphone, 	#cardBackgroundipad, #cardBackgroundipad, 	#cardBackground{
	display:none;}
	.backgroundStyle{
	display:none;}	
	#videoBox{
	display:none;}
.youtubeVideo{
	display:none;
}

#felizTape, #hallsTape, #rudolphTape, #hanukkahTape, #dreidelTape, #wexTape, #jingleTape
{	display:none;
}

	#twitterButton{
	display:none;
	width:40px;
	margin-left: -52px;
	height:40px;
	left:319px;
	top:407px;}


	#facebookButton{
	display:none;
	width:40px;
	margin-left: -52px;
	height:40px;
	left:372px;
	top:407px;}
		


}

		
