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-family: arial, helvetica, sans-serif;
	vertical-align: baseline;
	scroll-behavior: smooth;

	transition-duration: 0.5s;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display: block;
}

@font-face {
	font-family: "abchanel-corpo";
	src: url("abchanel-corpo_regular.woff2") format("woff2"),
	url("abchanel-corpo_regular.woff") format("woff");
}

:root {
	--chance-pink: #E1A0C7;
}

#banner {
	width: 100vw;
	max-width:100%;
	height: 110vw;
	background: 50% 48% url("chance_banner.jpg");
	background-size: 220%;
}

#logo {
	width: 60vw;
	display: block;
	margin: 3rem auto 0 auto;
}

#text {
	width: 80vw;
	display: block;
	margin: 1rem auto 0 auto;
}

#qr-code {
	width: 40vw;
	display: none;
	margin: 3rem auto 0 auto;
}

#download {
	display: block;
	width: fit-content;
	margin: 3rem auto 0 auto;
	padding: 1.5em 2.5em 1.5em 2.5em;

	font-size: 0.75em;
	color: white;
	background: var(--chance-pink);

	font-family: abchanel-corpo,arial,helvetica,sans-serif;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
	text-align: center;
}

#stores {
	display: block;
	margin: 3rem auto 3rem auto;
	width: fit-content;
}

#stores li {
	display: inline-block;
}

#stores li + li {
	margin-left: 4vw;
}

#stores li a {
	display: block;
	width: 36vw;
	height: 12vw;
	background-size: cover;
}

#stores li a span {
	display: none;
}

#app-store {
	background: url("app-store-badge-EN.png");
}

#google-play {
	background: url("google-play-badge-EN.png");
}

/* desktop */
@media screen and (min-width: 576px) {
	#banner {
		height: 27vw;
		background-position: center;
		background-size: cover;
	}
	
	#logo {
		width: 15rem;
	}
	
	#text {
		width: 30rem;
	}

	#qr-code {
		display: block;
		width: 10rem;
	}
	
	#stores li + li {
		margin-left: 1rem;
	}

	#stores li a {
		width: 7.5rem;
		height: 2.5rem;
	}
}

.log-container {
	width: 80%;
	margin: 20px auto;
	padding: 20px;
	background-color: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-radius: 5px;
	overflow: hidden;
  }
  
  #log-output {
	width: 100%;
	height: 300px;
	border: 1px solid #ccc;
	padding: 10px;
	overflow-y: scroll;
	border: none; /* Remove the border */
	outline: none; /* Remove the selection box when clicked */
	resize: none; /* Remove the drag-to-scale box */
  }