body {
    margin: 0;
    padding: 0;
    font-family: 'Roboto-Regular';
    background: #eff5f7;
}

.top-header-add-patient {
    float: left;
    width: 100%;
    padding: 12px 10px 12px 0px;
}

.patient-heading {
    float: left;
    width: auto;
    color: #c32026;
    font-size: 18px;
    font-family: 'Roboto-Regular';
    padding-top: 5px;
    margin: 0;
}

.patient-heading i {
    color: #c32026;
}

.add-menu i {
    font-size: 16px;
}

.add-icon i {
    font-size: 20px;
    padding-right: 3px;
}

.profile-title {
    padding-top: 2px;
    float: left;
}

.print_btn {
    float: right;
}

.print_btn a {
    float: left;
    background-color: #797979;
    color: #fff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 7px 12px;
    font-family: 'Roboto-Light';
}

.print_btn a:hover {
    background-color: #686666;
    color: #fff;
}

.print_btn a i {
    color: #c32026;
    font-size: 18px;
    padding-right: 3px;
    color: #fff;
}

.content-heading {
    float: left;
    width: 100%;
    margin: 6px 0px 0px 0px;
    color: #0099ff;
    padding-right: 0px;
}

.content-heading h1 {
    color: #0099ff;
    font-size: 18px;
    padding: 10px 0px;
    font-family: 'Roboto-Regular';
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #91a8b0;
}

.heading_text {
    float: left;
    width: 100%;
    margin: 0px;
    color: #0099ff;
    padding: 0px;
}

.heading_text h1 {
    color: #0099ff;
    font-size: 18px;
    padding: 20px 0 4px 0;
    font-family: 'Roboto-Regular';
    float: left;
    width: 100%;
    margin: 0;
    line-height: 30px;
}

.form {
    float: left;
    width: 49%;
    margin: 10px 0 0 0;
    padding: 0;
}

.add_patient_form {
    float: left;
    width: 100%;
    margin: 0;
}

.add_patient_form label {
    float: left;
    color: #91a8b0;
    font-size: 14px;
    padding: 14px 5px 0 0;
    line-height: 20px;
    width: 100%;
    white-space: normal;
    text-align: left;
    font-family: 'Roboto-Regular';
}

.dob {
    width: 25% !important;
}

.add_patient_dob {
    float: left;
    width: 80%;
    margin: 0;
}

.add_patient_dob label {
    float: left;
    color: #333;
    font-size: 16px;
    padding: 14px 10px 0 0;
    line-height: 20px;
    width: 40%;
    white-space: normal;
    text-align: right;
}

.add_patient_form label.error {
    float: left;
    width: 100%;
    padding: 0px 0;
    color: #f00;
    margin: 0;
    text-align: left;
    font-size: 13px;
}

.add_patient_form .input_form {
    float: left;
    width: 57%;
    margin: 0;
    color: #333;
    outline: 0;
}

.add_patient_form .input_form2 {
    width: 53%;
    margin: 0 auto;
    color: #333;
    outline: 0;
    text-align: center;
}

.add_patient_form .input_form2 input {
    border: 1px solid #91a8b0;
    padding: 10px 15px;
    border-radius: 3px;
    width: 100%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
    font-size: 13px;
    font-family: 'Roboto-Regular';
}

.add_patient_form .input_form2 input:hover,
.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open>.dropdown-toggle.btn-default.focus,
.open>.dropdown-toggle.btn-default:focus,
.open>.dropdown-toggle.btn-default:hover {
    border: 1px solid #0099ff;
}

.input_form .bootstrap-select {
    float: left;
    margin-bottom: 3px;
}

.add_patient_form .input_form input {
    border: 1px solid #91a8b0;
    padding: 10px 15px;
    border-radius: 3px;
    width: 100%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
    font-size: 13px;
    font-family: 'Roboto-Regular';
}

.add_patient_form .input_form input:hover,
.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open>.dropdown-toggle.btn-default.focus,
.open>.dropdown-toggle.btn-default:focus,
.open>.dropdown-toggle.btn-default:hover {
    border: 1px solid #0099ff;
}

.add_patient_form .input_form textarea {
    border: 1px solid #91a8b0;
    padding: 12px 5px;
    border-radius: 3px;
    width: 98%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
    font-size: 14px;
    font-family: 'Roboto-Regular';
    resize: vertical;
}

.add_patient_form .input_form textarea:hover {
    border: 1px solid #0099ff;
}

.add_patient_form .input_form .radio_btn {
    float: left;
    width: 50%;
    margin-bottom: 12px;
}

.add_patient_form .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100% !important;
    margin-top: 8px;
}

.add_patient_form .btn-group.open .dropdown-toggle {
    box-shadow: none;
}

.add_patient_form .btn-default,
.form_contact .btn-default {
    background-color: #fff !important;
    border-radius: 3px;
    outline: 0;
    padding: 8px;
}

.new-gender {
    margin-bottom: 5px !important;
}

.form_contact .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100% !important;
    margin-top: 8px;
}

.add_patient_form .input_form1 {
    float: left;
    width: 50%;
    margin: 0;
    color: #333;
    outline: 0;
}

.add_patient_form .input_form1 input {
    border: 1px solid #ccc;
    padding: 8px;
    border-radius: 3px;
    width: 100%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
}

.add_patient_form .input_form1 input:hover,
.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open>.dropdown-toggle.btn-default.focus,
.open>.dropdown-toggle.btn-default:focus,
.open>.dropdown-toggle.btn-default:hover {
    border: 1px solid #0099ff;
}

.add_form {
    float: left;
    width: 100%;
}

.personal_form {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.family_field {
    float: left;
    width: 100%;
}

.family_field h5 {
    float: left;
    width: 10%;
    margin-top: 18px;
    text-align: center;
    font-size: 20px;
    line-height: 20px;
    margin-left: 10px;
    margin-right: 10px;
    color: #0099ff;
    font-family: 'Raleway-SemiBold';
    text-transform: uppercase;
}

.family_field .input_form input {
    border: 1px solid #ccc;
    padding: 8px;
    border-radius: 3px;
    width: 100%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
}

.family_field .form {
    margin: 2px 0 20px 0;
}

.add_patient_form .input_form input[type="radio"] {
    display: none;
}

.add_patient_form .input_form input[type="radio"]+label {
    color: #33484f;
    width: 100%;
    float: left;
    padding: 14px 0 0;
    text-align: left;
}

.add_patient_form .input_form input[type="radio"]+label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -2px 10px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -38px;
    background-size: cover;
    cursor: pointer;
}

