navho@font-face {
  font-family: LemonMilkRegular;
  src: url(../fonts/LemonMilkRegular.otf)
}

@font-face {
  font-family: SamsungSharpSansBold;
  src: url(../fonts/GothamBold.otf)
}

@font-face {
  font-family: SamsungSharpSansMedium;
  src: url(../fonts/GothamMedium.otf)
}

@font-face {
  font-family: Gotham-Book;
  src: url(../fonts/Gotham-Book.otf)
}
body {
  color: #47565f !important;
  /* color: #202A44 !important; */
  /* color:#D3BC8D; */
  font-size: 15px;
  font-family:Gotham-Book;
}

p {
  word-wrap: break-word
}

a {
  color: #202A44 !important;
  text-decoration: none !important
}

.navbar-hov:hover {
 border-bottom: 3px solid #D3BC8D;
}

input[type='submit'],

.image-center {
            position: relative;
          }
          .image-center:after {
            display: inline-block;
            padding-bottom: 100%;
            content: "";
          }
          .image-center img {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            top: 0;
            margin: auto;
            width: auto;
            height: auto;
            max-width: 70%;
            max-height: 70%;
}

.button-footer {
  /* background-color: #7aab37; */
  background-color: transparent;
  color: #EDEAE6;
  cursor: pointer;
  font-family: SamsungSharpSansBold;
  height: 50px;
  border-radius: 25px !important;
  font-weight: 700;
  border:  3px solid #EDEAE6;
}

.button-footer:hover {
  /* background-color: #946129; */
  background-color: #EDEAE6;
  color: #202A44;
  border: none;
}

.button-prescriber {
  /* background-color: #7aab37; */
  background-color: #202A44 !important;
  color: #EDEAE6;
  cursor: pointer;
  font-family: SamsungSharpSansBold;
  height: 50px;
  border-radius: 25px !important;
  font-weight: 700;
  border:  none !important;
}

.button-prescriber:hover {
  /* background-color: #946129; */
  background-color: #9D7743 !important;
  color: #EDEAE6 !important;
  border: none !important;
}

.button-med-practitioner {
    /* background-color: #7aab37; */
    background-color: #202A44 !important;
    color: #EDEAE6;
    cursor: pointer;
    font-family: SamsungSharpSansBold;
    height: 34px;
    /* border-radius: 25px !important; */
    font-weight: 700;
    border: none !important;
}

.button-med-practitioner:hover {
  /* background-color: #946129; */
  background-color: #9D7743 !important;
  color: #EDEAE6 !important;
  border: none !important;
}

input[type='text'],
input[type='email'],
input[type='password'],
input[type='date'],
input[type='number'],
select {

  border: 1px solid #b8c6b6;
  box-sizing: border-box;
  height: 34px;
  outline: none;
  padding: 8px;
  width: 100%
}

input[type='radio'] {
  height: 16px;
  width: 16px
}

textarea {

  border: 1px solid #b8c6b6;
  box-sizing: border-box;
  outline: none;
  padding: 8px;
  resize: none

}

iframe {
  border: none
}

ul {

  list-style-type: none;
  margin: 0;
  padding: 0
}

.container-custom {
  margin: auto;
  max-width: 1366px;
  overflow: auto
}

.bottom-0-position-absolute-width-100 {
  bottom: 0;
  position: absolute;
  width: 100%
}

.border-none {
  border: none;
}

.background-color-white {
  background-color: #fff
}

.background-color-transparent {
  background-color: transparent
}

.background-color-gray {
  background-color: #f4f4f4
}

.background-color-blue-base {
  background-color: #202A44;
}

.background-color-green {
  background-color: #7aab37
}

.background-color-deep-navy {
  background-color: #202A44;
  color: #EDEAE6;
}

.background-color-deep-navy:hover {
  background-color: #9D7743;
  color: #EDEAE6;
}


.background-color-muted-gold {
  background-color: #9D7743;
  color: #EDEAE6;
}

.background-color-muted-gold:hover {
  background-color: #202A44;
  color: #EDEAE6;
}

