body{
margin:0px;
}

#container{
	width:300px;
	height:250px;
	overflow:hidden;
}

#ad{
   position: absolute;
   display: block;
   left:0px;
   border: rgb(145,153,153) 1px solid;
   overflow:hidden;
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -ms-user-select: none;
   user-select: none;
   width: 298px;
   height: 248px;
}

#banner{
  position:absolute;
  display: block;
  width: 298px;
  height: 248px;
  right:0px;
  overflow: hidden;
  background-color:#e9e9e7;
}

#hotSpot{
  position: absolute;
  display: block;
  top:0;
  left:0;
  width: 300px;
  height: 250px;
  cursor:pointer;
  background-color:white;
  opacity:.01;
}

/*========================================= FRAME 0 =========================================*/


/*#frame0{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:0;
}

#t1a{
	position:absolute;
	width:203px;
	height:43px;
	top:88px;
	left:31px;
	background:url(spriteSheet.png) 0 0;
	opacity:0;
}

#t1b{
	position:absolute;
	width:232px;
	height:42px;
	top:131px;
	left:31px;
	background:url(spriteSheet.png) 0 -43px;
	opacity:0;
}

#t1c{
	position:absolute;
	width:162px;
	height:55px;
	top:173px;
	left:31px;
	background:url(spriteSheet.png) 0 -85px;
	opacity:0;
}

#t2{
	position:absolute;
	width:144px;
	height:111px;
	top:278px;
	left:30px;
	background:url(spriteSheet.png) 0 -140px;
	opacity:0;
}

#logoStart{
	position:absolute;
	width:117px;
	height:63px;
	top:449px;
	left:30px;
	background:url(spriteSheet.png) 0 -251px;
	opacity:0;
}*/

/*========================================= FRAME 1 =========================================*/

#frame1{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:0px;
}

.circleStartPos{
	position:absolute;
	top: 38px;
	left: 37px;
}

#circleS {
	width:67px;
	height:67px; 
}

.circle {
	position:absolute;
	border-radius:50%;
	width:67px;
	height:67px; 
	top:0;
	left:0;
	background-color:#abdef8;
}

#sChar{
	position:absolute;
	width:22px;
	height:25px;
	top:22px;
	left:23px;
	background:url(spriteSheet.png) 0 0;
}

#oneGB_Start{
	position:absolute;
	width:29px;
	height:14px;
	top:113px;
	left:56px;
	background:url(spriteSheet.png) -75px -75px;
}

#iceCreamS{
	position:absolute;
	width:113px;
	height:232px;
	top:18px;
	left:157px;
	background:url(spriteSheet_2.jpg) 0 0;
}

/*========================================= FRAME 2 =========================================*/

#frame2{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:300px;
}

#circleM {
	width:67px;
	height:67px; 
}

#mChar{
	position:absolute;
	width:25px;
	height:24px;
	top:22px;
	left:21px;
	background:url(spriteSheet.png) 0 -25px;
}

#threeGB_Start{
	position:absolute;
	width:32px;
	height:13px;
	top:113px;
	left:54px;
	background:url(spriteSheet.png) -75px -93px;
}

#iceCreamM{
	position:absolute;
	width:113px;
	height:232px;
	top:18px;
	left:157px;
	background:url(spriteSheet_2.jpg) -113px 0;
}

/*========================================= FRAME 3 =========================================*/

#frame3{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:300px;
}

#circleL {
	width:67px;
	height:67px;  
}

#lChar{
	position:absolute;
	width:20px;
	height:27px;
	top:20px;
	left:26px;
	background:url(spriteSheet.png) 0 -48px;
}

#sixGB_Start{
	position:absolute;
	width:32px;
	height:13px;
	top:113px;
	left:55px;
	background:url(spriteSheet.png) -75px -110px;
}

#iceCreamL{
	position:absolute;
	width:113px;
	height:232px;
	top:18px;
	left:157px;
	background:url(spriteSheet_2.jpg) -226px 0;
}

/*========================================= FRAME 4 =========================================*/

#frame4{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:300px;
}

#circleXL {
	width:67px;
	height:67px;  
}

#xlChar{
	position:absolute;
	width:39px;
	height:25px;
	top:22px;
	left:15px;
	background:url(spriteSheet.png) 0 -75px;
}

#twelveGB_Start{
	position:absolute;
	width:38px;
	height:13px;
	top:113px;
	left:51px;
	background:url(spriteSheet.png) -75px -128px;
}

