@font-face {
    font-family: 'WorkSans-Medium';
    src: url('../fonts/Work_Sans/static/WorkSans-Medium.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Medium.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansLight';
    src: url('../fonts/Work_Sans/static/WorkSans-Light.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Light.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansBold';
    src: url('../fonts/Work_Sans/static/WorkSans-Bold.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Bold.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansRegular';
    src: url('../fonts/Work_Sans/static/WorkSans-Regular.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansSemiBold';
    src: url('../fonts/Work_Sans/static/WorkSans-SemiBold.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansExtraBold';
    src: url('../fonts/Work_Sans/static/WorkSans-ExtraBold.otf'),
         url('../fonts/Work_Sans/static/WorkSans-ExtraBold.otf') format('opentype');
}

@font-face {
    font-family: 'WorkSansBlack';
    src: url('../fonts/Work_Sans/static/WorkSans-Black.otf'),
         url('../fonts/Work_Sans/static/WorkSans-Black.otf') format('opentype');
}

body {
    font-family: WorkSansRegular;
    color: #333333;
    background-color: white;
    font-size: 14px;
}

a, a:hover {
    color: #1a6a35;
}

b {
    font-family: WorkSansBold !important;
    font-size: 16px;
}

nav {
    display: flex;
}

#main-nav > ul > li > a {
    font-size: 16px;
}

h2 {
    font-size: 14px;
    font-weight: bold;
}

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

footer ul li.nav-item a {
    color: black;
    text-decoration: none;
    line-height: 28px;
    text-transform: uppercase;
    font-family: WorkSans-Medium;
}

.footer-doi {
    height: 120px;
}

.noscroll {
    overflow: hidden;
}

/* Utility classes */
.z-index-1 {
    position: relative;
    z-index: 1;
}

.z-index-2 {
    position: relative;
    z-index: 2;
}

.z-index-3 {
    position: relative;
    z-index: 3;
}

.z-index-4 {
    position: relative;
    z-index: 4;
}

.portal-font-1rem {
    font-size: 1rem;
}

.list-style-decimal {
    list-style-type: decimal !important;
}

.color-unset,
.hover-color-unset:hover {
    color: unset;
}

.font-size-inherit {
    font-size: inherit;
}

/* End Utility classes */

/* Bootstrap over riding */
.btn-margin-bottom {
    margin-bottom: 25px;
}

.form-control {
    border-radius: 5px;
}
/* End Bootstrap over riding */

/* Custom Select */
/* The container must be positioned relative: */
.portal-form-select {
    position: relative;
    color: #666766;
    width: 100%;
}

.portal-form-select select {
    border: none;
    width: 100%;
    position: absolute;
}

.selected-item-arrow img {
    width: 20px;
}

.select-arrow-up, .select-arrow-down {
    display: none;
}

.select-arrow-active {
    display: flex;
}

/* style the selected item: */
.select-selected {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: calc(12px + 0.350625vw);
    height: 38px;
    background: #ffffff;
    border-top: 0px;
    border-right: 1px solid #e1e1e1;
    border-bottom: 2px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-radius: 5px;
    padding: 0 16px;
    cursor: pointer;
}
/* Style items (options): */
.select-items {
    position: absolute;
    top: 85%;
    left: 0;
    right: 0;
    z-index: 1;
    color: #fff;
    background-color: #666766;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.select-items div {
    display: flex;
    align-items: center;
    padding: 6px 16px;
    cursor: pointer;
}

.select-items div:hover {
    background-color: #f0f0f0;
    color: #666766;
}

.select-items div:first-child {
    padding-top: 15px;
}

/* Hide the items when the select box is closed: */
.select-hide {
    display: none;
}
/* End Custom Select */

/* Custom Radio Button */
input[type='radio'] {
    display: none;
}

.portal-input-radio label {
    display: flex;
    align-items: center;
    margin: 0;
    cursor: pointer;
}

.portal-input-radio div {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid black;
    border-radius: 100%;
    height: 30px;
    width: 30px;
}

.portal-input-radio div::before {
    content: '';
    height: 70%;
    width: 70%;
    border-radius: 100%;
    -webkit-transition: background-color 0.1s linear;
    -moz-transition: background-color 0.1s linear;
    -o-transition: background-color 0.1s linear;
    transition: background-color 0.1s linear;
}

.portal-input-radio label input:checked + div::before {
    background-color: black;
}

.portal-input-radio span {
    padding-top: 4px;
    padding-left: 8px;
}
/* End Custom Radio Button */

/* Custom Radio Button - Pad */
.portal-input-radio-pad input[type='radio'] ~ label {
    color: #666766;
    background-color: #f0f0f0;
    margin: 0;
    -webkit-transition: background-color 0.1s linear;
    -moz-transition: background-color 0.1s linear;
    -o-transition: background-color 0.1s linear;
    transition: background-color 0.1s linear;
}

.portal-input-radio-pad input[type='radio']:checked ~ label {
    color: #fff;
    background-color: #1a6a35;
}
/* End Custom Radio Button - Pad */

.appointment-time-container {
    display: none;
}

.appointment-time-container.show-time-slots {
    display: block;
}

.appointment-time-container > div {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(70px, 1fr));
    grid-auto-rows: 32px;
}

.appointment-time-container .portal-input-radio-pad {
    display: flex;
    margin-bottom: 4px;
    margin-left: 5px;
    margin-right: 5px;
}

.appointment-time-container .portal-input-radio-pad label {
    display: flex;
    align-items: stretch;
    width: 100%;
    cursor: pointer;
}

.appointment-time-container input:disabled ~ label {
    pointer-events: none;
    opacity: 0.54;
}

.info-modal .modal-header,
.info-modal .modal-content {
    border: none;
    margin: 0;
    font-size: 16px;
}

.info-modal .modal-content {
    border-radius: 0;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.info-modal button[aria-label=Close] {
    opacity: 1;
    padding-top: 10px;
    font-size: 30px;
}

#statusFeedback {
    margin-top: 15px;
}

.form-group label {
    font-size: 16px;
}

.form-group input[type=text], .form-group input[type=email], .form-group input[type=password], .form-group input[type=date], .form-group textarea {
    background: #ffffff;
    font-size: calc(12px + 0.350625vw);
    border-top: 0px;
    border-right: 1px solid #e1e1e1;
    border-bottom: 2px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    padding-left: 16px;
    padding-right: 16px;
}

.request-a-call-form-label {
      font-family: WorkSansRegular;
      font-size: calc(10px + 0.350625vw);
      color: #333;
      text-align: left;
}

.request-a-call-form-label-green {
    color: #1a6a35;
}

.request-a-call-success {
    font-family: WorkSansRegular;
    font-size: calc(12px + 0.230625vw);
    color: #666766;
    text-align: left;
    line-height: 1.57;
    letter-spacing: 0.28px;
}

.bold-text {
    font-weight: bold;
}

.terms {
    font-size: 12px;
    text-align: center;
    font-family: WorkSansRegular;
}

.terms a {
    color: black;
    font-size: 12px;
    text-decoration: underline;
    font-family: WorkSans-Medium;
    white-space: nowrap;
}

.white-button {
    background-color: #fbf7ce !important;
    color: #1a6a35 !important;
}

.sign-in {
    font-family: WorkSans-Medium;
    font-size: 11px;
    font-weight: 500;
}

.sign-in a {
    color: #1a6a35;
    text-decoration: underline;
}

.sign-in a:hover {
    color: #1a6a35;
}

.fine-print {
    color: #1a6a35;
    font-family: WorkSansSemiBold;
    font-size: calc(12px + 0.390625vw);
}

.page-item.active .page-link {
    background-color: #1a6a35 !important;
    border: 1px solid #1a6a35;
 }

.booking-history-btn{
    width: 86px !important;
}

.booking-history-btns{
    justify-content:center;
}

.booking-history-text{
    font-family: WorkSansRegular;
    color: #666766;
    font-size: 12px;
}

.booking-history-date-time{
    color: #1a6a35;
    font-weight: 600;
    font-family: WorkSansRegular;
    font-size: 14px;
}

.booking-history-table{
    width: inherit !important;
}

.booking-history-cancel-btn{
    background-color: #f0f0f0 !important;
    color: #666766 !important;
}

.booking-history-btns-div{
    width: initial !important;
}

.pull-right{
    float: right;
}

.pull-left{
    float: left;
}

.about-page-header{
    font-family: WorkSansSemiBold;
    color: #666766;
    font-size: 20px;
}

.about-page-sub-header{
    font-family: WorkSansRegular;
    color: #1a6a35;
    font-size: 15px;
}

.about-page-intro-section{
    font-family: WorkSansRegular;
    color: #666766;
    font-size: 14px;
}

.about-page-the-doctors-section{
    background-color: #1a6a35;
    font-family: WorkSansRegular;
    color: #ffffff;
    font-size: 14px;
}

.about-page-the-doctors-section-header{
    font-family: WorkSansRegular;
    font-size: 15px;
}

.about-page-the-doctors-section-plus-symbol{
    font-family: WorkSansBold;
}

.about-page-the-doctors-section-attribute{
    font-family: WorkSansBold;
    color: #ffffff;
    font-size: 16px;
}

.about-page-the-doctors-section-attribute:hover{
    color: #ffffff;
}

.about-page-the-doctors-section-sub-headers{
    font-family: WorkSansSemiBold;
    font-weight: 600;
    letter-spacing: 0.32px;
    font-size: 16px;
}

.about-page-the-doctors-section-picture{
    text-align: right;
}

.about-page-the-doctors-section-doctors-name{
    position: relative;
    height: auto;
    top: 30%;
}

.about-page-the-doctors-section-image-mobile{
    height:112px;
    width:112px;
}

.about-page-the-doctors-section-image-desktop{
    height:200px;
    width:200px;
}

.about-page-video{
    width: 355px;
    height: 355px;
}

.opacity-half{
    opacity: 0.5;
}

.opacity-medium{
    opacity: 0.85;
}

.terms-link {
    font-family: WorkSansRegular;
    color: #333333;
    font-size: 10px;
}

.portal-landing-intro-header {
    color: #1a6a35;
    font-family: WorkSansRegular;
    font-size: 15px;
}

.portal-landing-intro-text {
    color: #666766;
    font-family: WorkSansRegular;
    font-size: 14px;
    max-width: 90%;
}

.portal-landing-intro {
    background-color: #f6f6f6;
}

.benefits-section {
    color: white;
    background-color: #1a6a35;
    text-align: center;
    font-size: 12px;
}

.read-more-section-find-out{
    font-weight: 600;
    color: #1a6a35;
}

.read-more-section-find-out:hover{
    text-decoration: none;
}

.benefits-section-header {
    font-family: WorkSansRegular;
    font-weight: bold;
}

.benefits-section-header-light {
    font-weight: normal;
    font-size: 15px;
}

.benefits-section-icon-mobile {
    width: 99px;
    height: 99px;
}

.benefits-section-icon-desktop{
    width: 200px;
    height: 200px;
}

.benefits-section-sub-header-bold {
    font-weight: bold;
}

.landing-view-what-you-get-section-sub-headers {
    color: #333333;
    font-family: WorkSansRegular;
    font-size: calc(12px + 0.790625vw);
    max-width: 80%;
}

.landing-view-terms {
   color: #333333;
   font-family: WorkSansRegular;
   font-size: calc(8px + 0.390625vw);
   text-align: center;
}

.landing-view-terms a {
    color: #333333;
    text-decoration: underline;
    white-space: nowrap;
}

.landing-view-sign-in {
    color: #000000;
    font-family: WorkSans-Medium;
    font-size: calc(9px + 0.590625vw);
}

.landing-view-sign-in a {
    color: #1a6a35;
    text-decoration: underline;
}

.my-profile-intro-text {
    color: #1a6a35;
    font-family: WorkSansRegular;
    font-weight: 600;
    font-size: calc(12px + 0.390625vw);
}

.plus-symbol {
    font-family: WorkSansBlack;
    font-weight: 900;
    color: #1a6a35;
    font-size: calc(14px + 0.590625vw);
}

.read-more-section-plus-symbol{
    font-family: WorkSansExtraBold;
    color: #1a6a35;
    font-size: 16px;
    height: 18px;
}

.read-more-section-x-symbol{
    font-family: WorkSansSemiBold;
    color: #1a6a35;
    font-size: 16px;
    height: 18px;
}

.read-more-section-attribute{
    font-family: WorkSansExtraBold;
    color: #1a6a35;
    font-size: 10px;
}

.read-more-section-attribute:hover{
    text-decoration: none;
}

.request-a-call-page-complete-profile-block {
    background-color: #1a6a35;
    color: #ffffff;
}

.footer-terms-and-conditions-apply {
    font-family: WorkSansRegular;
    color: #333333;
    font-size: 9px;
}

.pricing-text{
    font-family: WorkSans-Medium;
    font-size: calc(10px + 0.390625vw);
    color: #1a6a35;
}

.landing-view-see-how-it-works-section{
    background-color: #ffffff;
}

::-webkit-input-placeholder { /* Edge */
    color: #000 !important;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #000 !important;
}

::placeholder {
    color: #000 !important;
}

/* ---------------------------------------------------
    TOP NAV STYLE
----------------------------------------------------- */
.navbar-brand img {
    width: 150px;
}

.navbar-center {
    margin: 0 auto;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
#sidebar {
    width: 100%;
    position: fixed;
    top: 0;
    left: -100%;
    height: 100%;
    z-index: 999;
    background: #fff;
    transition: all 0.3s;
    overflow-y: scroll;
}

#sidebar.active {
    left: 0;
}

#dismiss {
    font-size: 45px;
    width: 35px;
    height: 35px;
    line-height: 40px;
    text-align: center;
    color: #2f7a00;
    cursor: pointer;
}

.sidebar-header img {
    width: 150px;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    color: #333333;
    display: inline-block;
    width: 100%;
}

#sidebar a[data-toggle="collapse"] {
    position: relative;
}