.add_patient_form .input_form input[type="radio"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -58px;
    background-size: cover;
}

.profile_image {
    float: left;
    width: 100%;
    padding: 0px;
    margin: 0;
}

.profile_image .input_form {
    width: 100%;
    float: left;
}

.profile_image .input_form input {
    float: left;
    width: 70%;
}

.nice {
    font-size: 13px !important;
}

.profile_image .image {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 8px;
    height: auto;
}

.profile_image .image_size {
    background-color: #fff;
    border: 1px solid #ccc;
    margin: 0 auto;
    float: none;
    width: 100px;
    height: 100px;
}

.profile_image .image_size img {
    width: 100%;
    height: 100%;
    padding: 5px;
}

.profile_image .image1 {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 8px;
    height: auto;
}

.profile_image .image_size1 {
    margin: 0 auto;
    width: 133px;
    height: 100px;
}

.profile_image .image_size1 video {
    background-color: #fff;
    border: 1px solid #ccc;
}

.profile_image .image_size1 img {
    width: 100%;
    height: 100%;
    padding: 5px;
}

.input_form .nice .NFI-button,
.nice .NFI-filename {
    height: 38px !important;
}

.conact_details {
    float: left;
    width: 100%;
}

.conact_details_bg {
    float: left;
    width: 98%;
    background: #eff5f7;
    padding: 10px 0;
    margin: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.contact_details_form {
    float: left;
    width: 49%;
}

.form_contact {
    float: left;
    width: 100%;
}

.contact_details_form label {
    float: left;
    color: #33484f;
    font-size: 14px;
    padding: 18px 5px 0 0;
    line-height: 20px;
    width: 40%;
    white-space: normal;
    text-align: right;
    font-family: 'Roboto-Regular';
}

.contact_details_form .input_form {
    float: left;
    width: 60%;
    margin: 0;
    color: #333;
    outline: 0;
}

.contact_details_form .input_form input {
    border: 1px solid #91a8b0;
    padding: 10px 10px;
    border-radius: 3px;
    width: 100%;
    margin: 8px 0 2px 0;
    color: #333;
    outline: 0;
    font-family: 'Roboto-Regular';
    font-size: 13px;
}

.contact_details_form .input_form input:hover,
.contact_details_form .input_form input:focus {
    border: 1px solid #0099ff;
}

.contact_details_form label.error {
    float: left;
    width: 100%;
    padding: 3px 0;
    color: #f00;
    margin: 0;
    text-align: left;
    font-size: 14px;
    display: none;
}

.form_contact .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    float: left;
    width: 60%;
    margin-top: 8px;
}

.medical-history {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0px 15px;
    border-left: 1px solid #ccc;
}

.medical_heading {
    float: left;
    width: 100%;
}

.medical_heading h1 {
    color: #0099ff;
    font-size: 16px;
    padding: 8px 0;
    font-family: 'Roboto-Regular';
    float: left;
    width: 100%;
    line-height: 30px;
    margin: 0;
    border-bottom: 1px solid #91a8b0;
}

.med_history {
    float: left;
    width: 95%;
}

.med_history ul {
    float: left;
    width: 100%;
    margin: 10px 0 0 0;
    padding: 0px;
    height: 265px;
    overflow-y: scroll;
}

.med_history li {
    list-style: none;
    float: left;
    width: 100%;
    color: #606060;
    cursor: pointer;
    font-size: 16px;
}

.med_history input[type="checkbox"] {
    display: none;
}

.med_history input[type="checkbox"]+label {
    color: #33484f;
    width: 100%;
    float: left;
    padding: 5px 0 5px 0px;
    font-size: 13px;
    text-align: left;
    font-family: 'Roboto-Regular';
    font-weight: normal;
}

.med_history input[type="checkbox"]+label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -2px 5px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: cover;
    color: #606060;
    cursor: pointer;
}

.med_history input[type="checkbox"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -18px !important;
    background-size: cover;
}

.add_new {
    float: right;
    width: auto;
}

.add_new a {
    float: left;
    font-family: 'Roboto-Regular';
    width: 100%;
    cursor: pointer;
    font-size: 14px;
    text-decoration: none;
    color: #fff;
    background: #0099ff;
    padding: 0 10px;
    border-radius: 3px;
    margin: 0;
}

.add_new a:hover {
    background-color: #0099ff;
    color: #fff;
}

.vital_signs ul {
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
    padding: 0 0 10px 0;
    height: 225px;
    overflow-y: scroll;
}

.vital_signs ul li {
    list-style: none;
    float: left;
    width: 100%;
    color: #33484f;
    font-size: 14px;
    font-family: 'Roboto-Regular';
    font-weight: 400;
}

.vital_signs ul li span {
    width: 49%;
    float: left;
    font-size: 13px;
    padding: 15px 20px 0 0;
    margin: 0;
    line-height: 20px;
    text-align: left;
}

.vital_signs ul li input {
    border: 1px solid #ccc;
    padding: 8px;
    border-radius: 3px;
    width: 38%;
    margin: 8px 0 2px 0;
    color: #333;
    font-weight: normal;
    outline: 0;
    font-size: 13px;
}

.vital_signs ul li input:hover {
    border: 1px solid #0099ff;
}

@media (min-width:320px) and (max-width:767px) {
    .add_form {
        float: left;
        width: 100%;
    }
    .form {
        float: left;
        width: 100%;
        margin: 10px 0 0 0;
        padding: 0 10px;
    }
    .profile_image {
        float: left;
        width: 100%;
        padding: 0 10px;
    }
    .family_field .input_form {
        padding: 0 10px;
    }
    .family_field h5,
    .family_field .input_form input {
        width: 100%;
    }
    .contact_details_form {
        width: 100%;
        float: left;
        padding: 0 10px;
    }
    .contact_details_form label {
        font-size: 13px;
        width: 50%;
        text-align: left;
    }
    .contact_details_form .input_form {
        width: 100%;
    }
    .contact_details_form input,
    .form_contact .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
        width: 50%;
    }
    .conact_details_bg {
        margin: 15px 0;
    }
    .medical-history {
        padding: 0 15px;
    }
    .new-login {
        width: 95%;
    }
    .leftdata,
    .rightdata,
    input[type=submit] {
        width: 100%;
        margin: 0;
    }
    .leftdata img {
        margin: 0 auto;
        width: 120px;
        float: none;
    }
    .save input[type="submit"] {
        width: auto;
    }
}

