html, body {
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #374047;
}

.camino {
  color: #fff;
  text-align: center;
  
  
}
.sobre{
  text-align: center;
  color: #ff9988;
  font-family: georgia;
  font-size: 34px;
  
}
a {
	color: #fff;
	font-size: 22px;
	text-decoration: none;
}

h1, h2, h3 {
	text-align: center;
	color: #fff;
}

h1 {
	margin-top: 225px;
	font-size: 60px;
}

h2 {
	font-size: 30px;
}

.corner-ribbon {
	width: 225px;
	height: 35px;
	position: absolute;
	text-align: center;
	line-height: 35px;
	border: 1px solid;
}

.corner-ribbon:hover {
	font-size: 26px;
}

.top-left, .top-left:hover {
	top: 40px;
  	left: -40px;
	transform: rotate(-40deg);
	-webkit-transform: rotate(-40deg);
	background-color: #2196F3;
}

.top-left {
	box-shadow: 3px 4px 3px 3px #1976D2;
}

.top-left:hover {
	box-shadow: 7px 7px 7px 7px #1976D2;
}

.top-right, .top-right:hover {
	top: 40px;
  	right: -40px;
	transform: rotate(40deg);
	-webkit-transform: rotate(40deg);
	background-color: #FF9800;
}

.top-right {
	box-shadow: 4px 4px 4px 4px #F57C00;
}

.top-right:hover {
	box-shadow: 7px 7px 7px 7px #F57C00;
}

.bottom-left, .bottom-left:hover {
	top: auto;
	bottom: 40px;
  	left: -40px;
	transform: rotate(40deg);
	-webkit-transform: rotate(40deg);
	background-color: #4CAF50;
}

.bottom-left {
	box-shadow: 4px 4px 4px 4px #4CAF50;
}

.bottom-left:hover {
	box-shadow: 7px 7px 7px 7px #4CAF50;
}

.bottom-right, .bottom-right:hover {
	top: auto;
	bottom: 40px;
  	right: -40px;
	transform: rotate(-40deg);
	-webkit-transform: rotate(-40deg);
	background-color: #FF4081;
}

.bottom-right {
	box-shadow: 4px 4px 4px 4px #FF4081;
}

.bottom-right:hover {
	box-shadow: 7px 7px 7px 7px #FF4081;
}