.mySlides {
	display: none;
}

body {
	background: url(quickBack.jpg) no-repeat;
	background-size: cover;
	background-color: rgb(255, 235, 211);
	font-family: Verdana, sans-serif;
}
.nav
{
	position:sticky;
	background-color: red;
}

#head {
	margin-top: 20px;
	margin-right: 20vw;
	margin-left: 20vw;
	text-align: center;
	font-size: 30px;
	background-color: black;
	color: white;
	border-radius: 19px;
	font-weight: bolder;
	padding: 10px;
}

.data-container {
	width: 600px;
	height: 384px;
	position: relative;
	margin: 0 auto;
	/* background-color: red; */
}
.bar {
	width: 28px;
	position: absolute;
	left: 0;
	bottom: 0;
	background-color: rgb(0, 183, 255);
	transition: 0.2s all ease;	 
}  
.bar__id {
	position: absolute;
	top: -24px;
	width: 100%;
	text-align: center;
	color: white;  
  }  
/* .btn1 {
	padding: 12px;
	font-weight: bolder;
	background-color: #6f459e;
	border-radius: 10px;
	color: white;
	font-size: 16px;
	border: white;
	margin-left: 37vw;
	margin-top: 4vw;
	margin-right: 1vw;
}
.btn2 {
	padding: 12px;
	font-weight: bolder;
	background-color: #6f459e;
	border-radius: 10px;
	color: white;
	font-size: 16px;
	border: white;
} */

.buttons{
  display: flex;
  flex-direction: row;
  /* background-color: red; */
  align-items: center;
  justify-content: center;
  /* padding: 40px; */
  /* padding-right: 30px; */
}
.buttons span{
	/* padding: 40px; */
	color: white;
}
.buttons button{
	margin: 40px;
	padding: 10px;
	background-color: black;
	color: white;
	font-size: 16px;
}
.buttons button:hover{
	background-color: white;
	color: black;
	transition: 1s;
}

@media  (max-width: 500px) {
	.buttons{
		margin-left: 280px;
	}
}