/* Drug Database Css */

/* css add */

.drug-database-name-container.landing-page {
    margin-bottom: 1.5rem
}

.drug-database-landing-drug-name-heading {
    font-size: calc(.8rem + .55vw);
    margin-bottom: 2rem;
    font-weight: 500 !important;
}

.drug-database-name-container .fa {
    color: #00b8d4 !important;
}

.calc-new-color-heading-h1 {
    color: #00bcd4 !important;
    text-transform: uppercase;
}


@media screen and (min-width: 768px) {
    .drug-database-landing-details-container .drug-data-heading {
        font-size: 1.3rem !important;
        font-weight: 500 !important;
        margin-top: 20px;
        border-radius: 12px;
        width: max-content;
        padding: 3px 10px;
        text-transform: uppercase;
        max-width: 100%;
    }

    .quiz-new-title.latest {
        margin: .5rem 0 1.5rem 12%;
        font-weight: 600;
        font-size: 1.1rem !important;
        color: black !important;
        margin-top: 1rem;
        -webkit-line-clamp: 2;
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box !important;
        -webkit-box-orient: vertical;
        white-space: normal;
    }

    .quiz-new-title {
        /* margin: .5rem 0 1.5rem 12%; */
        -webkit-line-clamp: 2;
        font-size: 1.1em;
        color: black !important;
    }

    .quiz-landing-question {
        color: black !important;
        font-size: 1.1em !important;
    }

}

.latest-update-text-article-table {
    background-color: #11977f !important;
}

.latest-news-article-table {
    border-right: 2px solid #103356 !important;

}

.drug-databse-new h1 {
    color: black !important;
}

.new-article-table {
    margin-top: 2rem;
    margin-bottom: 2rem;
    grid-template-columns: repeat(5, 1fr);
    border-top: 2px solid #103356 !important;
    border-left: 2px solid #103356 !important;
    border-bottom: 2px solid #103356 !important;
}

.quiz-landing-question {
    color: black !important;

}

.quiz-new-title {

    color: black !important;
}

.quiz-new-title.latest {
    color: black !important;
}



@media screen and (max-width: 768px) {
    .drug-database-landing-details-container .drug-data-heading {
        font-size: 1rem !important;
        font-weight: 500 !important;
        margin-top: 20px;
        border-radius: 12px;
        width: max-content;
        padding: 3px 10px;
        text-transform: uppercase;
        max-width: 100%;
    }

    .nav-link {
        padding: 9px 7px;
    }


    .Survey .quiz-new-title.recommended-mobile {
        font-size: 18px !important;
        margin-bottom: 10px !important;
    }

    .Survey .quiz-new-img {
        margin-bottom: 3rem !important;
    }

    .Survey .home-page-new-subheading {
        margin-top: 30px;
        font-size: 22px !important;
    }

    .survey-recommended {
        margin-top: 0px !important;

    }

    #myBtn {
        background-color: transparent !important;
    }

}

.drug-db-landing-new-dropdown {
    width: 100%;
    margin-top: 10px;
    max-height: 200px;
    overflow: scroll
}

.loading-gif.drug-database.drug-db-landing-loader {
    width: 40px;
    height: 40px
}

.drug-db-landing-new-dropdown::-webkit-scrollbar {
    width: 10px;
    height: 10px
}

.drug-db-landing-new-dropdown::-webkit-scrollbar-track {
    background: #fff
}

.drug-db-landing-new-dropdown::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .17)
}

.drug-database-landing-view-btn-container {
    display: flex;
    align-items: center;
    width: max-content
}

.drug-database-landing-view-btn-container:hover {
    cursor: pointer;
    color: #00bcd4;
    text-decoration: underline;
    filter: brightness(.9)
}

.drug-database-landing-view-more-btn {
    margin-top: 1rem;
    width: max-content;
    color: #00bcd4;
    font-weight: 700;
    margin-bottom: 0
}

.drug-database-landing-arrow {
    margin-top: 1rem;
    font-size: 2.2rem;
    font-weight: 700;
    color: #00bcd4
}

.drug-database-landing-details-container {
    width: 100%;
    margin: 0 auto 2rem;
    padding: 0 30px
}

@media screen and (max-width: 768px) {
    .drug-database-landing-details-container {
        width: 100%
    }

    .h2,
    h2 {
        font-size: calc(0.8rem + 1.4vw) !important;
    }

    section {
        padding: 0px 10px;
    }


}

.heading-wrapper.drug-databse-new {
    display: flex;
    justify-content: space-between;
    padding: 20px 10%
}

.drug-new-input {
    width: 100%;
    padding: .5rem 1rem;
    border: none;
    border-radius: 22px;
    background-color: #e0eaf3
}

.drug-new-input:focus {
    outline: none;
    border: 1px solid #e0e5e9
}

.drug-new-input-container {
    width: 300px;
    max-width: 100%;
    position: relative
}

.drug-new-input-search-icon {
    position: absolute;
    top: 10px;
    right: 15px;
    width: 22px;
    height: 22px;
    color: grey
}