.background-color-muted-gold-base {
  background-color: #9D7743;
}

.background-color-muted-gold-prescriber {
  /* background-color: transparent; */
  /* box-shadow: 0 0 0 0px transparent;
  border-top: none;
  border-bottom: none; */
  box-shadow: 5px 7px 10px 0px #9D7743;
  /* transition: border-top 0.3s ease-in-out, border-bottom 0.3s ease-in-out; */
}

.background-color-muted-gold-patient {
  /* background-color: transparent; */
  /* box-shadow: 0 0 0 0px transparent;
  border-top: none;
  border-bottom: none; */
  box-shadow: -5px -5px 10px 0px #9D7743;
  /* transition: border-top 0.3s ease-in-out, border-bottom 0.3s ease-in-out; */
}

/*.background-color-muted-gold-hov:hover {
  background-color: transparent;
  border-top: 4px solid #9D7743;
  border-bottom: 4px solid #9D7743;
  box-shadow: 5px 7px 10px 0px #9D7743;
  transition: border-top 0.1s ease-in, border-bottom 0.1s ease-in-out;
}*/


.background-color-crimson-flame {
 background-color: #DA291C;
}

.background-color-soft-cloud {
 background-color: #EDEAE6;
}

.background-color-sandstone {
 background-color: #D3BC8D;
}

.background-color-green:hover {
   background-color: #7aab37
}

.background-color-light-green {
  background-color: #b6c4b4
}

.border-custom {
  border: 1px solid #DA291C
}

.border-gray {
  border: 1px solid #f4f4f4
}

.border-white {
  border: 1px solid #fff
}

.border-left-gray {
  border-left: 0.5px solid #f4f4f4
}

.border-right-gray {
  border-right: 0.5px solid #f4f4f4
}

.border-radius-30px {
  border-radius: 30px
}

.font-weight-regular {
  font-family: SamsungSharpSansMedium;
  font-weight: 300;
}

.font-weight-bold {
  font-family: SamsungSharpSansBold;
  font-weight: 700;
}

.font-weight-custom {
  font-family: LemonMilkRegular
}

.font-style-italic {
  font-style: italic
}

.text-color-white {
  color: #EDEAE6
}

.text-color-green {
  color: #7aa363
}

.text-color-gray-brown {
  color:#946129
}

.text-color-custom {
  color: #47565f
}

.text-color-red {
  color: #f00
}

.text-color-deep-navy {
  color: #202A44;
}

.text-color-muted-gold {
  color: #9D7743 !important;
}

.text-color-muted-gold-important {
  color: #9D7743 !important;
}

.text-color-muted-gold-link {
  color: #9D7743 !important;
}

.text-color-muted-gold-link:hover {
  color: #202A44 !important;
}

.text-color-crimson-flame {
 color: #DA291C;
}

.text-color-soft-cloud {
 color: #EDEAE6 !important;
}

.text-color-soft-cloud-important {
  color: #EDEAE6 !important;
}

.text-color-sandstone {
 color: #D3BC8D;
}

.text-align-left {
  text-align: left
}

.text-align-center {
  text-align: center
}

.text-align-right {
  text-align: right
}

.text-align-justify {
  text-align: justify
}

.text-overflow-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  white-space: normal

}

.line-clamp-3 {
  -webkit-line-clamp: 3
}

.line-clamp-1 {
  -webkit-line-clamp: 1
}

.font-size-8px {
  font-size: 8px
}

.font-size-20px {
  font-size: 20px
}

.font-size-12px {
  font-size: 12px;
  line-height: 21px
}

.font-size-0 {
  font-size: 0
}

.d-font-size-15px {
  font-size: 15px;
  line-height: 21px
}

.d-font-size-20px {
  font-size: 20px
}

.d-font-size-25px {
  font-size: 25px
}

.d-font-size-35px {
  font-size: 35px;
  line-height: 43px
}

.d-font-size-40px {
  font-size: 40px;
  line-height: 43px
}