#sidebar a[aria-expanded="true"]::before {
    content: '\e260';
}

#sidebar ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
}
/* ---------------------------------------------------
    END SIDEBAR STYLE
----------------------------------------------------- */

.my-account-text {
    padding-top: 10px;
    padding-bottom: 10px;
}

.bold-text {
    font-weight: bold !important;
}

.link-overflow-break {
    overflow-wrap: break-word;
}

.portal-banner {
    text-align: center;
    background-color: white;
}

.dropdown-container {
    position: relative;
}

.dropdown-menu {
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
    border: none;
    border-radius: 0px;
    width: 100%;
}

/* rows */
.dropdown-item:hover {
    background-color: #fff;
}

.dropdown-item p {
    display: inline-block;
}

.dropdown-item i {
    display: inline-flex;
    vertical-align: top;
}

.content-navbar-shadow {
    z-index: 800;
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
}

.visible-mobile {
    display: none !important;
}

.remove-dropdown-toggle-icon::after {
    content: none;
}

.navigation-dropdown-width {
    padding: 20px 0px 20px 0px;
    min-width: 15rem;
}

.navigation-dropdown-item-styling {
    font-size: 16px;
}

.full-width {
    width: 100%
}

.patient-info {
    font-family: WorkSans-Medium;
    font-size: calc(12px + 0.390625vw);
    line-height: 1.71;
    letter-spacing: 0.28px;
}

