* { margin:0px; padding:0px; border:0px; outline-style: none;  }
html { scroll-behavior: smooth; }
html,body { font-family: Helvetica, sans-serif; font-size:1.5vw; font-weight:400; line-height:1.25em; background:#3e403f; color:#fff; text-align: left; overflow-x:hidden; max-width:100vw; }
body { height:auto; overflow:visible; text-align:center; }

.tal { text-align:left    !important; } .cl { clear:left  !important; } .fl { float:left  !important; display:block; }
.tar { text-align:right   !important; } .cr { clear:right !important; } .fr { float:right !important; display:block; }
.taj { text-align:justify !important; } .cb { clear:both  !important; } 
.tac { text-align:center  !important; } .cn { clear:none  !important; }
.hidden { display:none !important; }
.inline { display:inline-block !important; }

h1,h2,h3,h4,h5,h6 { display:block; padding:0 0; margin:0 auto; text-align:inherit; color:inherit; letter-spacing:0em; }
h1, h2 { text-align:center; }
h1 { font-size:2.50rem; line-height:1.50em; margin:1em auto 0.5em auto; white-space:nowrap; font-size:100; }
h2 { font-size:2.00rem; line-height:1.50em; margin-bottom:1rem; }
h3 { font-size:1.66rem; line-height:1.33em; margin-bottom:1rem; }
h4 { font-size:1.25rem; line-height:1.20em; margin-bottom:1rem; }

h1:after { display:block; content:''; width:50%; margin:0 auto; height:0.125em; background:#fff; }

a { color:inherit; text-decoration:underline; }
strong { font-weight:700; }
p { margin-bottom:1em; }

ol,ul { font-size:inherit; font-family:inherit; }
ol > li,
ul > li { font-size:inherit; font-family:inherit; margin-bottom:0.33rem; }
ol { list-style: none; counter-reset: counter; display:inline-block; text-align:left; margin:2rem auto 2rem auto; }
ol > li { display:block; position:relative; counter-increment: counter; padding-left:1.5em; font-size:1.2em; font-weight:bold; width:max-content; margin:0 auto 0.5em; }
ol > li:before { content: counter(counter) "."; width:1em; text-align:right; line-height:inherit; position:absolute; left:0; top:0; font-weight:bold; }

table { border-collapse:collapse; layout:fixed; }
table th { vertical-align:top; padding-right:0.5em; }
table td { vertical-align:top; }
table td span + span { margin-left:0.5em; }


section { display:inline-block; position:relative; width:14.22em; padding:1.33em 1.66em; margin:3.33em 1.66em; vertical-align:top; text-align:left; border-radius:0.3em; }
section:before { position:absolute; right:1em; top:1em; font-size:1.33em; }
section ul > li { display:block; position:relative; padding-left:1em; }
section ul > li:before { display:block; position:absolute; left:0; top:0; content:"\e902"; font-family:'icomoon'; font-size:0.5em; line-height:inherit; }
section a[class^="icon-"] { display:block; position:relative; padding-left:1.5em; text-decoration:none; margin-bottom:1em; }
section a[class^="icon-"]:before { display:block; position:absolute; left:0; top:0; }
main section.icon-battery:before { transform:rotate(-90deg); }

header { width:min-content; margin:0 auto; padding-bottom:4vw; }

main { background:#259a85 url('../bg_klic.svg') 0% 100% no-repeat; background-size:94.66% auto; padding-bottom:1em; }
main section { background:#222; }
main section:before { color:#259a85; font-size:3em; }
main section ul > li { font-size:1.25em; line-height:1.25em; }

footer { }

@media (max-width: 800px){ 
	header { width:80vw; padding-bottom:3em; }
	h1 { white-space:normal; }
	html,body { font-size:4vw; }
	section	 { display:block; margin-left:auto; margin-right:auto; }
	main section:before { top:1.33rem; right:1rem; font-size:5em; }
	main section.icon-battery:before { right:0.8rem; top:1.2rem; }
	main { padding-top:1em; background:#259a85 url('../bg_klic.svg') 105% 100% no-repeat; background-size:400% auto; padding-bottom:4.5em; }
	footer section { margin-top:1em; margin-bottom:1em; }
}


