body {
	margin: 0px;
}

div { 
	position:absolute; 
	margin:0px; 
	padding:0px;
}

#viewport { 
	width:300px; 
	height:250px; 
	overflow:hidden;
    background-color: #FFFFFF;
    position: relative;
    margin: 0 auto;
}

#border { 
	position: absolute;
	pointer-events: none;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background: url(images/border_300x250.png) no-repeat;
}

#clickable { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background-color: white;
	opacity: 0;
}

#background { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background: url(images/background.png) no-repeat;
}

#mainMask { 
	position:absolute;
	left:26px;
	top:25px;
	width: 124px; 
	height: 149px;
	overflow: hidden;
}

#logo { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background: url(images/logo.png) no-repeat;
}

#logo2 { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background: url(images/logo2.png) no-repeat;
}

#legalBtn { 
	position: absolute;
    left: 168px;
    top: 169px;
	width:110px; 
	height:9px; 
	background: url(images/legalBtn.png) no-repeat;
}

#legalPanel { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:250px; 
	background: url(images/legalPanel.png) no-repeat;
	pointer-events: none;
}

/*#frame { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:300px; 
	height:600px; 
	background: url(images/frame.png) no-repeat;
}*/

#smallFrame { 
	position: absolute;
    left: 18px;
    top: 21px;
	width:272px; 
	height:323px; 
	background: url(images/smallFrame.png) no-repeat;
}

#image1 { 
	position: absolute;
    /*left: 24px;
    top: 30px;*/
    left: 1px;
    top: -1px;
	width:256px; 
	height:307px; 
	background: url(images/image1.jpg) no-repeat;
}

#image2 { 
	position: absolute;
    left: 30px;
    top: 3px;
	width:256px; 
	height:307px; 
	background: url(images/image2.jpg) no-repeat;
}

/*#image22 { 
	position: absolute;
    left: 25px;
    top: 34px;
	width:256px; 
	height:307px; 
	background: url(images/image2.jpg) no-repeat;
}*/

#image2Mask { 
	position:absolute;
	left:-25px;
	top:0px;
	width: 302px; 
	height: 250px;
	/*overflow: hidden;*/
}

#oldGoggles { 
	position: absolute;
    left: 12px;
    top: 25px;
	width:213px; 
	height:118px; 
	background: url(images/oldGoggles.png) no-repeat;
}

#newGoggles { 
	position: absolute;
    left: 5px;
    top: 6px;
	width:238px; 
	height:167px; 
	background: url(images/newGoggles.png) no-repeat;
}

#text1 { 
	position: absolute;
    left: 187px;
    top: 70px;
	width:74px; 
	height:39px; 
	background: url(images/text1.png) no-repeat;
}

#text2 { 
	position: absolute;
    left: 175px;
    top: 113px;
	width:100px; 
	height:18px; 
	background: url(images/text2.png) no-repeat;
}

#text3 { 
	position: absolute;
    left: 167px;
    top: 68px;
	width:115px; 
	height:20px; 
	background: url(images/text3.png) no-repeat;
}

#text4 { 
	position: absolute;
    left: 192px;
    top: 91px;
	width:66px; 
	height:18px; 
	background: url(images/text4.png) no-repeat;
}

#text5 { 
	position: absolute;
    left: 170px;
    top: 112px;
	width:110px; 
	height:15px; 
	background: url(images/text5.png) no-repeat;
}

#text6 { 
	position: absolute;
    left: 173px;
    top: 43px;
	width:101px; 
	height:83px; 
	background: url(images/text6.png) no-repeat;
}

#graphics1 { 
	position: absolute;
    left: -37px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/graphics_1.png) no-repeat;
}

#innerGraphics1 { 
	position: absolute;
    left: -37px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/innerGraphics.png) no-repeat;
}

#arrow1 { 
	position: absolute;
    left: -37px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/arrow2.png) no-repeat;
}

#graphics2 { 
	position: absolute;
    left: 15px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/graphics2_1.png) no-repeat;
}

#innerGraphics2 { 
	position: absolute;
    left: 15px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/innerGraphics2.png) no-repeat;
}

#arrow2 { 
	position: absolute;
    left: 15px;
    top: -29px;
	width:184px; 
	height:181px; 
	background: url(images/arrow1.png) no-repeat;
}

#largeGraphic { 
	position: absolute;
    left: -100px;
    top: -125px;
	width:543px; 
	height:586px; 
	background: url(images/largeGraphic.png) no-repeat;
}

#cta { 
	position: absolute;
	overflow: hidden;
    left: 171px;
    top: 137px;
	width:104px; 
	height:26px; 
	background-color: #d2202f;
}

#ctaOver { 
	position: absolute;
    left: 0px;
    top: 0px;
	width:104px; 
	height:26px;  
	background: #FFF;
}

#ctaTxt { 
	position: absolute;
    left: 10px;
    top: 9px;
	width:107px; 
	height:12px; 
	background: url(images/ctaTxt.png) no-repeat;
}

#sheen { 
	position: absolute;
    left: -80px;
    top: -5px;
	width:79px; 
	height:58px; 
	background: url(images/sheen.png) no-repeat;
}