.d-font-size-65px {
  font-size: 65px;
  line-height: 60px
}

.d-font-size-55px {
  font-size: 55px;
  line-height: 45px
}

.d-font-size-18px {
  font-size: 18px
}

.d-font-size-50px {
  font-size: 50px;
  line-height: 43px
}

.text-decoration-underline {
  text-decoration: underline
}

.d-display-none {
  display: none ;
}

.ba-d-display-none {
  display: none !important
}

.d-display-block {
  display: block
}

.d-display-inline-block {
  display: inline-block
}

.d-padding-top-3rem {
  padding-top: 3rem;
}

.d-padding-top-7rem {
  padding-top: 7rem;
}

.d-padding-top-15rem {
  padding-top: 15rem;
}

.d-padding-top-13rem {
  padding-top: 13rem;
}

.d-padding-top-12rem {
  padding-top: 12rem;
}

.display-table {
  display: table;
  table-layout: fixed
}

.display-table-row {
  display: table-row
}

.display-table-cell {
  display: table-cell
}

.vertical-align-top {
  vertical-align: top
}

.vertical-align-middle {
  vertical-align: middle
}

.vertical-align-bottom {
  vertical-align: bottom
}

.float-left {
  float: left
}

.d-width-12 {
  width: 12.5%
}

.d-width-20 {
  width: 20%
}

.d-width-25 {
  width: 25%
}

.d-width-33 {
  width: 33.33%
}

.d-width-40 {
  width: 40%
}

.d-width-50 {
  width: 50%
}

.d-width-60 {
  width: 60%
}

.d-width-66 {
  width: 66.66%
}

.d-width-75 {
  width: 75%
}

.d-width-100 {
  width: 100%
}

.d-width-auto {
  width: auto
}

.d-width-50px {
  width: 50px
}

.width-45px {
  width: 45px
}

.width-69px {
  width: 69px
}

.d-width-105px {
  width: 105px
}

.width-130px {
  width: 130px
}

.width-175px {
  width: 175px
}

.width-200px {
  width: 200px
}

.width-232px {
  width: 232px
}

.d-width-300px {
  width: 300px
}

.d-width-200px {
  width: 200px
}

.max-width-100 {
  max-width: 100%
}

.max-width-260px {
  max-width: 260px
}

.max-width-500px {
  max-width: 500px
}

.max-width-1000px {
  max-width: 1000px
}

.height-21px {
  height: 21px
}

.height-60px {
  height: 60px
}

.d-height-65px {
  height: 65px
}

.height-76px {
  height: 76px
}

.d-height-85px {
  height: 85px
}

.d-height-105px {
  height: 105px
}

.d-height-169px {
  height: 169px
}

.d-height-100 {
  height: 100%
}

.d-height-70 {
  height: 70%
}

.d-min-height-395px {
  min-height: 395px
}

.d-min-height-416px {
  min-height: 416px
}

.d-min-height-424px {
  min-height: 424px
}

.margin-15px-30px {
  margin: 15px 30px
}

.margin-30px {
  margin: 30px
}

.margin-30px-0 {
  margin: 30px 0
}

.margin-30px-20px {
  margin: 30px 20px
}

.margin-0-160px {
  margin: 0 160px
}

.margin-30px-160px {
  margin: 30px 160px
}

.margin-0-80px-0-160px {
  margin: 0 80px 0 160px
}

.margin-30px-80px-30px-160px {
  margin: 30px 80px 30px 160px
}

.margin-30px-0px-30px-160px {
    margin: 30px 0px 30px 160px;
}

.margin-0-160px-0-80px {
  margin: 0 160px 0 80px
}

.margin-30px-160px-30px-80px {
  margin: 30px 160px 30px 80px
}

.margin-40px-45px {
  margin: 40px 45px
}

.d-margin-20px {
 margin: 20px
}

.margin-20px-0 {
  margin: 20px 0
}

.margin-top-265px {
  margin-top: 265px
}

.margin-top-25px {
  margin-top: 25px
}