@media (min-width:768px) and (max-width:1100px) {
    .add_patient_form label,
    .contact_details_form label {
        font-size: 14px;
    }
    .add-icon i {
        padding: 0;
    }
    .family_field h5 {
        font-size: 14px;
    }
    .profile_image .image_size {
        float: left;
        width: 110px;
        height: 110px;
    }
    .profile_image .input_form {
        width: 100%;
    }
    .nice {
        font-size: 10px !important;
    }
    .conact_details_bg {
        float: left;
        width: 99%;
        background: #f4f4f4;
        padding: 10px 8px;
        margin: 15px 10px;
    }
    .medical-history {
        padding: 0 15px;
    }
}

.patient-search {
    float: right;
    margin: 5px 0 8px 0;
    width: 90%;
}

.p-search {
    float: right;
    width: 70%;
}

.patient-search .search_field {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border: 1px solid #91a8b0;
    padding: 12px 10px 13px 10px;
    font-family: 'Raleway-Light';
    font-size: 13px;
    border-right: 0px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    float: left;
    width: 90%;
    outline: 0;
    margin: 0;
}

.patient-search i {
    width: 10%;
    float: left;
    background-color: #c32026;
    padding: 13px;
    color: #fff;
    cursor: pointer;
    border: 0px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-left: 0px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    text-align: center;
}

.patient-search i:hover {
    background-color: #0099ff;
}

.patient_list {
    float: right;
    margin: 12px 0;
}

.patient_list>li {
    float: left;
    list-style: none;
    color: #ffffff;
    font-size: 15px;
    padding: 8px 5px;
    margin: 0;
    font-weight: bold !important;
    margin: 0px;
    border-right: 1px solid #868686;
    border-radius: 0px;
    font-family: 'Raleway-Light';
}

.patient_list>li>a {
    font-size: 14px;
    border: none !important;
    color: #333;
    /*background: #0099ff;*/
    padding: 10px 10px 9px 10px;
    margin: 0 0 0 10px;
    border-radius: 3px;
}

.patient_list>li>a:hover,
.patient_list>li>a.active {
    color: #4bca81;
}

.top-menu_list {
    float: right;
    width: auto;
    margin: 0;
    padding: 0;
}

.top-menu_list li {
    float: left;
    list-style: none;
    color: #ffffff;
    font-size: 15px;
    padding: 20px 0px;
    margin: 0;
    margin: 0px;
    border-left: 1px dashed #91a8b0;
    border-radius: 0px;
    font-family: 'Roboto-Regular';
    font-weight: normal;
}

.top-menu_list li a {
    color: #333;
    margin: 0;
    padding: 10px;
}

.top-menu_list li a.book_app {
    font-size: 14px;
    padding: 20px 10px 15px 10px;
    color: #0099ff;
    background: transparent;
}

.top-menu_list li a.book_app:hover,
.top-menu_list li.active a.book_app {
    border-bottom: 5px solid #0099ff;
    color: #0099ff;
    background: transparent;
}

.top-menu_list li a.can_app {
    font-size: 14px;
    padding: 20px 10px 15px 10px;
    color: #f56767;
}

.top-menu_list li a.can_app:hover,
.top-menu_list li.active a.can_app {
    border-bottom: 5px solid #f56767;
    color: #ff1515;
}

.top-menu_list li a.add_pat {
    font-size: 14px;
    padding: 20px 20px 15px 20px;
    color: #0099ff;
}

.top-menu_list li a.add_pat:hover {
    border-bottom: 5px solid #0099ff;
    color: #0099ff;
}

.patient_history {
    float: left;
    width: 100%;
    padding: 0 15px 0 15px;
    margin: 0px;
    height: 410px;
    overflow-y: scroll;
    background-color: #fff;
    border-right: 1px dashed #91a8b0;
}

.patient_history h1 {
    float: left;
    width: 100%;
    font-size: 20px;
    color: #0099ff;
    font-family: 'Archer-Semibold';
    margin: 0px 0px 10px 0px;
    padding: 10px 0 0px 5px;
}

.patient_history ul {
    float: left;
    width: 100%;
    padding: 0;
    margin: 0;
}

.patient_history ul li {
    list-style: none;
    padding: 0;
    margin: 0;
    float: left;
    width: 100%;
}

.patient_history ul li a {
    font-size: 16px;
    color: #91a8b0;
    font-family: 'Roboto-Regular';
    text-transform: capitalize;
    float: left;
    width: 100%;
    padding: 6px;
    margin: 0;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    cursor: pointer;
}

.patient_history ul li a:hover {
    background: #def2ff;
    color: #09f;
}

.patient_history ul li.active a {
    font-size: 16px;
    font-family: 'Roboto-Regular';
    text-transform: capitalize;
    float: left;
    width: 100%;
    padding: 6px;
    margin: 0;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background: #09f;
    color: #fff;
}

.patient_history ul li a span.cap {
    float: left;
    font-size: 14px;
    margin-top: 4px;
}

.patient_history ul li a span.badge {
    float: right;
    color: #fff;
    font-size: 14px;
    font-family: 'Roboto-Regular';
}

.patient_history h5 {
    font-size: 13px;
    color: #333;
    font-family: 'Raleway-Semibold';
    text-transform: capitalize;
    float: left;
    width: 100%;
    padding: 8px 5px;
    margin: 0;
}

.patient_history h5 a {
    text-align: right;
    float: right;
    color: #0099ff;
    font-family: 'Raleway-Regular';
    font-size: 13px;
}

.view-all {
    float: left;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 13px;
}

.patient_history span.view-all a {
    text-align: right;
    float: right;
    color: #0099ff;
    width: 100%;
    font-family: 'Raleway-Regular';
    font-size: 13px;
}

.patient_history span.view-all a:hover {
    color: #0099ff;
    text-decoration: underline;
}

.patient_row a .patient_cont:hover {
    /*border: 1px solid #17b058;*/
    background-color: #def2ff;
}

.patient_cont {
    float: left;
    width: 100%;
    padding: 0px 0;
    /*border: 1px solid #91a8b0;*/
    margin: 10px 0px;
    background: #f9f9f9;
    border-radius: 4px;
    box-shadow: 0 0 8px rgb(0 0 0 / 3%);
}

.patient-all {
    padding-left: 0px;
}

.all_patient_list {
    float: left;
    width: 100%;
    height: 410px;
    overflow-y: scroll;
}

.image {
    width: 80px;
    height: 80px;
    background: #fff;
    padding: 0px;
    margin: 5px;
    float: left;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
}

.image img {
    width: 80px;
    height: 80px;
    float: left;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    padding: 5px;
}

.image-content {
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 18px;
}

