a,abbr,acronym,address,applet,article,aside,audio,b,blockquote,big,body,center,canvas,caption,cite,code,command,datalist,dd,del,details,dfn,dl,div,dt,em,embed,fieldset,figcaption,figure,font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,keygen,label,legend,li,meter,nav,object,ol,output,p,pre,progress,q,s,samp,section,small,span,source,strike,strong,sub,sup,table,tbody,tfoot,thead,th,tr,tdvideo,tt,u,ul,var{background:transparent;border:0 none;font-size:100%;margin:0;padding:0;border:0;outline:0;vertical-align:top}ul{list-style:none}blockquote,q{quotes:none}table,table td{padding:0;border:none;border-collapse:collapse}img{vertical-align:top}embed{vertical-align:top}article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}mark,rp,rt,ruby,summary,time{display:inline}
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%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
html{height:100%;}
input,button{outline:0;font-family:var(--font);}

*{box-sizing:border-box;-webkit-tap-highlight-color: transparent;-webkit-user-select: none;-webkit-touch-callout: none;}

:root{
	--body-bg:#FDFCFF;
	--main-color:#35994F;
}

.refresh svg{width:30px;height:30px;}

.transition{-webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;	transition: all 0.2s ease-in-out;}
body{padding:0px;margin:0px;background:var(--body-bg);font-family: 'Nunito', sans-serif;font-size:15px;}

.grid{display:grid;}
.grid.two-column{grid-template-columns:1fr 1fr;}
.flex{display:flex;}
.flex.space-between{justify-content:space-between;}
app-container{padding:20px;width:100%;box-sizing:border-box;display:block;}

header{padding:10px 20px 0px 20px;}
.logo{width:100%;text-align:left;padding:10px 0px;display:flex;justify-content:space-between;}
.logo__img{height:30px;}
.header-install a{text-decoration:none;border:0px;background:var(--main-color);font-size:1rem;padding:5px 10px;border-radius:4px;color:#fff;}

/* NAV */
nav{position:relative;width:100%;position:fixed;bottom:20px;left:0px;background:#ffffff;display:none;}
.nav__indicator{display:block;content:"";height:2px;background:var(--main-color);position:absolute;top:0px;left:0px;}
.nav__ul{list-style-type:none;width:100%;display:grid;grid-template-columns:1fr;text-align:center;justify-content:center;}
.nav__li{box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.10);margin:0 auto;border-radius:20px;max-width:70%;border-top:2px solid transparent;}
.nav__li a{color:#000000;text-decoration:none;padding:20px 50px;display:flex;align-items:center;justify-content:center;}
.nav__li svg{height:22px;width:22px;opacity:0.5;}
.nav__li span{display:inline-block;margin-left:10px;font-size:1.2rem;}
.nav__li.active{animation:touch-highlight 0.3s linear;}
@-webkit-keyframes touch-highlight{
	from{background:#eee;}
	to{background:#fff;}
}

/* STREAM */
#stream{position:relative;border-radius:10px;max-width:400px;width:100%;overflow:hidden;margin:0 auto;}
#stream div.grid{width:100%;height:100%;position:absolute;z-index:+100;top:0px;left:0px;display:grid;grid-template-columns:1fr 1fr 1fr;}
#stream div.grid .q1{border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;}
#stream div.grid .q2{border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;}
#stream div.grid .q3{border-bottom:1px solid #eeeeee;}
#stream div.grid .q4{border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;}
#stream div.grid .q5{border-right:1px solid #eeeeee;border-bottom:1px solid #eeeeee;}
#stream div.grid .q6{border-bottom:1px solid #eeeeee;}
#stream div.grid .q7{border-right:1px solid #eeeeee;}
#stream div.grid .q8{border-right:1px solid #eeeeee;}
#stream div.grid .q9{}
#stream video{width:100%;border-radius:10px;max-width:100%;float:left;position:relative;z-index:+1;}
#stream canvas{position:absolute;top:0px;left:0px;max-width:100%;z-index:+1;}

/* INDEX PAGE */
div.scan-caption{width:100%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:30px;}
div.scan-caption p{width:100%;text-align:center;font-size:1rem;}

/* PRODUCT PAGE */
div.product{width:100%;}
div.image-product{width:100%;text-align:center;}
div.image-product img{max-width:100%;}
div.content-product{width:100%;}
p.title-product{font-size:1.4rem;}
p.price-product{text-align:right;font-size:1.6rem;color:var(--main-color);}

/* LOADER */
loader-page{background:#ffffff;position:fixed;z-index:+100;top:0px;left:0px;width:100%;height:100%;align-items:center;justify-content:center;}
loader-product{width:100px;height:100px;max-height:100px;display:flex;align-items:center;justify-content:center;}

/* INSTALL PAGE */
div.install-content{padding:20px;text-align:center;width:100%;}
div.install-content div.install{margin-top:20px;width:100%;text-align:center;}
div.install-content p{font-size:1.3rem;}
div.install button{margin:0 auto;padding:10px 20px;background:var(--main-color);border:0px;cursor:pointer;color:#ffffff;font-size:1.3rem;border-radius:4px;display:flex;align-items:center;justify-content:center;}
.buttonInstall{margin:0 auto;padding:10px 20px;background:var(--main-color);border:0px;cursor:pointer;color:#ffffff;font-size:1.3rem;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;}
div.install button svg{height:20px;margin-right:10px;fill:#ffffff;}