.margin-bottom-25px {
  margin-bottom: 25px
}

.margin-top-50px {
  margin-top: 50px
}

.margin-bottom-50px {
  margin-bottom: 50px
}

.m-margin-top-75px {
  margin-top: 75px
}

.margin-bottom-75px {
  margin-bottom: 75px
}

.margin-top-90px {
  margin-top: 90px
}

.margin-bottom-90px {
  margin-bottom: 90px
}

.margin-top-120px {
  margin-top: 120px
}

.margin-bottom-120px {
  margin-bottom: 120px
}

.margin-top-146px {
  margin-top: 146px
}

.margin-bottom-146px {
  margin-bottom: 146px
}

.margin-left-8px {
  margin-left: 8px
}

.margin-right-8px {
  margin-right: 8px
}

.margin-5px {
  margin: 5px
}

.margin-15px {
  margin: 15px
}

.margin-15px-0 {
  margin: 15px 0
}

.margin-0-15px {
  margin: 0 15px
}

.margin-15px-160px {
  margin: 15px 160px
}

.margin-left-15px {
  margin-left: 15px
}

.margin-right-15px {
  margin-right: 15px
}

.margin-8px {
  margin: 8px
}

.margin-8px-0 {
  margin: 8px 0
}

.margin-16px {
  margin: 16px
}

.margin-16px-8px {
  margin: 16px 8px
}

.d-margin-left-30px {
  margin-left: 30px
}

.d-margin-left-80px {
  margin-left: 80px
}

.d-margin-right-80px {
  margin-right: 80px
}

.margin-15px-0-15px-80px {
  margin: 15px 0 15px 80px
}

.margin-9px-16px {
  margin: 9px 16px
}

.margin-19px-16px {
  margin: 19px 16px
}

.margin-auto {
  margin: auto
}

.d-margin-left-auto {
  margin-left: auto
}

.d-margin-right-auto {
  margin-right: auto
}

.d-margin-top-210px {
  margin-top: 210px;
}

.d-margin-bottom-210px {
  margin-bottom: 210px;
}

.padding-8px {
  padding: 8px
}

.padding-16px {
  padding: 16px
}

.padding-16px-25px {
  padding: 16px 25px
}

.right-0 {
  right: 0
}

.top-0 {
  top: 0
}

.overflow-auto {
  overflow: auto
}

.position-absolute {
  position: absolute
}

.position-relative {
  position: relative
}

.vertical-center {
  position: absolute;
  top: 50%;
  transform: translateY(-50%)
}

.left-block {
  /* left: 50%; */
  left: 25%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

 .center-block {
  left: 50%;
  /* left: 25%; */
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

.word-wrap-break-word {
  word-wrap: break-word
}

.horizontal-scroll::-webkit-scrollbar {
  width: 20px
}

.horizontal-scroll::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 10px
}

.horizontal-scroll::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 10px
}

.horizontal-scroll::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8
}

.horizontal-scroll {
  overflow: scroll hidden;
  white-space: nowrap
}

.z-index-1 {
  z-index: 1
}

.custom-checkbox {
  background-color: #fff;
  border: 1px solid #b8c6b6;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  height: 18px;
  line-height: 18px;
  text-align: center;
  vertical-align: middle;
  width: 18px
}

.custom-checkbox[value="0"] {
  background-color: transparent
}

.index-product-name {
  white-space: normal
}

.cursor-pointer {
  cursor: pointer
}

.header {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  /* max-height: 840px; */
  max-height: 610px;
  position: relative
}


.navbar {
  position: fixed !important;
  width: 100% !important;
  z-index: 1 !important;
}

.logo {
  margin: 30px 55px
}

.menu-button-custom {
  height: 25px;
  margin: 65px 45px;
  color: black;
}

.menu,.popup {
  /* background-color: rgba(182, 196, 180, 0.9); */
  background-color: transparent;
  height: 100vh;
  left: 0;
  position: fixed;
  top: 0;
  width: 100vw;
  z-index: 2

}

