@import url(https://fonts.googleapis.com/css?family=Open+Sans:400, 600, 700);

			
body { margin:0; padding: 0;  font-family: 'Open Sans', sans-serif;}
a#myAdLink {display:inline-block; background-color:#f2f4f5; text-decoration: none; color: inherit}

div{
   -webkit-perspective: 1000;
 	-webkit-backface-visibility: hidden;
}

*{
   user-drag: none; 
  -moz-user-select: none;
  -webkit-user-drag: none;
}
#myAd{
	width: 300px; height:250px;
	position: relative;
	overflow: hidden;
	opacity:0;
				
}
#border{
	box-sizing: border-box;
	border: 1px solid black;
	z-index:10;
	position: absolute;
	width: 300px; height:250px;				
}

#myAd .myAd_Img { 
	position: absolute; 
	background: url(graphics.png) no-repeat 0px 0px; 
}

#myAd #myAd_logo{
	position: absolute;
	width: 123px; height:35px; 
    background: url("LOGOAMEX_FlatBox.svg");
    background-size: 123px 35px;
	bottom:18px;
	left:7px;
}

#myAd #beReady{
	position: absolute;
	width: 274px; height: 51px; 
	background: url(willYouBeReady.svg) no-repeat 0px 0px; 
	top:9px;
	left:13px;
}

#cta{
	position: absolute;
	top:198px;
	left:201px;
	display:block;
	width:89px;
	height:23px;
	background-color: #05337d;
	border-radius: 4px;
    color: #fff;
	padding-top:4px;
    line-height: 20px;
    text-align: center;
	letter-spacing: .4px; 
	font-size: .7em;
	font-weight:100;
	opacity:0;
	z-index: 10;
}

.shine {
	position:absolute;
	top:0;
	left:0;
	background: rgba(255,255,255,0);
	background-repeat: no-repeat;
	background: -webkit-gradient(left top, right bottom, color-stop(22%, rgba(255,255,255,0)), color-stop(25%, rgba(255,255,255,.5)), color-stop(49%, rgba(255,255,255,0)));
	background: linear-gradient(135deg, rgba(255,255,255,0) 22%, rgba(255,255,255,.5) 49%, rgba(255,255,255,0) 76%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff', GradientType=1 );
	background-repeat: no-repeat;
	border-radius: 10px;
	z-index: 9999;
}

#shine {
	width: 88px;
	height: 28px;
	background-size: 88px 28px;
	background-position: -78px 0;
}

#footer_slant{
	position:absolute;
	bottom:-3px;
	width: 300px;
	height: 250px;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHdpZHRoPSI2MDAuMTM3cHgiIGhlaWdodD0iMTYuMDA0cHgiIHZpZXdCb3g9IjAgMCA2MDAuMTM3IDE2LjAwNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNjAwLjEzNyAxNi4wMDQiCgkgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+Cjxwb2x5Z29uIGZpbGw9IiMxQzM2NjQiIHBvaW50cz0iNjAwLjEzNywxNi4wMDQgNjAwLjEzNywwIDAsMTYuMDA0ICIvPgo8L3N2Zz4=) no-repeat center bottom; 
}
#myAd #img01{ 
	position: absolute; 
	right:-65px;
	bottom:-5px;
	width:182px;
	height:172px;
	background-position: 0px -50px;
}
#myAd #img02{ 
	position: absolute; 
	left:18px;
	top:18px;
	width:264px;
	height:165px;
	background-position: 0px -224px;
	opacity:0;
}


#title  {
  position: absolute; 
  color: #737373;
  font-size: 1em;
  font-weight:700;
  top:15px;
  left:8px;
}
#mainCopy  {
  position: absolute; 
  color: #737373;
  font-size: .75em;
  line-height:1.6em;
  top:40px;
  left:8px;

}

#myAd #final_frame{
	top: 0;
	left: 0px;
	position: absolute;
	opacity:0;
}


#myAd #card_gold {
	position: absolute;
	width:175px;
	height:111px;
	background-position: 0px -615px;
	top: 64px;
	left: 60px;
}

#myAd #card_silver {
	position: absolute;
	width:173px;
	height:110px;
	background-position: 0px -501px;
	top: 64px;
	left: 62px;
}

#myAd #card_plum {
	position: absolute;
	width:173px;
	height:109px;
	background-position: 0px -390px;
	top: 64px;
	left: 62px;
}