@charset "UTF-8";

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol,
li, dl, dt, dd, form, a, fieldset, input, th, td
{
margin: 0; padding: 0; border: 0; outline: none;
}
#banner {
  width: 300px;
  height: 250px;
  border: 1px solid #000000;
  overflow: hidden; 
}
#banner, #banner * {
  box-sizing: border-box; 
  position: absolute;
}
#banner #mainBtn {
 	width: 100%;
	height: 100%;
	cursor: pointer;
	background-color: rgba(255,255,255,0);
}
#banner{
    background: url("assets/bg.jpg") no-repeat;
    background-size: cover;
}
#banner #container{
    top:0px;
    width: 100%;
	height: 100%;
    display: block;
}

#banner #logo{
    position: absolute;
    background: url("assets/logo.png") no-repeat;
    background-size: contain;
	left: 65px;
	top: 165px;
	width: 168px;
	height: 69px;
}
#banner #logo2{
    position: absolute;
    background: url("assets/logo.png") no-repeat;
    background-size: contain;
	left: 155px;
	top: 141px;
	width: 127px;
	height: 53px;
}
#banner #frame1{
    width:100%;
    height:100%;
    display: none;
}
#frame1 #txt1a{
    background: url("assets/txt1.png") no-repeat;
	left: 80px;
	top: 32px;
	width: 139px;
	height: 25px;
}
#frame1 #txt1b{
    background: url("assets/txt1.png") no-repeat center bottom;
	left: 80px;
	top: 68px;
	width: 139px;
	height: 60px;
}
#frame1 #rating{
    background: url("assets/rating.png") no-repeat;
	left: 109px;
	top: 27px;
	width: 81px;
	height: 114px;
}
#banner #frame2{
    width:100%;
    height:100%;
    display: none;
}
#frame2 #txt2a{
    background: url("assets/txt2.png") no-repeat;
	left: 25px;
	top: 36px;
	width: 250px;
	height: 47px;
}
#frame2 #txt2b{
    background: url("assets/txt2.png") no-repeat center -51px;
	left: 20px;
	top: 85px;
	width: 260px;
	height: 47px;
}
#banner #frame3{
    top:0;
    width:100%;
    height:100%;
    display: none;
}
#frame3 #txt3a{
    background: url("assets/txt3.png") no-repeat 0px 1px;
	left: 37px;
	top: 41px;
	width: 226px;
	height: 55px;
}
#frame3 #txt3b{
    background: url("assets/txt3.png") no-repeat 0px -58px;
	left: 37px;
	top: 100px;
	width: 226px;
	height: 30px;
}
#banner #frame4{
    top:0;
    width:100%;
    height:100%;
    display: none;
}
#frame4 #txt4a{
    background: url("assets/txt4.png") no-repeat;
	left: 28px;
	top: 52px;
	width: 245px;
	height: 21px;
}
#frame4 #txt4b{
    background: url("assets/txt4.png") no-repeat 0px -22px;
	left: 28px;
	top: 76px;
	width: 245px;
	height: 61px;
}
#banner #frame5{
    top:0;
    width:100%;
    height:100%;
    display: none;
}
#frame5 #txt5a{
    background: url("assets/txt5.png") no-repeat;
	left: 25px;
	top: 24px;
	width: 253px;
	height: 38px;
}
#frame5 #txt5b{
    background: url("assets/txt6.png") no-repeat;
	left: 24px;
	top: 75px;
	width: 227px;
	height: 52px;
}
#frame5 #ctaBtn{
    background-color: #f15c2a;
	left: 25px;
	top: 151px;
	width: 115px;
	height: 22px;
}
#frame5 #ctaTxt{
    background: url("assets/ctaTxt.svg") no-repeat center center;
    background-size: 80%;
    position: relative;
    width:100%;
    height:100%;
}
#legalBtn{
    position: absolute;
    cursor: pointer;
    left: 24px;
	bottom: 40px;
	width: 100px;
	height: 15px;
	background-color: rgba(255,255,255,0);
    display: none;
}
#frame5 #legal{
    left: 24px;
	bottom: 10px;
	width: 250px;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8px;
	line-height: 12px;
}
#legal span{
    text-decoration: underline;
}
#popup{
    background-color: rgba(0,0,0,0.7);
    width:100%;
    height:100%;
    display: none;
}
#popup p {
    position: relative;
	width: 85%;
	height: 90%;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	line-height: 12px;
    left: 20px;
	top: 10px;
}
#closeBtn{
    background: url("assets/close.png") no-repeat center center;
    right: 5px;
	top: 5px;
	width: 30px;
	height: 30px;
    cursor: pointer;
    display: none;
}
br {
  display: block;
  clear: both;
  position: relative !important;
}
u {
  display: block;
  clear: both;
  position: relative !important;
}