.popup {
  overflow-y: scroll
}

.menu>div {
  background-color: #202A44;
  float: right;
  height: 100vh;
  max-width: 425px;
  overflow: auto;
  width: 100%
}

.menu-close-button,.popup-close-button {
  float: right
}

.order-button {
  float: right;
  margin-right: 160px
}

.order-button>div:first-child {
  height: 64px;
  width: 220px
}

.order-button>div:first-child>div {
  margin: 10px 0
}

.order-button>div:last-child>img {
  margin: 20px 18px
}

.background-image-prescriber {
  background-image: url(../img/landing/home-prescriber-card-2.png);
  background-position: 62.5% bottom;
  background-repeat: no-repeat;
  /* background-size: 620px auto */
}

.background-image-patient {
  background-image: url(../img/landing/home-patient-card.png);
  background-position: 62.5% bottom;
  background-repeat: no-repeat;
  /* background-size: 620px auto */
}

.background-image-hospital-bg {
  background-image: url(../img/bg-hospital.jpg);
  background-position: 62.5% bottom;
  background-repeat: no-repeat;
  /* background-size: 620px auto */
}

.profile-picture {
  border-radius: 32px;
  height: 64px;
  overflow: hidden;
  width: 64px

}

.line-green {
  border: .5px solid #7aa363
}

.small-tick {
  height: 13px;
  width: 13px
}


.background-image-hormone-therapy-for-women {
  background-image: url(../img/hormone-therapy-for-women.png);
  background-position: 0% bottom;
  background-repeat: no-repeat;
  background-size: auto 105%
}

.background-image-hormone-therapy-for-men {
  background-image: url(../img/hormone-therapy-for-men.png);
  background-position: 0% bottom;
  background-repeat: no-repeat;
  background-size: auto 105%
}

.background-image-hair-loss {
  background-image: url(../img/hair-loss.png);
  /* background-position: 80% bottom; */
  background-position: 0% bottom;
  background-repeat: no-repeat;
  background-size: auto 90%
}



.background-image-about-obesity {
  background-image: url(../img/about-obesity.png);
  background-position: 0% bottom;
  background-repeat: no-repeat;
  background-size: auto 100%
}

.background-image-dermatology {
  background-image: url(../img/dermatology.png);
  background-position: 0% bottom;
  background-repeat: no-repeat;
  background-size: auto 90%
}

.background-image-erectile-dysfunction {
  background-image: url(../img/erectile-dysfunction.png);
  background-position: 80% bottom;
  background-repeat: no-repeat;
  background-size: auto 90%
}

.background-color-custom,
.custom-checkbox[value="1"],
.custom-checkbox[value="2"] {
  background-color: #DA291C
}

.order-button>div:last-child,
.profile-picture>img {
  height: 64px;
  width: 64px
}

.tab.active {
  border-bottom: 2px solid #7aa363;
  color: #7aa363
}

.tab > .badge {
  background-color: #f15a24;
  border-radius: 12px;
  color: #fff;
  display: block;
  height: 24px;
  line-height: 24px;
  position: absolute;
  right: -12px;
  text-align: center;
  top: -12px;
  width: 24px
}

#ref-no {
  border: none;
  border-bottom: 1px solid #b8c6b6
}