.drug-database-btn-container {
    padding: 2rem 1rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.drug-database-btn {
    border: none;
    background-color: #d9f4ff;
    border-radius: 7px;
    padding: .2rem .7rem;
    margin: .5rem;
    font-size: 1.15rem
}

.drug-database-btn.active,
.drug-database-btn:hover {
    background-color: #00b8d4;
    color: #fff
}

.pagination-container-drug-db-new {
    display: flex;
    justify-content: space-between;
    margin-bottom: 2rem;
    align-items: center
}

.pagination-container-drug-db-new>p,
.pagination-container-drug-db-new>ul {
    margin-bottom: 0
}

.page-link:active,
.page-link:focus {
    outline: none !important;
    box-shadow: none
}

.drug-database-name-container {
    width: 100% !important;
    margin: 1rem auto 2rem
}

.drug-database-name-card {
    box-shadow: none;
    background-color: #eff4f8;
    text-align: left
}

.drug-database-name-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: .8rem;
    width: max-content;
    text-decoration: none;
    max-width: 100%
}

.drug-database-name-wrapper:hover {
    text-decoration: underline
}

.drug-database-name-bullet {
    margin-right: 1rem;
    font-size: 1.2rem;
    color: #000;
    min-width: 20px;
    min-height: 20px
}

.drug-database-name-value {
    margin-bottom: 0
}

.drug-database-name-value {
    color: #0d6efd;
    font-size: 1em;
    margin: 0px;
}

.drug-database-landing-no-drug-error-msg {
    text-align: center;
    margin: 1rem 0
}

@media screen and (max-width: 768px) {
    .heading-wrapper.drug-databse-new {
        display: block
    }

    .drug-new-input-container {
        margin: 1rem auto 0
    }

    .pagination-container-drug-db-new {
        display: block;
        margin-bottom: 1rem;
        text-align: center
    }

    .pagination-container-drug-db-new>ul {
        justify-content: center;
        margin-bottom: .5rem
    }

    .drug-database-name-card {
        padding: 30px 15px
    }
}

.drug-interaction-section {
    background-color: #f0efef;
    padding: 20px 0
}

.drug-section {
    margin-top: 30px
}

.drug-interaction-dropdown.dropdown-menu.show {
    right: auto;
    left: 50%;
    transform: translate(-50%, -5%);
    max-height: 200px;
    width: 40%;
    overflow-y: scroll
}

.drug-interaction-dropdown.dropdown-menu.show>a {
    font-size: calc(.6rem + .45vw)
}

.drug-inner-container.drug-interaction {
    display: flex;
    flex-wrap: wrap
}

.drug-interaction-card {
    width: 90%;
    margin: 0px auto;
    background-color: #fff;
}

.drug-name-card {
    padding: 10px;
    margin-right: 15px;
    margin-bottom: 15px;
    height: min-content
}

.drug-close-btn {
    margin-left: 10px
}

.drug-close-btn:hover {
    cursor: pointer
}

.drug-name-card>p {
    margin-bottom: 0
}

.drug-interaction-card>p {
    font-size: calc(.7rem + .65vw);
    display: block;
    margin: auto;
    padding: 8% 0
}

.drug-interaction-card>img {
    display: block;
    margin: 0 auto
}

.dropdown-item.drug-interaction-loading {
    text-align: center
}

.dropdown-item.drug-interaction-loading>img {
    transform: scale(.7)
}

.drug-interaction-result-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.drug-interaction-result-wrapper>h4,
.drug-interaction-result-wrapper>p {
    margin-bottom: 0;
}

.drug-interaction-result-wrapper>p {
    color: #fff;
    font-weight: 600;
    border-radius: 7px;
    padding: 3px 15px;
    margin-top: 3px;
    margin-left: 15px;
    background-color: #4caf50;
}

.no-drug-interaction-text {
    font-size: 1.3rem !important;
    margin: 0 !important;
    text-align: left !important;
    padding: 0 !important
}

.drug-interaction-dropdown.no-drug-found.show {
    text-align: center;
    overflow-y: hidden;
}

.drug-interaction-dropdown.loading.show {
    overflow-y: hidden;
}

.drug-interaction-result-wrapper>.no-interaction-found-text {
    background-color: red;
}

@media screen and (max-width: 450px) {
    .disease-search.drug-section {
        width: 190px;
    }
}

@media screen and (max-width: 768px) {
    .drug-interaction-section {
        min-height: 100vh;
    }

    .d-flex.drug-interaction {
        display: block !important;
    }
}

.edit-profile-section {
    background-color: #f0efef;
    padding: 30px 0 70px
}


.articles-new-more-table {
    width: 100% !important;
}

.article-section-name-parent {
    width: 100% !important;
}

.article-section-main-container {
    width: 100% !important;
}

.latest-update-parent-container-article-table {
    width: 100% !important;
    margin-top: 20px;

}

.articles-new-explore-more-wrapper {
    width: 100% !important;
}

.articles-new-explore-more-title {
    font-size: calc(.6rem + .55vw);
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box !important;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal
}

