:root {
  --pink: #f14e95;
  --bg: #0a0a0a;
  --shadow: 0 3px 3px rgb(0 0 0 / 0.5);
}

html{
	position: relative;
	
}
body{
	margin-bottom: 100px;
}

.jumbotron{
	background-color: #333;
	padding-top: 9rem;
	
}
.jumbotron img{
	width: 200px;
	border: 3px solid #999;
	box-shadow: var(--shadow);
}

.jumbotron svg{
	margin-bottom: -30px;
}


section.foto{
	background-color: #333;
	padding-top: 5rem;
	bottom: -5px;

}
section.foto svg{
	margin-bottom: -5px;
}
section.kontak{
	padding-top: 5rem;
	padding-bottom: 5rem;
}
section.tentang{
	padding-top: 5rem;
	margin-bottom: -1rem;

}
section.tentang svg{
	padding-top: 5rem;
}

/*footer{
	background-color: #333;
	height: 100px;
	bottom: 0;
	width: 100%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
footer p{
	color: #fff;
}
footer a{
	font-weight: bold;
	color: yellow;
}*/


/*CSS FOOTER*/
footer {
	padding-top: 2rem;
  background-color: #333;
  color: white;
  width: 100%;
  bottom: 0;
  display: flex;
  position: absolute;
}
footer a {
  color: var(--bg);
  font-weight: bold;
  text-decoration: none;
}
footer a:hover {
  color: red;
}
footer li {
  list-style: none;
  display: inline;
  margin: 0.5rem;
}