html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

body {
	line-height: 1;
	color:#ffffff;
}

img {    
	image-rendering: auto;
}
img {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}

html,
body {
  height: 100%;
  width: 100%;
  text-align: center;
}

.banner {
	--bannerWidth: 336px;
	--bannerHeight: 280px;

	--buttonWidth: 112px;
	--buttonHeight: 26px;

	--stickerSize: 90px;
	--stickerColor: #00adff;

	--bgColor: #e20074;

	--buttonBackColor: #00adff;
	--buttonSquareColor: #ffffff;

	width: var(--bannerWidth);
	height: var(--bannerHeight);

	box-sizing: border-box;
	visibility: hidden;
	position: relative;
	overflow: hidden;
	background-color: var(--bgColor);
	cursor: pointer;
}

#border {
	position: absolute;
	top:0px;
	left:0px;
	width:var(--bannerWidth);
	height:var(--bannerHeight);
  	border: 1px solid var(--bgColor);
  	box-sizing: border-box;
}
#bgGradient{
	position: absolute;
	top: 0;
	left: 0;
	width:var(--bannerWidth);
	height:var(--bannerHeight);
	
	background: #3f3f3f; 
	background: -moz-linear-gradient(-45deg,  #3f3f3f 31%, #000000 100%); 
	background: -webkit-linear-gradient(-45deg,  #3f3f3f 31%,#000000 100%); 
	background: linear-gradient(135deg,  #3f3f3f 31%,#000000 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#000000',GradientType=1 ); 
}

#svgHolder, svg, .asset {
	position: absolute;
}

/************* LOGO *************/

#logoHolder {
	position: absolute;
	width: 100%;
	height: 100%;
}
.tm_logo {
	position: absolute;
	width: 20px;
	bottom: 16px;
	left: 20px;
}

/************* BUTTON *************/

#buttonHolder {
	position: absolute;
	bottom: 16px;
	right: 16px;
	width: var(--buttonWidth);
  height: var(--buttonHeight);
}
#butShadow {
	position: absolute;
	width: var(--buttonWidth);
  height: var(--buttonHeight);
	top: 0;
	left: 0;
	border-radius: 20px;
	background-color: transparent;
}
#button {
	position: absolute;
  width: var(--buttonWidth);
  height: var(--buttonHeight);
	top: 0;
	left: 0;
  overflow: hidden;
  border-radius: 20px;
  -webkit-mask-image: -webkit-radial-gradient(white, black); 
}
.butBack {
	position: absolute;
	width: var(--buttonWidth);
  height: var(--buttonHeight);
	background: var(--buttonBackColor); 
  border-radius: 20px;
}
.butSquare {
	position: absolute;
	top: 0px;
	right: 0px;
	width: var(--buttonHeight);
	height: var(--buttonHeight);
	border: 0 none;
	background-color: var(--buttonSquareColor);
	cursor: pointer;
}
.butTxt, .butArrow, .butTxt img, .butArrow img{
	width: var(--buttonWidth);
	height: var(--buttonHeight);
}
.butTxt {
	position: absolute;
	top: 0px;
  left: 0px;
}
.butArrow {
	position: absolute;
	top: 0px;
  left: 0px;
}

.full {
	position: absolute;
	top: 0px;
	left: 0px;
}
.full img {
	width:var(--bannerWidth);
	height:var(--bannerHeight);
}

#cover {
	position: absolute;
	top: 0px;
	left: 0px;
	width: var(--bannerWidth);
	height: var(--bannerHeight);
	background-color: var(--bgColor);
}

/************* SHINE *************/

.shine {
	background: rgb(255,255,255);
	background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%);
}