.patient_cont p.name {
    color: #333;
    font-family: 'Roboto-Regular';
    text-align: left;
    padding: 0px;
    font-size: 18px;
    margin: 0px;
    white-space: normal;
    float: left;
    width: 100%;
    text-transform: capitalize;
}

.patient_cont p.phone {
    font-size: 18px;
    color: #333;
    font-family: 'Roboto-Regular';
    float: left;
    margin: 0px;
    padding: 0;
    width: 100%;
    text-align: left;
}

.patient_cont p.phone span,
.patient_cont p.name span {
    color: #0099ff;
    width: 100%;
    float: left;
    margin-bottom: 6px;
    font-size: 14px;
}

.patient_cont p.patient_id {
    font-size: 18px;
    color: #333;
    font-family: 'Roboto-Regular';
    float: left;
    margin: 0px;
    width: 100%;
    text-align: left;
}

.patient_cont p.patient_id span {
    color: #0099ff;
    width: 100%;
    float: left;
    margin-bottom: 6px;
    font-size: 14px;
}

.followupnotebtns{
    width: 100%;
    float: left;
    padding-bottom: 12px;
    padding-right: 18px;
}

.appointmentfollow {
         float: right;
    padding-left: 10px;
}

.appointmentfollow span{
    float: left;
    background-color: #0099ff;
    color: #fff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 12px 20px;
    font-style: normal;
    cursor: pointer;
    border: none;
    outline: 0;
    font-size: 14px;
    opacity: 1;
}

.folowupnew.appointmentfollow span, .followup_next.appointmentfollow span{
    background-color: #20af5d;
    color: #fff;
}

.appointmentfollow span:hover{
    opacity: .8;
}



.brd {
    float: left;
    width: 100%;
    margin-top: 3px;
}

.new-brd {
    float: left;
    width: 100%;
    border-bottom: 1px solid #91a8b0;
}

.patient_row {
    float: left;
    width: 100%;
    padding: 10px;
    font-family: 'Raleway-Regular';
}

.appointment_form {
    float: left;
    width: 100%;
}

.appointment_form label {
    float: left;
    color: #333;
    font-size: 15px;
    padding: 15px 0 0;
    line-height: 20px;
    width: 100%;
    white-space: normal;
    text-align: left;
}

.appointment_form label.error {
    float: left;
    width: 100%;
    padding: 3px 0;
    color: #f00;
    margin: 0;
    text-align: left;
    font-size: 14px;
    display: none;
}

.appointment_form .form {
    float: left;
    width: 100%;
    margin: 0;
    color: #333;
    outline: 0;
}

.appointment_form .form input,
.appointment_form .form textarea {
    border: 1px solid #ccc;
    padding: 8px;
    border-radius: 3px;
    width: 100%;
    margin: 0px 0 5px 0;
    color: #333;
    outline: 0;
    resize: vertical;
}

.appointment_row {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
}

.form .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100%;
    margin-bottom: 5px;
}

.form .bootstrap-select .btn-default {
    padding: 8px 15px !important;
}

.edit_profile_image {
    float: left;
    width: 100%;
}

.edit_profile_image .input_form {
    width: 100%;
    float: left;
}

.edit_profile_image .input_form a {
    width: auto;
    float: left;
    font-family: 'Roboto-Regular';
    font-size: 13px;
    background: #09f;
    padding: 10px;
    color: #fff;
    border-radius: 3px;
}

.edit_profile_image .input_form a:hover {
    background: #0785d8;
    color: #fff;
}

.edit_profile_image .input_form input {
    float: left;
    width: 70%;
}

.edit_profile_image .image {
    float: left;
    margin-top: 10px;
    margin-bottom: 18px;
    height: auto;
}

.edit_profile_image .image_size {
    background-color: #fff;
    border: 1px solid #ccc;
    margin: 0 auto;
    float: left;
    width: 100px;
    height: 100px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.edit_profile_image .image_size img {
    width: 100%;
    height: 100%;
    padding: 5px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}

.patient-pro {
    width: 100%;
    float: left;
}

.add_patient_form1 {
    float: left;
    width: 100%;
    margin: 0;
}

.add_patient_form1 label {
    float: left;
    color: #0099ff;
    font-size: 14px;
    padding: 14px 5px 0 0;
    line-height: 20px;
    width: 50%;
    white-space: normal;
    text-align: left;
    font-family: 'Roboto-Regular';
}

.add_patient_form1 .input_form {
    float: left;
    font-family: 'Roboto-Regular';
    font-size: 15px;
    color: #333;
    margin-top: 17px;
    text-transform: capitalize;
}

.add_patient_form2 {
    float: left;
    width: 100%;
    margin: 0;
}

.add_patient_form2 label {
    float: left;
    color: #0099ff;
    font-size: 14px;
    padding: 14px 5px 0 0;
    line-height: 20px;
    width: 32%;
    white-space: normal;
    text-align: right;
    font-family: 'Roboto-Regular';
}

.add_patient_form2 .input_form {
    float: left;
    font-family: 'Roboto-Regular';
    font-size: 15px;
    color: #333;
    margin-top: 17px;
}

.contact_details {
    float: left;
    width: 100%;
    border-bottom: 1px solid #91a8b0;
    font-size: 18px;
    color: #c32026;
    font-family: 'Roboto-Medium';
    text-align: left;
    margin-top: 15px;
    padding-bottom: 6px;
}

.sidebarCollapse {
    float: left;
}


/* communication */

.communication ul {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
}

.communication ul li {
    float: left;
    width: 100%;
    list-style: none;
    font-size: 16px;
    color: #656565;
    margin: 0;
    padding: 4px 0;
    font-family: 'Gotham-Book';
}

.communication ul li a {
    background-color: #0099ff;
    color: #fff;
    padding: 9px 15px;
    margin: 0px 0px 0px 5px;
    font-size: 14px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    font-family: 'Gotham-Book';
}

.communication ul li a:hover {
    background-color: #20af5d;
    color: #fff;
    padding: 9px 15px;
    font-size: 14px;
    font-family: 'Gotham-Book';
}

.communication ul li .radio {
    float: right;
    margin: 0;
    padding: 0;
}

.communication ul li .radio span {
    margin: 0 10px;
}

.communication ul li .radio span input[type="radio"] {
    display: none;
}

.communication ul li .radio span input[type="radio"]+label {
    color: #333;
    width: 100%;
    float: left;
    padding: 0;
    text-align: left;
}

.communication ul li .radio span input[type="radio"]+label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -2px 10px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -38px;
    background-size: cover;
    cursor: pointer;
}