.articles-new-explore-more-wrapper {
    padding: 0px !important;
}

@media (min-width: 1200px) {

    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 90% !important;
    }

    .drug-data-heading {
        font-size: 22px !important;
    }

    .drug-interaction .table {
        width: 100% !important;
    }

    .Survey .home-page-new-subheading {
        padding: 0 !important;
    }

    .survey-details .article-new-content-wrapper {
        width: 100% !important;
    }

    .table {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }
}

.calc-new-explore-more-heading {
    text-align: center;
    font-weight: 700 !important;
    margin-bottom: 1rem;
    margin-top: 2rem;
}


@media screen and (max-width: 768px) {
    .articles-new-explore-more-wrapper {
        width: 100%;
        padding: 15px 0% !important;
    }
}

/* Drug Database Deatils Page */

#more {
    display: none;
}

.article-new-explore-more-link>.row>.col-12>.articles-new-explore-more-title {
    font-size: calc(0.7rem + .55vw) !important;
    font-weight: 600 !important;
}

.col-md-3 .articles-new-explore-more-title {
    font-size: calc(0.7rem + .55vw) !important;
    font-weight: 600 !important;
}


.heading-wrapper>h1 {
    font-size: calc(1rem + 1.2vw);
    margin-bottom: 0;
    font-weight: 600 !important;
}



.Survey .quiz-new-latest-container {
    border: 0px solid grey !important;
    padding: 30px 0;
}

.survey-recommended {
    margin-top: 0px !important;
    margin-bottom: 20px !important;

}


/* disease database */
/* updated 11th june */
.diseases-section {
    background-color: #f0efef;
    padding: 20px 0 0px
}

.disease-search {
    width: 40%;
    display: block;
    margin: 15px auto;
    padding: 10px 25px;
    border: none;
    border-radius: 20px
}

.disease-btn-container {
    display: flex;
    margin: 30px auto;
    max-width: 100%;
    justify-content: center;
    contain: content;
    flex-wrap: wrap
}

.disease-search-btn {
    margin: 5px
}

.disease-card {
    background-color: #fff;
    width: 92%;
    margin: 0 auto;
    box-shadow: none;
    padding: 10px 25px
}

.modal-card.disease {
    width: 100%;
    border: 1px solid #c5c5c5;
    box-shadow: none;
    padding: 10px;
    margin-bottom: 10px;
    height: min-content
}

.disease-link {
    text-decoration: none;
    color: #000
}

.disease-link:hover {
    color: #000
}

.modal-card.disease>p {
    color: grey;
    text-align: justify
}

.col-md-6.disease-container {
    height: min-content
}

.no-disease-found-text {
    margin-bottom: 0;
    padding: 50px 0
}

.doctors-count-wrapper {
    background-color: #00bcd4;
    width: 35%;
    margin: 0 auto;
    border-radius: 12px;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.vert-divider-doctor-col {
    border-right: 2px solid #fff;
    margin: 5px 0
}

.doctors-center-align-col,
.vert-divider-doctor-col {
    display: flex;
    flex-direction: column;
    justify-content: center
}

.doctor-img {
    display: block;
    height: 40px;
    margin-left: auto
}

.doctors-count-text {
    font-weight: 600;
    text-align: center;
    margin-bottom: 0;
    color: #fff;
    font-size: calc(.5rem + .7vw)
}

.doctors-count-text.count {
    margin-top: .3rem;
    font-size: calc(.5rem + .5vw);
    font-weight: 700
}

@media screen and (max-width: 1250px) and (min-width:960px) {
    .doctors-count-wrapper {
        width: 45%
    }
}

@media screen and (max-width: 960px) and (min-width:700px) {
    .doctors-count-wrapper {
        width: 60%
    }
}

@media screen and (max-width: 700px) and (min-width:465px) {
    .doctors-count-wrapper {
        width: 80%
    }

    .doctor-img {
        height: 30px
    }
}

@media screen and (max-width: 465px) {
    .doctors-count-wrapper {
        width: 90%
    }

    .doctor-img {
        height: 22px
    }
}

.Survey .quiz-new-title.latest {
    height: auto;
}


@media screen and (max-width: 768px) {
    .latest-update-parent-container-article-table {
        width: 100%;
        padding: 0px 0px !important;
        margin: 0 auto;
    }

    .articles-new-explore-more-title {
        font-size: calc(1rem + .55vw) !important;
    }

    .diseases-section {
        background-color: #f0efef;
        padding: 20px 0 0px !important;
    }
}


@media (min-width: 1200px) {
    .whats-more h2 {
        margin-bottom: 30px !important;
        font-weight: 700 !important;
    }

}

.diseases-section h1 {
    color: black !important;
   
    font-weight: 600 !important;
    margin-bottom: 1rem;
}

.diseases-section .drug-input-search-icon {
    margin-top: 0px !important;
}

.diseases-section .h5,
h5 {
    font-size: 1.2rem;
    color: black !important;
    font-weight: 600 !important;
}

.modal-card:hover {
    cursor: pointer;
    background-color: rgba(17, 151, 127, .2);
}