@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Butler:wght@300&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;700&display=swap");

/* ======  common style (laptop) ====== */
/* ======  common style (laptop) ====== */

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

  font-family: poppins;
  /* font-family: 'Pacifico', cursive; */
  /* font-family: 'Dancing Script', cursive; */
  /* font-family: 'Butler', serif; */
  /* font-family: 'Montserrat', sans-serif; */
}

body {
  /* background-color: #f4f4f4; */
  /* background-color: #F4F6FF; */
  background-color: #fcf8f3;
  color: #363c65;
  /* background-color: #fcf8f3; */
  /* background-color: #f1f1f1; */
  /* background-color: #ffffff; */

  /* background-color: #fcde70; */
}


button {

  /* transition: 0.1s; */
  background-color: #6b77d5; /* Initial solid color */
}

button:hover {
  cursor: pointer;
  background: linear-gradient(to top, rgb(54, 60, 101), rgb(107, 119, 213)); /* Gradient on hover */

}


p {
  font-size: 15px;
}



/* ======  common style (4k) ====== */
/* ======  common style (4k) ====== */

@media (min-width: 3840px) and (min-height: 2160px) {

  p {
    font-size: 40px;
  }

}


/* ======  common style (tab) ====== */
/* ======  common style (tab) ====== */
@media (min-width: 768px) and (max-width: 1200px) {

  
  p {
    font-size: 15px;
  }

}



/* ======  common style (mobile) ====== */
/* ======  common style (mobile) ====== */
@media (max-width: 768px) {

  p {
    font-size: 14px;
  }

}