.communication ul li span input[type="radio"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -58px;
    background-size: cover;
}

.recent_app {
    float: left;
    width: 100%;
    margin: 10px 0 0;
    padding: 0px;
    font-family: 'Gotham-Book';
}

.recent_app h1 {
    color: #0099ff;
    font-size: 23px;
    padding: 10px 0px;
    font-family: 'Gotham-Book';
    float: left;
    width: 100%;
    margin: 0px 0px 13px 0px;
    border-bottom: 1px solid #ccc;
}

.recent_app ul {
    float: left;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

.recent_app ul li {
    float: left;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 8px 10px;
    background: #fff;
    border-bottom: 1px dashed #91a8b0;
}

.recent_app ul li span {
    width: 18%;
    padding: 10px;
    margin: 0 5px;
    font-family: 'Roboto-Medium';
    font-size: 12px;
    color: #91a8b0;
    text-transform: capitalize;
    text-align: left;
    border-right: 1px dashed #91a8b0;
}

.recent_app ul li span:last-child {
    border-right: none;
}

.recent_app ul li span h5 {
    width: 100%;
    display: block;
    padding: 5px 0 0 0;
    margin: 0;
    font-family: 'Roboto-Regular';
    font-size: 14px;
    text-transform: capitalize;
    color: #0099ff;
    text-align: left;
}

.recent_app ul li a {
    color: #656565;
    text-decoration: none;
    font-size: 16px;
}

.recent_app ul li a:hover {
    color: #20af5d;
    text-decoration: none;
}

.tab-content {
    float: left;
    width: 100%;
}

.checkbox_text {
    float: left;
    width: 100%;
}

.checkbox_text input[type="checkbox"] {
    display: none;
}

.checkbox_text input[type="checkbox"]+label {
    color: #606060;
    width: 100%;
    float: left;
    padding: 5px 0 5px 0px;
    font-size: 13px;
    text-align: left;
    font-family: 'Raleway-Regular';
    font-weight: normal;
}

.checkbox_text input[type="checkbox"]+label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -2px 5px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: cover;
    color: #606060;
    cursor: pointer;
}

.checkbox_text input[type="checkbox"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -18px !important;
    background-size: cover;
}

.content-heading ul li a {
    font-size: 14px;
    padding: 20px 10px 15px 10px;
    color: #0099ff;
    background: transparent;
}

.content-heading ul li a.save {
    color: #0099ff;
}

.content-heading ul li a.save:hover,
.content-heading ul li.active a.save {
    background: transparent;
    border-bottom: 5px solid #0099ff;
    color: #0099ff;
    padding: 20px 10px 15px 10px;
}

.clinic_notes label.head {
    width: 37%;
    text-align: right;
    padding: 0 15px;
    color: #91a8b0;
    font-family: 'Roboto-Regular';
    float: left;
}

.clinic_notes span.inner {
    width: 63%;
}

.clinic_notes span.new-inner {
    width: 63%;
}

.new-field {
    float: right;
    color: #ff0000;
    font-size: 16px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 20px 0px 7px 5px;
    font-family: 'Raleway-Light';
    margin-left: 0;
    cursor: pointer;
    margin-top: 0;
    width: 2%;
}

.new-field i {
    font-size: 18px;
    float: left;
    padding-right: 0px;
    position: relative;
    top: 0px;
}

.add_btn {
    float: left;
    color: #fff;
    font-size: 16px;
    background-color: #0099ff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 7px 12px;
    font-family: 'Roboto-Regular';
    margin-left: 10px;
    cursor: pointer;
    margin-top: 5px;
}

.add_btn i {
    font-size: 12px;
}

.clr-tooltip+.tooltip>.tooltip-inner {
    background-color: #4bca81;
    opacity: 1 !important;
}

.tooltip.top .tooltip-arrow {
    border-top-color: #4bca81;
    opacity: 1 !important;
}

.tooltip-inner {
    width: 120px;
}

.prescription .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: auto !important;
}

.prescription {
    font-family: 'Raleway-SemiBold';
}

.prescription tbody tr td i {
    color: #f00;
    font-size: 25px;
    cursor: pointer;
    vertical-align: middle;
    float: left;
    margin-top: 6px;
}

.medicine_name {
    float: left;
    width: 100%;
    color: #333;
    font-family: 'Raleway-SemiBold';
    font-size: 16px;
    white-space: normal;
    text-transform: capitalize;
}

.drugs {
    float: left;
    width: 100%;
    background: #fff;
    font-family: 'Raleway-Regular';
    height: 460px;
    overflow-y: scroll;
    background: #f3f3f3;
    margin: 0;
    padding: 0;
}

.drugs_search .search {
    width: 100%;
}

.drugs_search .search .search-text {
    width: 85%;
}

.drugs_search .search .search-but {
    width: 15%;
}

.drugs ul {
    float: left;
    width: 100%;
    margin: 10px 0;
    padding: 0;
}

.drugs ul li {
    float: left;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #ccc;
}

.drugs h1 {
    color: #fff;
    font-size: 18px;
    padding: 10px 0px;
    background: #4d6880;
    font-family: 'Raleway-SemiBold';
    float: left;
    width: 100%;
    text-align: center;
    margin: 0px 0px 13px 0px;
}

.drugs ul li a {
    color: #333;
    text-decoration: none;
    font-size: 15px;
    float: left;
    margin: 0;
    padding: 10px;
    width: 100%;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.drugs ul li a:hover {
    background: #4bca81;
    color: #fff;
}


/* edit patient */

.edit_patient {
    float: left;
    width: 80%;
    margin-top: 10px;
}

.bottom_butns {
    float: left;
    width: 100%;
    margin: 0;
    padding: 10px 0;
    border-top: 1px solid #ccc;
}

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
    background-color: #20af5d;
}

input[type="checkbox"] {
    display: none;
}

input[type="checkbox"]+label {
    color: #606060;
    width: 100%;
    float: left;
    padding: 5px 0 5px 0px;
    font-size: 13px;
    text-align: left;
    font-family: 'Raleway-Regular';
    font-weight: normal;
}

input[type="checkbox"]+label span {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: -2px 5px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: cover;
    color: #606060;
    cursor: pointer;
}

input[type="checkbox"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -18px !important;
    background-size: cover;
}

.complaints_view input[type="checkbox"] {
    display: none;
}

.complaints_view input[type="checkbox"]+label {
    color: #606060;
    width: 85%;
    float: left;
    padding: 5px 0 5px 0px;
    font-size: 13px;
    text-align: left;
    font-family: 'Roboto-Regular';
    font-weight: normal;
}

