/*------------------------------------------------------------------
[Master Stylesheet]

Project:     template
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[Number of contents]

1. Reset Css
2. Dafult Css

-------------------------------------------------------------------*/

/*
==========================================
    1--Reset Css
==========================================
*/
ul {
  margin: 0;
  padding: 0;
}

ul li {
  list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

a:hover {
  text-decoration: none;
}

body {
  font-family: "Lato", sans-serif;
}

/*
==========================================
    2--Dafult Css
==========================================
*/

.sectionPadding {
  padding: 100px 0;
}

.text-blue {
  color: #014bac;
}

.text-white {
  color: white;
}

.text-black {
  color: black;
}

.text-seconday-light {
  color: #7d7d7d;
}

.text-seconday-dark {
  color: #7d7d7d;
}

.text-seconday-red {
  color: #c21111 !important;
}

.text-blue-light {
  color: #008ae3;
}

.bg-blue {
  background-color: #014bac;
}

.bg-white {
  background-color: white;
}

.bg-seconday {
  background-color: #7d7d7d;
}

.bg-blue-light {
  background-color: #008ae3;
}

.bg-blue-extral-light {
  background-color: #e9f2ff;
}

.border-light {
  border-color: #cfcfcf !important;
}

.border-red {
  border-color: #c21111 !important;
}

.border-blue {
  border-color: #008ae3 !important;
}

i.fa.fa-check {
  margin-right: 10px;
}

.font-outfit {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.text-14 {
  font-size: 14px !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
}

.text-16 {
  font-size: 16px !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
}

.text-20 {
  font-size: 20px !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
}

.text-22 {
  font-size: 22px !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
}

/* sad */

.heading {
  padding: 40px 0 28px 0;
}

.heading h1 {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.2;
}

.heading span {
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.main-search input.form-control {
  height: 48px;
  border-radius: 10px;
  font-size: 14px;
}

.main-search span.input-group-text {
  height: 48px;
  border-radius: 10px;
  font-size: 16px;
  cursor: pointer;
}

/* section main */
section.items-content h4 {
  font-size: 16px;
}

.items-content .single-item span p {
  line-height: 1.2;
}

/* item content */

.set-age-year .year-button,
.set-age-month .month-button,
.set-age-weight .weight-button {
  display: inline-block;
  border: 1px solid #ddd;
  margin: 0px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  text-align: center;
  font-size: 13px;
  padding: 1px;
  vertical-align: middle;
  background: #ffffff;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.set-age-year .year-button:hover,
.set-age-month .month-button:hover,
.set-age-weight .weight-button:hover {
  cursor: pointer;
}

.set-age-year #decrease,
.set-age-month #decrease,
.set-age-weight #decrease {
  margin-right: 4px;
}

.set-age-year #increase,
.set-age-month #increase,
.set-age-weight #increase {
  margin-left: 4px;
}

.set-age-year #input-wrap,
.set-age-month #input-wrap,
.set-age-weight #input-wrap {
  margin: 0px;
  padding: 0px;
}

.set-age-year input#year,
.set-age-month input#month {
  font-size: 50px;
  width: 80px;
  height: 60px;
  background-color: transparent;
  border-color: transparent;
  text-align: center;
}

.set-age-weight input#weight {
  font-size: 50px;
  width: 120px;
  height: 60px;
  background-color: transparent;
  border-color: transparent;
  text-align: center;
}

.set-age-year input[type="number"]::-webkit-inner-spin-button,
.set-age-year input[type="number"]::-webkit-outer-spin-button,
.set-age-month input[type="number"]::-webkit-inner-spin-button,
.set-age-month input[type="number"]::-webkit-outer-spin-button,
.set-age-weight input[type="number"]::-webkit-inner-spin-button,
.set-age-weight input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.set-age-month {
  border-left: 1px solid #b0b0b0;
}

/* dose section */
.dose-desc:nth-child(1) {
  border-right: 1px solid #b0b0b0;
}

.dose-desc:nth-child(2) {
  border-right: 1px solid #b0b0b0;
}

.dose-desc:nth-child(3) {
  border: none;
}

/* start */
.start-point {
  height: 100vh;
}

.start-point .site-logo img {
  height: 106px;
  width: 106px;
}

.powered-by img {
  height: 70px;
  width: 210px;
}

.underline {
  width: 40%;
  background-color: #008ae3;
  height: 2px;
}

/* HIDE RADIO */
[type=radio] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #008ae3;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #555;
}