@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
* {
  font-family: Inter;
}

.text-black {
  color: #333333 !important;
}
.text-skyBlue {
  color: #2DABCE !important;
}
.text-purple {
  color: #0d1140;
}
.text-grey {
  color: #555555;
}
.text-lightGrey {
  color: #aaaaaa;
}
.text-darkGrey {
  color: #0d1140;
}
.text-white {
  color: #ffffff;
}
.text-lightSkyblue {
  color: #2DABCE;
}

.text-base {
  font-size: 16px;
}

.text-base-40px {
  font-size: 40px;
}

.border-skyBlue {
  border-color: #2DABCE;
}

.border-lightGrey {
  border: 1px solid #C4C9D3;
}

.border-1-skyBlue {
  border: 1px solid #2DABCE;
}
.border-none {
  border: none;
}

.rounded-md {
  border-radius: 10px;
}

.rounded-1 {
  border-radius: 4px;
}

.rounded-2 {
  border-radius: 8px;
}

.rounded-3 {
  border-radius: 12px !important;
}

.rounded-4 {
  border-radius: 16px;
}

.rounded-5 {
  border-radius: 20px;
}
.rounded-6 {
  border-radius: 24px;
}

.bg-skyBlue {
  background-color: #2DABCE;
}
.bg-skyGreen {
  background-color: #02B174;
}
.bg-white {
  background-color: #ffffff;
}
.bg-lightSkyblue {
  background: #ecf3ff;
}
.bg-extraLight{
  background: #F9FCFE;
}

.font-light {
  font-weight: 300;
}
.font-semibold {
  font-weight: 600;
}
.font-medium {
  font-weight: 500;
}
.font-bold {
  font-weight: 700;
}

.input-field {
  outline: none;
  padding: 16px;
  line-height: 19px;
  font-size: 16px;
  width: 100%;
}

.input-field::-webkit-input-placeholder {
  /* Edge */
  color: #BBBFCB;
}

.input-field:-ms-input-placeholder {
  /* Internet Explorer */
  color: #BBBFCB;
}

.input-field::placeholder {
  color: #BBBFCB;
}

.shadow-md {
  box-shadow: 0px 20px 30px rgba(62, 147, 209, 0.1);
}

.hover-shadow-md:hover {
  box-shadow: 0px 20px 30px rgba(62, 147, 209, 0.1);
}

.hover-border-md:hover {
  border: 2px solid rgba(112, 186, 244, 0.7) !important;
}

.bg-linear-gradient {
  background-color: #2DABCE;
}

button {
  border-radius: unset;
}

.heading-3 {
  font-size: 60px;
}

.pa-6{
  font-size: 24px;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
  .heading-3 {
    font-size: 36px;
  }
  .pa-6{
    font-size: 14px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
  .heading-3 {
    font-size: 32px;
  }
  .pa-6{
    font-size: 8px;
  }
}