.complaints_view input[type="checkbox"]+label span {
    display: inline-block;
    width: 20px !important;
    height: 20px;
    margin: -2px 5px 0 0;
    vertical-align: middle;
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: 0px;
    background-size: cover;
    color: #606060;
    cursor: pointer;
}

.complaints_view input[type="checkbox"]:checked+label span {
    background-image: url('../images/radio+checkbox.png');
    background-repeat: no-repeat;
    background-position: -18px !important;
    background-size: cover;
    width: 20px !important;
}

.complaints_view {
    float: left;
    width: 49%;
    color: #606060;
    padding: 0px 0 5px 0px;
    font-size: 13px;
    text-align: left;
    font-family: 'Raleway-Regular';
    font-weight: normal;
}

.complaints_view label {
    margin: 0 5px;
}

.time_slot {
    float: left;
    width: 100%;
    font-family: 'Gotham-Book';
}

.time_slot ul {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
}

.time_slot ul li {
    list-style: none;
    margin: 0;
    padding: 1px;
    float: left;
    width: 32%;
    text-align: center;
}

.time_slot ul li a {
    float: left;
    width: 100%;
    color: #fff;
    background: #0099ff;
    margin: 0;
    font-size: 12px;
    padding: 10px 0;
    cursor: pointer;
    border-radius: 2px;
    font-family: 'Roboto-Regular';
}

.time_slot ul li a:hover,
.time_slot ul li a:focus,
.time_slot ul li a.select_slot {
    color: #fff;
    background: #4bca81;
    font-family: 'Roboto-Regular';
}

.pad {
    padding: 0 10px!important;
}

.time_slot ul li a.select_slot {
    color: #fff;
    background: #4bca81 !important;
    font-family: 'Roboto-Regular';
}

.time_slot ul li a.disabled {
    background: #def2ff;
    opacity: 0.7;
    color: #09f;
}

.time_slot ul li a.disabled:hover {
    background: #0099ff;
    opacity: 0.5;
    color: #fff;
}

.time_slot h1 {
    color: #c32026;
    font-size: 16px;
    padding: 10px 0px;
    font-family: 'Roboto-Medium';
    float: left;
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #ccc;
}

.row_flex_center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.details_dot_last {
    position: relative;
}

.details_dot_last:after {
    content: ":";
    position: absolute;
    right: 0;
}

.add_patient_form .input_form.time_slot {
    float: left;
    width: 100%;
    margin: 0;
    color: #333;
    outline: 0;
}

.add_book_appointment_form {
    float: left;
    width: 100%;
}

.add_book_appointment_form .add_patient_form label,
.add_book_appointment_form .add_patient_form .input_form {
    width: 100%;
}

.Zebra_DatePicker_Icon_Wrapper {
    width: 100%;
}

.tooltip-inner {
    color: #fff;
    background: #4bca81;
}

.tooltip.right .tooltip-arrow {
    border-right-color: #4bca81;
}

.details_heading {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
}

.details_heading ul {
    float: left;
    width: 100%;
    margin: 0px 0px 15px 0px;
    padding: 10px 0 10px 0;
    background-color: #def2ff;
}

.details_heading ul li {
    float: left;
    width: 25%;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

.details_heading ul li a {
    color: #333;
    font-size: 15px;
    text-decoration: none;
    font-family: 'Roboto-Regular';
    line-height: 32px;
    float: left;
    padding: 0;
    margin: 0;
    text-transform: capitalize;
}

.details_heading ul li a span {
    width: 30px;
    float: left;
    height: 30px;
    background: #fff;
    border: 1px solid #ccc;
    padding: 2px;
    margin: 0 10px 0 0px;
}

.detail_name {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
    font-family: 'Roboto-Regular';
    font-weight: normal;
    color: #0099ff;
}

.detail_name_date {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 19px;
    font-family: 'Roboto-Regular';
    font-weight: normal;
    color: #009688;
}

.detail_id {
    float: left;
    padding-left: 10px;
    color: #0099ff;
    font-size: 14px;
    font-family: 'Roboto-Regular';
    font-weight: normal;
    margin-right: 4px;
}

.details_heading ul li a span img {
    width: 100%;
}

.details h3 {
    color: #333;
    font-size: 16px;
    padding: 10px 0px;
    font-family: 'Roboto-Regular';
    float: left;
    width: 100%;
    margin: 10px 0;
}

.details_view {
    float: left;
    width: 100%;
    margin: 10px 0;
}

.details_view ul {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0 0 0 10px;
    border-left: 1px solid #0099ff;
}

.details_view ul li {
    color: #333;
    font-size: 15px;
    list-style: none;
    text-decoration: none;
    font-family: 'Roboto-Light';
    line-height: 25px;
    float: left;
    padding: 0;
    margin: 0;
    width: 100%;
    text-transform: capitalize;
}

.dr_name {
    float: left;
    width: 100%;
    margin: 10px 0px 30px 0px;
    color: #333;
    padding: 10px 0 20px 0;
    font-family: 'Roboto-Regular';
    text-align: center;
    font-size: 21px;
    border-bottom: 1px solid #F44336;
}

.dr_name span {
    color: #0099ff;
    font-family: 'Roboto-Medium';
    text-transform: capitalize;
}

.vital_signs_details,
.prescription_details {
    float: left;
    width: 100%;
}

.vital_signs_details table tr th,
.prescription_details table tr th {
    background-color: #def2ff;
    font-family: 'Roboto-Regular';
    padding: 9px 15px;
    font-size: 16px;
    white-space: nowrap;
}

.vital_signs_details table tr td,
.prescription_details table tr td {
    font-family: 'Roboto-Regular';
    padding: 9px 15px;
    font-size: 15px;
    font-weight: normal;
    border-bottom: 1px solid #d1d1d1;
    color: #333;
}

.timeline1 {
    float: left;
    width: 100%;
}

.patient_list li a.cancel_btn {
    font-size: 15px;
    border: none !important;
    color: #fff;
    background: #ff1515;
    padding: 10px 10px 9px 10px;
    margin: 0 0 0 10px;
    border-radius: 3px;
}

.patient_list li a.cancel_btn:hover,
.cancel_btn:focus {
    background: #b70404;
}

.cancel_app {
    float: left;
    width: 100%;
    margin: 15px 0px 15px 0px;
    padding: 0px 10px 0px 0px;
    height: 410px;
    overflow-y: scroll;
}

#example {
    margin-top: 10px;
    float: left;
}

