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;
}

html, body { height: 100%; width: 100%; }
body { line-height: 1; }

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;
  image-rendering: auto;
}

.asset, svg { position: absolute;}

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

	--bgColor: #000000;
	--borderColor: #000000;
	--coverColor: #000000;
	--globalMarginX: 25px;
	--globalMarginY: 25px;

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

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

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

#border { position: absolute; top:0px; left:0px; width:var(--bannerWidth); height:var(--bannerHeight); border: 1px solid var(--borderColor); box-sizing: border-box; pointer-events:none; }
#cover { position: absolute; top: 0px; left: 0px; width: var(--bannerWidth); height: var(--bannerHeight); background-color: var(--coverColor); }

#clickArea { position: absolute; top: 0; left: 0; width:100%; height:100%; }

/*******************************************/
/*************** LEGALLINE *****************/
/*******************************************/

.no-break { white-space: nowrap; }
.dont-break-out {
	/* Adds a hyphen where the word breaks, if supported (No Blink), use in skyscrapers or when shortage in xspace*/
  overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  word-break: break-word;

  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;
}
.hyphenate {
  word-wrap: break-word;
  overflow-wrap: break-word;

	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
	        hyphens: auto;
}

/**********************************/
/************** CTA ***************/
/**********************************/

#buttonHolder_l1 {
	position: absolute;
	bottom: var(--globalMarginY);
	right: var(--globalMarginX);

/*	left: var(--globalMarginX);*/

	/*top:50%;
	transform: translateY(-50%);*/

	/*left:50%;
	transform: translateX(-50%);*/
}

/**********************************/
/************* CUSTOM *************/
/**********************************/

#haastMaker {
	top: 40px;
	left: 52px;
}

#balloonHolder {
	width: 110px;
	height: 110px;
	left: 110px;
	top: -4px;
}

#balloonHolder img {
	width: 110px;
	height: 110px;
}
#reloadHolder{
	position: absolute;
	top:8px;
	right:8px;
	width: 16px;
	height: 16px;
}

/*******************************************/
/************* ROTATING PHONE **************/
/*******************************************/

.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%);
}