/* reset */
 
html, body, object, img {
    margin: 0;
    padding: 0;
	}

a:active, a:hover { outline: 0; }
img { border: 0; }

/* structure */

#content{
	width: 300px;
	height: 600px;
	overflow: hidden;
	position: relative;
	/*background: url(images/bg2.jpg) 0px 0px no-repeat;*/
    background: #000734;
	}

#border{ 
	position: absolute;
    top: 0px;
    left: 0px;
    width: 298px;
    height: 598px;
    overflow: hidden;
    display: block;
    border: 1px solid #000000;
	z-index: 800;
}

/* elements */

#overlay, #copy1, #copy2, #copy3, #copy4, #cta, #bg_device, #badge, #screen2, #screen3, #bgIMG, #legal-1, #legal_btn, #legal-open, #clickthrough {
    width: 300px;
	height: 600px;
	display: block;
	opacity: 0;
	position: absolute;
    top: 0;
    left: 0;
	}

#clickthrough{
	z-index: 999;
	cursor: pointer;
}

#bg_device{
	background: url(images/img_bg.jpg) 0 0 no-repeat; opacity: 1;
}

#screen2{
	background: url(images/screen_2.png) 0 0 no-repeat; opacity: 0;
}
#screen3{
	background: url(images/screen_3.png) 0 0 no-repeat; opacity: 0;
}


#badge{ background: url(images/badge.png) 0 0 no-repeat; opacity: 1;}
#cta{ background: url(images/cta.png) 0 0 no-repeat; opacity: 1;}

#overlay{
	
	
	background-color: #000734; opacity: 0;
}


#copy1{
	background: url(images/copy_1.png) 0 0 no-repeat; opacity: 1;
}
#copy2{
	background: url(images/copy_2.png) 0 0 no-repeat; opacity: 1;
}
#copy3{
	background: url(images/copy_3.png) 0 0 no-repeat; opacity: 0;
}
#copy4{
	background: url(images/copy_4.png) 0 0 no-repeat; opacity: 0;
}

#leftHolder{
	width: 300px;
	height: 250px;
	display: block;
	position: absolute;
	overflow: hidden;
    top: 0px;
    left: 300px;
    opacity: 1;
    z-index: 260;
}

#rightHolder{
	width: 300px;
	height: 250px;
	display: block;
	position: absolute;
	overflow: hidden;
    top: 0px;
    left: 300px;
    opacity: 1;
    z-index: 260;
}

#legal-1{
	top: 0;
	left: 0;
	z-index: 888;
	opacity: 0;
	background: url(images/legal_1.png) 0px 0px no-repeat;
	}

#legal_btn{
	top: 0;
	left: 0;
	opacity: 1;
	background: url(images/legal_btn.png) 0 0 no-repeat;
	}

#legal-open{
    position: absolute;
    width: 50px;
    height: 20px;
    top: 0px;
    left: 250px;
    cursor: pointer;
    opacity: 0;
    z-index: 9999;
	display: block;
    }

a.click-through{
     position: absolute;
     width: 300px;
     height: 250px;
     top: 0px;
     left: 0px;
     cursor: pointer;
     opacity: 0;
     z-index: 999;
     background: #ffffff;
}


.show{
	display: block !important;
	}

/* Animations */

.animClass {
	-webkit-transform: translate3d(0, 0, 0); /* Force Hardware Acceleration */
}
	
/* transitions */	


.transition-2{
	-webkit-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
.transition-3{
	-webkit-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}


/* fades */

.fade-in{ opacity: 1 !important; }

.fade-out{ opacity: 0 !important; }

.fade-half{ opacity: 0.9 !important; }