.cancel_app thead th,
table.dataTable.no-footer {
    border-bottom: 1px solid #91a8b0 !important;
}

.cancel_app thead th {
    color: #09f;
}

.cancel_app thead th,
.cancel_app tbody td {
    font-family: 'Roboto-Regular';
    font-size: 13px;
    padding: 12px 0 12px 10px !important;
    text-transform: capitalize;
    font-weight: normal !important;
}

.cancel_app .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    color: #fff !important;
    background: #0099ff !important;
    font-family: 'Roboto-Regular';
    border: none !important;
}

.cancel_app .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #fff !important;
    background: #4bca81 !important;
}

.cancel_app .dataTables_wrapper .dataTables_paginate .paginate_button {
    min-width: 25px !important;
    padding: 4px !important;
    font-family: 'Roboto-Regular';
}

.cancel_app label {
    font-family: 'Roboto-Regular';
    font-size: 14px;
}

.cancel_app input[type=search] {
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border: 1px solid #cfcfcf;
    padding: 5px 10px 5px 10px;
    font-family: 'Roboto-Regular';
    font-size: 13px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    outline: 0;
}

.on {
    color: #333;
    font-size: 17px;
}

.date1 {
    color: #fff;
    font-size: 17px;
    background-color: #0099ff;
    padding: 5px 10px;
}

.slot_error {
    font-family: 'Roboto-Regular';
    font-size: 13px;
    line-height: 20px;
    color: #f00;
}

.old-medical_history {
    float: left;
    width: 100%;
}

.old-medical_history span {
    color: #0099ff;
    font-size: 16px;
    padding: 10px 0 0px 0;
    font-family: 'Roboto';
    float: left;
    width: 100%;
    line-height: 30px;
    margin: 0;
    border-bottom: 1px solid #91a8b0;
}


/*
input[type='text'], input[type='password']{
	border: 1px solid #91a8b0;
	/*padding: 10px 15px;*/


/*border-radius: 3px;
width: 100%;
color: #333;
outline: 0;
font-size: 13px;
font-family: 'Roboto-Regular';
}
input[type='text']:hover, input[type='text']:focus, input[type='password']:hover, input[type='password']:focus{
border: 1px solid #0099ff;
font-family: 'Roboto-Regular';
/*padding: 10px 15px;
font-size: 13px;
}
*/


/* responsive css */

@media (min-width:320px) and (max-width:767px) {
    .patient-search {
        width: 100%;
    }
    .details_heading ul li {
        width: 100%;
        padding: 5px 0;
    }
    .details h3 {
        margin: 0;
    }
    .patient-search .search_field {
        width: 85%;
    }
    .patient-search i {
        width: 15%;
    }
    .patient_history {
        border-bottom: 1px dashed #91a8b0;
        border-right: none;
        padding: 0 15px 10px 0px;
        margin: 0px;
        height: auto;
    }
    .patient_cont {
        width: 100%;
    }
    .add_patient_form1 label {
        text-align: left;
    }
    .add_patient_form2 label {
        width: auto;
    }
    .add_patient_form label,
    .add_patient_form .input_form {
        width: 100%;
        text-align: left;
    }
    .recent_app {
        padding: 0;
        margin: 0;
    }
    .recent_app ul li span {
        width: 100%;
        border-bottom: 1px dashed #91a8b0;
        border-right: none;
        padding: 5px 0 10px 0;
    }
    .recent_app ul li {
        padding: 8px 0px;
    }
    .xs-pad {
        padding: 0;
    }
    .time_slot ul li {
        width: 50%;
    }
    .heading_text h1 {
        padding: 15px 0 15px 0;
        font-size: 15px;
    }
    .top_list>li {
        margin: 0px 0px 0px 5px !important;
    }
    .top_list>li a,
    .save {
        font-size: 12px !important;
        padding: 12px 10px;
    }
    .top_list>li a.cancel,
    .top_list>li span.save {
        margin-left: 0;
    }
    .top_list>li span.save {
        padding: 12px 10px;
    }
}

@media (min-width:768px) and (max-width:991px) {
    .patient-search .search_field {
        width: 85%;
    }
    .sm-pad {
        padding: 0;
    }
    .patient_history ul li a span.badge {
        font-size: 11px;
    }
    .top-menu_list li a.book_app,
    .top-menu_list li a.can_app {
        font-size: 12px;
    }
    .add-icon i {
        font-size: 16px !important;
    }
    .top-header-add-patient {
        padding: 8px 10px 12px 0px;
    }
    .patient-search i {
        width: 15%;
    }
    .patient_cont {
        width: 48%;
        min-height: 100px;
        margin: 3px;
        padding: 0;
    }
    .image {
        width: 75px;
        height: 75px;
    }
    .image img {
        width: 100%;
        height: 75px;
    }
    .image-content {
        width: 58%;
    }
    .patient_cont p.name,
    .patient_cont p.phone,
    .patient_cont p.patient_id {
        font-size: 12px;
    }
    .profile_image {
        width: 35%;
    }
    .contact_details_form {
        width: 80%;
    }
    .add_patient_form1 label,
    .add_patient_form1 .input_form {
        width: 50%;
        font-size: 13px;
    }
    .medical_heading h1 {
        font-size: 14px;
    }
    .content-heading h1 {
        font-size: 15px;
        padding: 8px 0;
    }
}

@media (min-width:320px) and (max-width:480px) {
    .top-menu_list li {
        float: left;
        width: 100%;
        text-align: center;
        margin: 0;
        padding: 0;
        border-top: 1px dashed #91a8b0;
        border-left: none;
    }
    .top-menu_list li a.book_app:hover,
    .top-menu_list li.active a.book_app,
    .top-menu_list li a.book_app,
    .top-menu_list li a.can_app {
        float: left;
        width: 100%;
    }
}

@media (min-width:768px) and (max-width:991px) {
    .clinic_notes label.head {
        width: 100%;
        text-align: left;
        padding: 0px 0 10px 0;
        color: #91a8b0;
        font-family: 'Roboto-Regular';
    }
    .add_btn {
        margin-top: 40px;
    }
    .complaints1 {
        width: 98%;
    }
    .clinical-notes .inner .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
        width: 90% !important;
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .time_slot ul li {
        width: 50%;
    }
    .patient_cont {
        width: 48%;
    }
    .edit_profile_image .input_form a {
        font-size: 11px;
    }
    .clinic_notes span.inner {
        width: 100%;
    }
    .clinic_notes label.head {
        width: 100%;
        text-align: left;
        padding: 0px 0 10px 0;
        color: #91a8b0;
        font-family: 'Roboto-Regular';
    }
    .add_btn {
        margin-top: 40px;
    }
    .clinical-notes .inner .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
        width: 74% !important;
    }
}

