body{
	font-family:verdana;
	background:#f4f6f9;
}

header {
	background:#0d6efd;
	color:white;
	padding:20px;
	text-align:center;
	font-size:32px;
	font-weight:bold;
	border-radius:20px;
}

.navbar {
	display:flex;
	justify-content:center;
	overflow:auto;
	background-color:#222;
	padding:12px;
	border-radius:20px;
}

.navbar a {
	float:left;
	font-size:16px;
	color:white;
	padding:14px 16px;
	text-decoration:none;

}

.navbar a:hover, .dropdown:hover .dropbtn {
	border:none;
	color:#0d6efd;
	border-radius:25px;
	background-color:none;
	padding:10px 20px;
}

.dropdown {
	float:left;
	overflow:hidden;
}

.dropdown .dropbtn {
	font-size:16px;
	border:none;
	outline:none;
	color:white;
	padding: 14px 16px;
	background-color:inherit;
	margin:0;
}

.dropdown-content {
	display:none;
	position:absolute;
	background-color:#f9f9f9;
	min-width:160px;
	box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);
	z-index:1
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {
  background-color: #9999ff;
}

.dropdown:hover .dropdown-content {
  display: block;
}




.headline{
	text-align:center;
	padding:1px;
	background:linear-gradient(to right,#dff6ff,#bfe9ff);
}

.hero img{
width:100%;
height:400px;
object-fit:cover;
}

.section{
padding:40px;
text-align:center;
}

.services{
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:20px;
}

.card{
background:white;
padding:20px;
width:250px;
border-radius:10px;
box-shadow:0 0 10px rgba(0,0,0,0.1);
}

.card:hover {
	transform:scale(1.05);
	background-color:purple;
}

.contact{
background:#0b4f8a;
color:white;
padding:40px;
text-align:center;
}