#iceCreamXL{
	position:absolute;
	width:113px;
	height:232px;
	top:18px;
	left:157px;
	background:url(spriteSheet_2.jpg) -339px 0;
}

/*========================================= FRAME 5 =========================================*/

#frame5{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:300px;
}

#circleXXL {
	width:67px;
	height:67px;  
}

#xxlChar{
	position:absolute;
	width:59px;
	height:24px;
	top:22px;
	left:4px;
	background:url(spriteSheet.png) 0 -100px;
}

#eighteenGB_Start{
	position:absolute;
	width:38px;
	height:13px;
	top:113px;
	left:51px;
	background:url(spriteSheet.png) -75px -145px;
}

#iceCreamXXL{
	position:absolute;
	width:113px;
	height:232px;
	top:18px;
	left:157px;
	background:url(spriteSheet_2.jpg) -449px 0;
}


/*========================================= FRAME 6 =========================================*/

#frame6{
	position:absolute;
	width:300px;
	height:250px;
	top:0;
	left:300px;
}

#frame6 .circle {
	width: 44px;
	height: 44px;
}

#t3a{
	position:absolute;
	width:128px;
	height:24px;
	top:30px;
	left:26px;
	background:url(spriteSheet.png) -76px 0px;
}

#t3b{
	position:absolute;
	width:128px;
	height:24px;
	top:54px;
	left:26px;
	background:url(spriteSheet.png) -76px -24px;
}

#t3c{
	position:absolute;
	width:99px;
	height:28px;
	top:54px;
	left:154px;
	background:url(spriteSheet.png) -204px -24px;
}

#circleS_End {
	position: absolute;
	width:44px;
	height:44px; 
	top: 103px;
	left: 20px;
}

#circleS_End #sChar {
	width: 13px;
	height: 16px;
	top: 14px;
	left: 16px;
	background:url(spriteSheet.png) 0 -126px;
}

#oneGB_End{
	position:absolute;
	width:29px;
	height:14px;
	top:153px;
	left:27px;
	background:url(spriteSheet.png) -75px -75px;
}

#circleM_End {
	position: absolute;
	width:44px;
	height:44px; 
	top: 103px;
	left: 73px;
}

#circleM_End #mChar {
	width: 16px;
	height: 16px;
	top: 14px;
	left: 15px;
	background:url(spriteSheet.png) 0 -144px;
}

#threeGB_End{
	position:absolute;
	width:32px;
	height:13px;
	top:153px;
	left:80px;
	background:url(spriteSheet.png) -75px -93px;
}

#circleL_End {
	position: absolute;
	width:44px;
	height:44px; 
	top: 103px;
	left: 126px;
}

#circleL_End #lChar {
	width: 11px;
	height: 16px;
	top: 14px;
	left: 18px;
	background:url(spriteSheet.png) 0 -162px;
}

#sixGB_End{
	position:absolute;
	width:32px;
	height:13px;
	top:153px;
	left:132px;
	background:url(spriteSheet.png) -75px -110px;
}

#circleXL_End {
	position: absolute;
	width:44px;
	height:44px; 
	top: 103px;
	left: 179px;
}

#circleXL_End #xlChar {
	width: 24px;
	height: 16px;
	top: 14px;
	left: 11px;
	background:url(spriteSheet.png) 0 -180px;
}

#twelveGB_End{
	position:absolute;
	width:38px;
	height:13px;
	top:153px;
	left:182px;
	background:url(spriteSheet.png) -75px -128px;
}

#circleXXL_End {
	position: absolute;
	width:44px;
	height:44px; 
	top: 103px;
	left: 232px;
}

#circleXXL_End #xxlChar {
	width: 37px;
	height: 16px;
	top: 14px;
	left: 4px;
	background:url(spriteSheet.png) 0 -198px;
}

#eighteenGB_End{
	position:absolute;
	width:38px;
	height:13px;
	top:153px;
	left:235px;
	background:url(spriteSheet.png) -75px -145px;
}

#logoEnd{
	position:absolute;
	width:80px;
	height:20px;
	top:207px;
	left:28px;
	background:url(spriteSheet.png) -76px -48px;
}

#cta{
	position:absolute;
	width:71px;
	height:21px;
	top:205px;
	left:200px;
	background:url(spriteSheet.png) -229px -52px;	
	overflow:hidden;
}

#ctaGleam{
	position:absolute;
	width:71px;
	height:21px;
	top:0px;
	left:-75px;
	background:url(spriteSheet.png) -229px -73px;	
	opacity:.5;
}