.modal-body label {
    padding: 10px 0 5px 0;
    font-family: 'Roboto-Regular';
    font-size: 14px;
}

.clinical-notes .inner .bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 100% !important;
}

.new-back {
    float: right;
    padding: 10px 10px;
    color: #fff;
    background-color: #0099ff;
    font-size: 15px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border: none;
    cursor: pointer;
}

.new-back:hover {
    float: right;
    padding: 10px 10px;
    color: #fff;
    background-color: #0099ff;
    font-size: 15px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.remove_field {
    color: #f56767;
    font-size: 16px;
    cursor: pointer;
}

.remove_field:hover,
.remove_field:focus {
    color: #f56767;
}

.doctor_panel {
    font-size: 32px;
    color: #c32026;
    font-family: 'Archer-Semibold';
    margin-top: 0px;
    float: left;
    text-align: left;
    width: 65%;
    padding: 12px 0px;
}

#sidebar.active .sidebar-header.sidebarCollapse .right-arrow {
    display: block !important;
}

#sidebar.active .sidebar-header.sidebarCollapse .left-arrow {
    display: none;
}

.right-arrow {
    display: none;
}

.left-arrow {
    width: 100%;
    float: right;
}

.from_days {
    float: left;
    width: 37%;
}

.from_days label {
    width: 60px;
    float: left;
    font-family: 'Roboto-Regular';
    font-size: 15px;
    font-weight: 400;
    margin-top: 10px;
    text-align: left;
    padding-left: 10px;
}

.from_days input {
    border: 1px solid #91a8b0;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    padding: 10px;
    width: 66%;
    font-family: 'Roboto-Regular';
    line-height: 1.42857143;
    font-size: 13px;
    outline: 0;
}

.input_form2 input[type=button] {
    float: left;
    background-color: #0099ff;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    padding: 12px 20px;
    margin: 10px 0 0 0;
    font-style: normal;
    cursor: pointer;
    color: #fff;
    border: none;
}

.input_form2 input[type=button]:hover,
.input_form2 input[type=button]:focus {
    background-color: #038ae4;
    border: none;
}

@media (min-width:768px) and (max-width:1024px) {
    .add_patient_form label {
        width: 100%;
        text-align: left;
    }
    table.dataTable>tbody>tr.child ul.dtr-details li {
        float: left;
        width: 100%;
    }
    table.dataTable>tbody>tr.child span.dtr-title {
        float: left;
        padding: 0 10px 0 0;
        text-align: left;
    }
    table.dataTable>tbody>tr.child ul.dtr-details {
        text-align: left;
        float: left;
    }
    table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child,
    table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child {
        text-align: center;
    }
    .add_patient_form .input_form {
        width: 100%;
    }
    .add_patient_form {
        margin: 0 0 0 5px;
    }
    .time_slot ul li {
        width: 50%;
    }
    .add_patient_form .input_form textarea {
        width: 100%;
    }
    .add_form {
        width: 100%;
    }
    .profile_image .image_size1 {
        margin: 0;
    }
    .add_patient_form .input_form2 {
        width: 60%;
        margin: 0;
    }
    .doctor_panel {
        font-size: 22px;
        color: #c32026;
        font-family: 'Archer-Semibold';
        margin-top: 0px;
        float: left;
        text-align: left;
        width: 35%;
        padding: 20px 0px 0 0;
    }
}

.md-top-mar {
    margin: 10px 0 0 0;
}

.md-bot-mar {
    margin: 0px 0 10px 0;
}


/*.clipboard-active
{
  color: #fff !important;
  background-color:#0099ff;
  padding:5px 10px !important;
  border-radius:4px;
  line-height: 18px;
}
.clipboard-active:hover,
.clipboard-active:focus{
  color:#fff !important;
    background-color:#0099ff;
}*/

ul.complaint_list li.clipboard-active {
    color: #0099ff !important;
}

ul.complaint_list li.clipboard-active:hover,
ul.complaint_list li.clipboard-active:focus {
    color: #0099ff !important;
}

.investigation_add {
    padding: 10px 10px;
    color: #fff;
    background-color: #0099ff;
    font-size: 15px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    cursor: pointer;
}

.investigation_inputt {
    padding: 8px 10px;
    font-size: 15px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border: 1px solid #d1d1d1;
}

.creatinine_timeline {
    margin-top: 40px;
}

.creatinine_timeline .highcharts-container {
    width: 100% !important;
}

.timeline_from_to_input.input_form {
    width: 100%;
}

.timeline_from_to_input.input_form input {
    margin: 0px;
}



.timeline_from_to {
    width: 100%;
    float: left;
    margin-top: 40px;
}

.timeline_from_to_submit button {
    background-color: #20af5d;
    color: white;
    padding: 12px 18px;
    margin: 0px;
    border: none;
    cursor: pointer;
    float: left;
    width: auto;
    font-family: 'Roboto-Regular';
    letter-spacing: 0px;
    font-size: 15px;
    border-radius: 3px;
}

.display_flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.mainappointments_right_heading{
    color: #0099ff;
    font-size: 18px;
    padding: 4px 0 4px 0;
    font-family: 'Roboto-Regular';
    float: left;
    width: 100%;
    margin: 0;
    line-height: 30px;
}
.clnc-nts{
	width:100%;
	float: left;
	padding-bottom:15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #f2f2f2;
}
.clnc-nts h6{
	width:200px;
	float: left;
	padding:0;
	margin:0 20px 0 0;
	color:#999;
	font-family: 'Roboto-Medium';
    font-size: 16px;
    text-align: left;
	line-height: 21px;
}
.clnc-nts span.clnc-cnt{
	width:calc(100% - 220px);
	float: left;
	font-family: 'Roboto-Regular';
	font-size: 15px;
	padding:0;
	margin:0;
	color:#232323;
	line-height: 24px;
}
span.float-right{
  float: right;
}
.frm-dt-todte{
    width:100%;
    float:left;
    margin-top:20px;
}
.cancel_app .dt-buttons button.dt-button{
       background-color: #09f;
    padding: 8px 15px;
    margin: 10px 10px 10px 0;
    border-radius: 4px;
    color: #fff;
    border: 0;
    font-size: 15px;
    outline:0;
    transition:0.3s;
}
.cancel_app .dt-buttons button.dt-button:hover{
    background-color:#1c8dd8;
}