body {
  background-color:beige;
}
button{
  background-color:darksalmon;
  color:yellow;
  font-size:30px;
}
h1{
  color:orange;
  font-size: 40px;
}
.card {
  padding:20px;
   margin:15px;
   border:5px solid White;
   border-radius:10px;
   background:chocolate;
}
.my-button{
   background-color:darksalmon;
   color:yellow;
   padding:10px 20px;
   border:none;
   border-radius:5px;
   cursor:pointer;
   font-size:16px;
}

.my-button:hover{
 background-color: red;
 transform: scale(1.1);
}
h2{
  color:black;
  front-size: 30px;
}
 .cards{
    display: flex;
    gap:20px;
 }

.card{
 border:2px solid orange;
 padding:20px;
 border-radius:10px;
}
html{
	scroll-behavior:smooth;
}
section{
	scroll-margin-top:100px
}
header{
	background-color:pink;
	padding:15px;
	display:flex;
	border-bottom:8px solid gold;
	position:fixed;
	top:0;
	left:0;
	width:100%;
}
nav a{
	color:slateBlue;
	text-decoration:none;
	front-size:18px;
	padding:5px 10px;
	border-radius:10px;
	transition:0.3s;
}
nav a:hover{
	background-color:DeepPink;
	color:pink;
}
footer{
	background-color:brown;
	color:white;
	text-align:center;
	padding:10px;
}
body{
	font-family:"Comic Sans MS",sans-serif;
}