.UISpecialistControl  .Title span{
        text-decoration: none;
        padding: 0;
        font-size: 2rem;
        color: #0b60a4;
        text-transform: uppercase;
        font-weight: 500;
        display: flex;
        align-items: center;
}
.UISpecialistControl  .Title span:after {
        content: '';
        display: inline-block;
        width: 40px;
        height: 40px;
        background: url(images/iconbvdkbd.png);
        background-size: contain;
        background-repeat: no-repeat;
        margin-left: 10px;
}
.UISpecialistControl {
        padding: 20px 0;
        padding-top: 0;
}
.UISpecialistControl  .Title{
        margin-bottom: 10px;
}
.UISpecialistControl   .Content {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 {
        padding: 20px;
        margin: 10px;
        background: white;
        box-shadow: 0 0 10px 0 rgb(0 0 0 / 15%);
        flex-grow: 1;
        display: inline-block;
        max-width: 100%;
        padding-top: 30px;
        transition: all 300ms;
        /* outline: 1px solid #96bad8; */
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 img {
        width: 100px;
        height: 100px;
        margin-bottom: 10px;
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 a {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-decoration: none;
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2:hover{
        transform: translateY(-10px);
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 a span {
        text-align: center;
        font-size: 16px;
        font-weight: bold;
        color: #0b60a4;
        text-decoration: none;
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 img[src=""] {
        position: relative;
        /* border: 1px solid #b9d5f2; */display: inline-block;
}
.UISpecialistControl .item.col-6.col-sm-3.col-lg-2 img[src=""]::after {
        content: "\f21e";
        width: 100%;
        height: 100%;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 0;
        left: 0;
        /* font-weight: bold; */
        font: normal normal normal 60px/1 FontAwesome !important;
        color: #dd303f;
}
.UIMedicalSpecialist {
        padding: 15px 0;
        padding-top: 0;
}
.UIMedicalSpecialist .container {
        padding: 0;
        margin: 0;
        width: 100%;
        max-width: 100%;
}
.UIMedicalSpecialist .container .Header .title {
        font-size: 15px;
        color: #ffffff;
        display: block;
        margin: 0 auto;
        text-align: center;
        font-weight: 500;
        width: fit-content;
        z-index: 2;
        position: relative;
        background: #003966;
        display: block;
        border-radius: 15px;
        padding: 5px 40px;
        margin-bottom: 10px;
}
.UIMedicalSpecialist .container .Header .description {
        font-size: 16px;
        color: #757575;
        display: block;
        margin-bottom: 10px;
}
.UIMedicalSpecialist .container .Header a.viewMore {
        padding: 5px 20px;
        background: #dd303f;
        color: white;
        border-radius: 100px;
        display: inline-block;
        font-weight: bold;
        /* position: absolute; */
        bottom: 0px;
        margin: 0 auto;
}
.UIMedicalSpecialist .container .Header{
        display: inline-block;
        height: auto;
        width: 100%;
        margin-bottom: 15px;
        text-align: center;
}
.UIMedicalSpecialist .container .Header::after{
        content: '';
        position: relative;
        /* bottom: 0px; */ /* Vị trí dưới thẻ div */
        top: -58px;
        left: 0;
        z-index: 0;
        color: #132dc2;
        /* padding: 5px 10px; */
        background: #088d1d;
        display: block;
        width: 100%;
        height: 2px;
        border-radius: 5px;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) {
        /* background: #1766a6; */
        padding: 15px 0;
        padding-top: 0;
        width: 100%;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1)  span.lblAcademicLevel * {
        margin: 2px 0 !important;
        color: #424242;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) ol.flickity-page-dots {
        display: none;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) img.imgAvatar {
        width: 100%;
        object-fit: cover;
        object-position: top;
        max-height: 650px;
        min-height: 650px;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .flickity-viewport {
        background: #0b60a414;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail {
        display: flex;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-avatar {
        flex: 1;
        width: 50%;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-info {
        flex: 1;
        /* margin-left: 20px; */
        padding: 10px 40px;
        display: flex;
        flex-direction: column;
        font-size: 18px;
        color: #0b60a4;
        justify-content: flex-start;
        align-items: flex-start;
        /* font-weight: bold; */
        /* background: #0b60a414; */
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) a.lnkMedicalSchedule {
        padding: 8px 20px;
        display: block;
        color: #fff;
        background: #dd303f;
        width: auto;
        border-radius: 100px;
        font-size: 16px;
        margin-top: 20px;
        font-weight: bold;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) span.lblName {
        font-size: 2rem;
        color: #dd303f;
}
.carousel-cell {
        width: 100%;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) span.lblPosition {
        font-weight: bold;
}
.UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-info * {
        margin-bottom: 10px;
        line-height: 1.4;
        font-size: 16px;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2) .flickity-slider {
        display: flex;
        align-items: stretch;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2) .carousel-cell {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 23.9%;
        box-shadow: 0 0 10px 0 rgb(0 0 0 / 16%);
        flex-grow: 1;
        cursor: pointer;
        margin-bottom: 10px;
        min-height: 98%;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2) .carousel-cell+.carousel-cell {
        margin-left: 15px;
        /* background: #ebf2f8; */
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2)  img.imgAvatar {
        width: 100%;
        height: 330px;
        object-fit: cover;
        margin-bottom: 20px;
        object-position: top;
        background: #ecf3f8;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2)  .info {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0 20px 20px 20px;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2)  span.lblAcademicLevel {
        display: none;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2)  span.lblName {
        font-size: 16px;
        font-weight: bold;
        color: #0b60a4;
        margin-bottom: 5px;
}
.UIMedicalSpecialist .carousel.carousel-nav.flickity-enabled:nth-child(2)  span.lblPosition {
        font-size: 16px;
        font-weight: bold;
        color: #dd303f;
}
.UIMedicalSpecialistSearching {
        width: 100%;
        padding: 20px 0;
        padding-top: 0;
}
.UIMedicalSpecialistSearching .container {
        padding: 0;
}
.UIMedicalSpecialistSearching .condition {
        display: flex;
        align-items: center;
        padding: 20px;
        /* background: #0b60a4; */
        margin-bottom: 20px;
        background: #0b60a414;
}
.UIMedicalSpecialistSearching .condition>div {
        flex: 1;
        width: 20%;
        overflow: hidden;
}
.UIMedicalSpecialistSearching .condition>div+div{
        margin-left: 10px;
}
.UIMedicalSpecialistSearching .condition>div input, 
.UIMedicalSpecialistSearching .condition>div select,
.UIMedicalSpecialistSearching .condition>div button{
        width: 100%;
        padding: 6px 10px;
        font-size: 14px;
        border: 1px solid #e4e4e4;
}
.UIMedicalSpecialistSearching .condition>div input[type='submit']{
        background: #dd303f;
        color: white;
        font-weight: bold;
        border: none;
}
.UIMedicalSpecialistSearching .result {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: center;
        padding-bottom: 40px;
}
.UIMedicalSpecialistSearching .item.col-sm-12 {
        flex-grow: 1;
        width: 32%;
        display: flex;
        flex-direction: column;
        align-items: center;
        max-width: 32%;
        box-shadow: 0 0 10px 0 rgb(0 0 0 / 16%);
        padding: 10px;
        margin: 5px;
}
.UIMedicalSpecialistSearching .avatar img {
        width: 100%;
        height: 230px;
        object-fit: cover;
        margin-bottom: 20px;
        object-position: top;
}
.UIMedicalSpecialistSearching .info {
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 0 10px 10px 10px;
}
.UIMedicalSpecialistSearching .info  span.lblAcademicLevel {
        display: none;
}
.UIMedicalSpecialistSearching .info  span.lblName {
        font-size: 16px;
        font-weight: bold;
        color: #0b60a4;
        margin-bottom: 5px;
}
.UIMedicalSpecialistSearching .info span.lblPosition {
        font-size: 16px;
        font-weight: bold;
        color: #dd303f;
}
.UIMedicalSpecialistSearching .pagination {
        display: flex;
        align-items: center;
        justify-content: center;
}
.UIMedicalSpecialistSearching .pagination>span {
        width: 35px;
        height: 35px;
        border: 1px solid #e4e4e4;
        display: flex;
        align-items: center;
        justify-content: center;
}
.UIMedicalSpecialistSearching .RadDropDownList_Office2007 .rddlInner  {
        background: white !important;
        padding: 6px 10px;
        border-radius: 0px !important;
        border: 1px solid #e4e4e4 !important;
}
.UIMedicalSpecialistSearching .RadDropDownList_Office2007 .rddlInner  .rddlIcon {
        background-position: -25px -15px !important;
}
.UIMedicalSchedule  .col-sm-4 {
        padding: 5px;
}
.UIMedicalSchedule .form-group {
        margin-bottom: 0;
}
.UIMedicalSchedule .Search {
        margin-bottom: 10px;
}
.UIMedicalSchedule td.Name.p-2 {
}
.UIMedicalSchedule td.Name.p-2 label {
        display: inline-block;
        width: 60%;
}
.UIMedicalSchedule td.Name.p-2 img {
        object-fit: cover;
}
.profile.d-flex.mb-4 {
        gap: 10px;
}
.UIMedicalSchedule {
        padding: 0;
}
.flickity-page-dots{
        display:none;
}
.flickity-slider {
        transform: none ;
}
.showSingle .carousel-cell{
        width: 18%!important;
        height: 200px;
        margin-right: 10px;
        text-align: center;
        border-radius: 5px;
        counter-increment: carousel-cell;
}
.showSingle .carousel-cell .info {
        margin-top:10px;
        font-family: arial;
        font-size: 12px;
}
.showSingle .carousel-cell .info .lblName{
        font-size:14px;
        font-weight: 600;
        display: block;
        width: 100%;
}
.flickity-viewport{
        height:250px!important
}
.flickity-prev-next-button .flickity-button-icon {
        width: 40%!important;
}
.showSingle .carousel-cell img {
        width: 150px;
        /* Đặt chiều rộng ảnh */
        height: 150px;
        /* Đặt chiều cao ảnh */
        border-radius: 50%;
        /* Làm tròn góc 50% để tạo hình tròn */
        object-fit: cover;
        /* Giúp ảnh không bị méo */
        overflow: hidden;
        border: 0px solid #000;
        /* Viền cho ảnh (tuỳ chọn) */
}
@media only screen and (max-width: 768px){
        .showSingle .carousel-cell {
                width: 49% !important;
        }
        .showSingle .carousel-cell img {
                aspect-ratio: 1/1;
        }
        .UISpecialistControl .item.col-6.col-sm-3.col-lg-2 {
                width: 100% !important;
                flex: none;
                margin: 0;
                margin-bottom: 10px;
        }
        .UISpecialistControl .Content {
                flex-direction: column;
                width: 100%;
        }
        .UISpecialistControl {
                width: 100vw;
                padding: 10px;
                margin-bottom: 20px;
        }
        .UIMedicalSpecialist {
                padding: 10px;
                width: 100vw;
        }
        .UIMedicalSpecialist .carousel:nth-child(2) {
                display: none;
        }
        .UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .carousel-cell .detail {
                flex-direction: column;
                display: flex;
                text-align: left;
        }
        .UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-info {
                padding: 20px;
                background: transparent;
        }
        .UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-avatar {
                width: 100%;
        }
        .UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .flickity-viewport {
                background: #ecf3f8;
        }
        .UIMedicalSpecialist .carousel.carousel-main.flickity-enabled:nth-child(1) .detail-avatar {
                flex: none;
        }
        .UIMedicalSchedule td {
                display: table-cell !important;
                overflow: auto;
        }
        .UIMedicalSchedule table {
                width: 100%;
                table-layout: fixed;
        }
        .UIMedicalSchedule.container-fluid.pt-2 {
                padding: 5px;
                width: 100vw;
        }
        .UIMedicalSchedule.container-fluid.pt-2 * {
                font-size: 13px;
        }
        .UIMedicalSchedule.container-fluid.pt-2 td {
                padding: 5px !important;
        }
}