.no-underline:hover {
    text-decoration: none;
}

.form-group input.date-input-focus {
    color: black !important;
    background-color: #fdfdfd !important;
}

.form-group input[type=date] {
	color: transparent;
	background-color: transparent;
    position: relative;
	z-index: 2;
}

.form-group span.date-of-birth-label {
    position: absolute;
	border: none;
    color: black;
    background-color: #fdfdfd;
    width: 476.388px;
    padding-left: 16px;
}

.user-profile-dropdown {
    font-size: 24px;
}

#dropdown-user-menu:hover {
    cursor: pointer;
}

#account-nav-dropdown {
    top: 100%;
    left: -150%;
    width: initial;
    margin: 0;
    font-family: WorkSansRegular;
}

#account-nav-dropdown .dropdown-item {
    text-decoration: none;
    background-color: transparent;
    color: unset;
}

button.add-to-home-screen-install {
    display: none;
}

.menu-icon {
    width: 20px;
}

@media (max-width: 576px) {
    .visible-mobile {
        display: inline !important;
    }

    .hidden-mobile {
        display: none !important;
    }
}

/* Desktop */
@media (min-width: 768px) {
    h2 {
        font-size: 18px;
        font-weight: bold;
    }

    .navbar > .container {
        padding-top: 7px;
        padding-bottom: 7px;
    }

    b {
        font-family: WorkSansRegular !important;
        font-size: 26px;
    }

    .appointment-time-container > div {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
        grid-auto-rows: 55px;
    }

    .appointment-time-container .portal-input-radio-pad {
        display: flex;
        margin-bottom: 23px;
        margin-left: 8px;
        margin-right: 8px;
    }

    .sign-in {
        font-size: 18px;
    }

    .booking-history-btn{
        width: 120px !important;
    }

    .booking-history-date-time{
        font-size: 18px;
    }

    .booking-history-text{
        font-size: 18px;
    }

    .about-page-video {
        width: 600px;
        height: 600px;
    }

    .about-page-header{
    font-size: 32px;
    }

    .about-page-sub-header{
        font-size: 26px;
    }

    .about-page-intro-section{
        font-size: 22px;
    }

    .about-page-the-doctors-section{
        font-size: 22px;
    }

    .about-page-the-doctors-section-header{
        font-size: 26px;
    }

    .about-page-the-doctors-section-attribute{
        font-size: 22px;
    }

    .about-page-the-doctors-section-sub-headers{
        font-size: 22px;
    }

    .opacity-one{
        opacity: 1;
    }

     .opacity-zero{
        opacity: 0;
    }

    .terms {
        text-align: center;
        font-family: WorkSansRegular;
    }

    .terms a {
        color: black;
        text-decoration: underline;
        font-family: WorkSans-Medium;
    }

    .benefits-section {
        font-size: 20px;
    }

    .read-more-section-attribute{
        font-size: 16px;
    }

    .benefits-section-header-light {
        font-size: 23px;
    }

    .read-more-section-plus-symbol{
        font-size: 22px;
        height: 24px;
    }

    .read-more-section-x-symbol{
        font-size: 22px;
        height: 24px;
    }

    .terms-link {
        font-size: 18px;
    }

    .footer-terms-and-conditions-apply {
        font-size: 12px;
    }
}