html, body {
	height: 100%;
	font-family: 'Nunito Sans', sans-serif;
	color: #333;
	margin: 0;
}
body {
	background-color: #f1f5f6;
	background-image: url('./bg4.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
  }
.logo {
	max-width: 180px; margin-bottom: 30px;
}
.title-section {
	display: flex;
	max-width: 500px;
  	flex-direction: column;
}
.title-section h1 {
	font-size: 48px;
	margin: 0;
  line-height: 48px;
}

main {
	height: 100%;
  display: flex;
  align-items: start;
  justify-content: center;
  flex-direction: column;
  padding-left: 5%;
}

.link-box {
	display: flex;
}
.link-box a {
	display: flex;
  background: #fff;
  box-shadow: 1px 1px 10px #ddd;
  padding: 5px 20px;
  margin: 5px;
  border-radius: 10px;
  color: #333;
  text-decoration: none;
  justify-content: flex-start;
  align-items: center;
}
.link-box a.destaque {
	background: rgb(251, 111, 76);
  background: linear-gradient(90deg, rgb(251, 111, 76) 0%, rgb(255, 135, 0) 100%);
  color: #fff;
  box-shadow: 1px 1px 10px #a4a4a4;
}
.link-box a.destaque img {
	filter: invert(100);
}
.link-box a img {
	width: 36px;
	height: 36px;
	margin-right: 10px;
}

@media (max-width: 740px) {
	.link-box {
		margin-top:20px;
		flex-direction: column;
	  }
	  .title-section {
		margin-right: 20%;
	  }
	  .title-section h1 {
		font-size: 36px;
		line-height: 36px;
	  }
}
@media (max-width: 460px) {
	.title-section h1 {
		font-size: 28px;
		line-height: 28px;
	  }
}