html,
body {
	border: none;
	margin: 0;
	padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
address,
big,
cite,
code,
em,
font,
img,
small,
strike,
sub,
sup,
li,
ol,
ul,
figure,
fieldset,
form,
label,
legend,
button,
table,
caption,
tr,
th,
td {
	border: none;
	font-size: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit;
	
}

blockquote::before,
blockquote::after {
	content: "";
}


/* 1. configuração básica da página */
html {
	font-size: 62.5%; /* 1rem = 10px */
	scroll-behavior: smooth;
	box-sizing: border-box;
}

*, *:before, *:after
{
	box-sizing: inherit;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}
body
{
  font-family: -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
  font-size: 2rem;
}

article
{
  width: calc(100% - 60px);
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
}

h1
{
  font-size: 3.2rem;
  margin-top: 8rem;
  margin-bottom: 3rem;
  line-height: 3.8rem;
  
}

p
{
  margin-bottom: 1em;
}

ul
{
  list-style: none;
  margin-bottom: 3rem;
}
ul li
{
  margin-bottom: 1rem;
}
ul li a
{
  display: block;
  text-decoration: none;
  border: 1px solid black;
  padding: 8px;
  color: black;
  border-radius: 2px;
  text-align: center;
}

ul li a:hover
{
  color: white;
  background-color: black;
}

@media(min-width:1024px)
{
  
}