@media screen and (max-width:992px) {
  .m-display-none {
    display: none
  }

  .m-display-block {
    display: block
  }

  .m-width-20 {
  width: 20%
  }

  .m-width-33 {
    width: 33.33%
  }

  .m-width-50 {
    width: 50%
  }

  .m-width-100 {
    width: 100%
  }

  .m-width-14px {
    width: 14px
  }

  .m-width-48px {
    width: 48px
  }

  .m-width-65px {
    width: 65px
  }

  .m-width-75px {
    width: 75px
  }

  .m-width-90px {
    width: 90px
  }

  .m-width-115px {
    width: 115px
  }

  .m-min-height-0 {
    min-height: 0
  }

  .m-height-45px {
    height: 45px
  }

  .m-height-70px {
    height: 70px
  }

  .m-height-75px {
    height: 75px
  }

  .m-height-125px {
    height: 125px
  }

  .m-height-170px {
    height: 170px
  }

  .m-height-140px {
    height: 140px
  }

  .m-height-220px {
    height: 220px;
  }

  .m-height-330px {
    height: 330px

  }

  .m-margin-0 {
    margin: 0
  }

  .m-margin-top-1rem {
    margin-top: 1rem
  }

  .margin-0-160px,
  .margin-0-80px-0-160px,
  .margin-0-160px-0-80px {
    margin: 0 40px
  }


  .m-py-none {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .margin-30px-160px,
  .margin-30px-80px-30px-160px,
  .margin-30px-160px-30px-80px,
  .m-margin-30px-40px {
    margin: 30px 40px
  }

  .margin-top-265px {
    margin-top: 130px;
  }

  .margin-top-75px {
    margin-top: 45px
  }

.m-margin-top-0px {
    margin-top: 0px
}

.m-margin-bottom-0px {
    margin-bottom: 0px
}

  .m-margin-bottom-75px {
    margin-bottom: 75px
  }

  .margin-top-146px {
    margin-top: 100px
  }

  .margin-15px-160px {
    margin: 15px 40px
  }

  .margin-15px-0-15px-80px {
    margin: 15px 5px
  }

  .m-margin-10px {
    margin: 10px
  }

  .m-margin-10px-auto {
    margin: 10px auto
  }

  .m-margin-left-0 {
    margin-left: 0
  }

  .m-font-size-10px {
    font-size: 10px
  }

  .m-font-size-12px {
    font-size: 12px
  }


  .m-font-size-14px {
    font-size: 14px
  }

  .m-font-size-16px {
    font-size: 16px
  }

  .m-font-size-18px {
    font-size: 18px;
    line-height: 30px;
  }

  .m-font-size-25px {
    font-size: 25px;
    line-height: 30px;
  }

  .m-font-size-35px {
    font-size: 35px;
    line-height: 30px;
  }

  .m-font-size-48px {
    font-size: 48px
  }

  .m-vertical-default {
    position: relative;
    top: 0;

    transform: none
  }

.m-padding-top-1rem {
  padding-top: 1rem !important;
}

.m-padding-top-0 {
  padding-top: 0 !important;
}

.m-padding-top-13rem {
  padding-top: 13rem !important;
}

.m-padding-top-8rem {
  padding-top: 8rem !important;
}

.m-padding-y-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
  .border-left-gray {
    border-left: none
  }

  .border-right-gray {
    border-right: none
  }

  .header-home {
  background-image: url(../img/headers/header-mobile-home.png) !important;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  /* max-height: 840px; */

  position: relative
}

  .header-custom-compounding {
  background-image: url(../img/headers/header-mobile-home.png) !important;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  /* max-height: 840px; */
  position: relative
}

  /* .header {

    max-height: 420px

  } */

  .logo {
    height: 50px;
    margin: 25px;
    width: 75px
  }

  .left-block {
  left: 50%;
  /* left: 25%; */
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%)
}

  .menu-button-custom {
    margin: 42px 25px;
    height: 16px;
  }

  .menu>div {
    background-color: #202A44;
    max-width: 325px
  }

  .background-image-prescriber {
    background-image: url(../img/landing/home-prescriber-card-2.png);
    background-position: 120% bottom;
    background-size: 70% auto
  }

    .background-image-patient {
    background-image: url(../img/landing/home-patient-card.png);
    background-position: 15% bottom;
    background-size: 70% auto
  }

  .background-image-dermatology {
    background-position: 120% bottom
  }

  .m-min-height-235px {
    min-height: 235px
  }

  .m-margin-right-0,
  .order-button {
    margin-right: 0
  }

  .tab > .badge {
    border-radius: 9px;
    height: 18px;
    line-height: 18px;
    right: -9px;
    top: -9px;
    width: 18px
  }
}

.ba-table {
  border: 1px solid #BFBFBF;
}