* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

body {
  width: 100%;
  min-height: 100vh;
}

.btn {
  width: 100%;
  height: 2.5rem;
  border-radius: 5px;
  font-weight: 700;
}

body {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: "Red Hat Display", sans-serif;
}

.container {
  background-color: white;
  max-width: 400px;
  min-width: 375px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: -5px 4px 15px 0px hsl(225, 100%, 94%);
}

.img-div {
  width: 1005;
}
.img-div img {
  width: 100%;
}

.plan-info {
  padding: 1rem 0;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
}

.plan-child1 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.plan-child2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.btn-div {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.order-summmary {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.order-summmary p {
  max-width: 300px;
}

.division {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 2rem;
  gap: 1rem;
}

.btn {
  background-color: hsl(245, 75%, 52%);
  color: hsl(225, 100%, 98%);
}
.btn:active {
  background-color: rgba(56, 41, 224, 0.5);
  border-color: rgba(56, 41, 224, 0.5);
}

h1 {
  font-weight: 900;
}

.bold {
  font-weight: 700;
}

p, span {
  color: hsl(224, 23%, 55%);
  font-weight: 500;
}

.dark-blue {
  color: hsl(223, 47%, 23%);
}

.bright-blue {
  color: hsl(245, 75%, 52%);
}

.cancel {
  text-decoration: none;
}

/*# sourceMappingURL=main.css.map */