* {
    margin: 0;
    padding: 0;
    font-size: 100%;
    outline: none;
    text-decoration: none;
    list-style: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'cairo', "Verdana", Helvetica, "Noto Sans", sans-serif, Arial, sans-serif;
}

body,html {width: 100%;}
body {background: #fff;font-family: 'cairo',"Verdana", Helvetica, "Noto Sans", sans-serif, Arial, sans-serif;font-size: 14px;line-height: 1.42857143;color: #333;/*! padding-top: 5.9rem; */position: relative;}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.nav-img{width: 250px;}
footer{padding: 20px;/*position: absolute;*//*! bottom: 0; */width: 100%;margin-top: 30px;font-size: 12px;background: #d9e9f8;}
.form-control::placeholder {color: #cad1d7;}

#submitMsg .modal-confirm {color: #636363;font-size: 14px;}
#submitMsg .modal-confirm .modal-body {padding: 5px 15px 5px;font-size: 15px;color: #2b2b2b;}
#submitMsg .modal-confirm .modal-content {padding: 11px;border-radius: 5px;border: none;}
#submitMsg .modal-confirm .modal-header {border-bottom: none;position: relative;}
#submitMsg .modal-confirm h4 {text-align: center;font-size: 18px;margin: 10px 0 -7px;}
#submitMsg .modal-confirm h4 i{font-size: 25px;}
#submitMsg .modal-confirm .form-control,#ChangeSeqModal .modal-confirm .btn{min-height: 28px;border-radius: 3px;}
#submitMsg .modal-confirm .close{position: absolute;top: -5px;right: -5px;}
#submitMsg .modal-confirm .modal-footer{border: none;text-align: center;border-radius: 5px;font-size: 13px;padding: 5px;display: block;}
#submitMsg .modal-confirm.modal-dialog/*, .modal-confirm.modal-dialog*/
{margin-top: 14%;}
#submitMsg .modal-confirm .icon-box{color: #fff;position: absolute;margin: 0 auto;left: 0;right: 0;top: -47px;width: 65px;height: 65px;border-radius: 50%;z-index: 9;padding: 15px;text-align: center;box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);background: #214970;background: -webkit-gradient(linear, left bottom, left top, from(#214970), to(#337ab7));background: linear-gradient(to top, #349510 0%, #42cf10 100%);filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#337ab7', endColorstr='#214970', GradientType=0);}
#submitMsg .modal-confirm .icon-box i{font-size: 30px;position: relative;top: 3px;}

#submitMsg .modal-confirm .btn {border-radius: 4px;text-decoration: none;transition: all 0.4s;line-height: normal;border: none;padding: 5px 10px;}
#submitMsg .modal-confirm .btn:hover,#ChangeSeqModal .modal-confirm .btn:focus{outline: none;}
.patient-info{/*! background: #555; */border: 1px solid #e0d7d752;padding: 20px 15px;margin: 0px auto 27px;}


#tableAction .modal-confirm .icon-box{color: #fff;position: absolute;margin: 0 auto;left: 0;right: 0;top: -35px;width: 65px;height: 65px;border-radius: 50%;z-index: 9;padding: 15px;text-align: center;box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);background: #214970;background: -webkit-gradient(linear, left bottom, left top, from(#214970), to(#337ab7));background: linear-gradient(to top, #349510 0%, #42cf10 100%);filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#337ab7', endColorstr='#214970', GradientType=0);}
#tableAction .modal-confirm .icon-box i{font-size: 30px;position: relative;top: 3px;}

.info-item{margin-bottom: 5px;}
.info-title{color: #888;font-size: 12px;}
.info-title i{font-size: 11px;}
.info-data{font-size: 13px;font-weight: 600;/*! color: #094982; */}
fieldset.scheduler-border {border: solid 1px #b7d2ee !important;padding: 10px 15px 6px;margin-bottom: 15px;border-radius: 3px;}

.site-name h2 {
    font-size: 27px;
}

main {min-height: calc(100vh - 90px);}

.bg-light .col-md-2 img {
    width:170px;
}

.bg-light {
    background-image: url(../css/images/banner2-2.jpg);
    padding: 12px 0;
    background-repeat: no-repeat;
    background-size: cover;
    justify-content: space-between;
    flex-wrap: wrap;
}
.h2,h2 {font-size: 1.5rem;}
.jumbotron {background-color: #e9ecefb3; /*margin-top: 18vh;*/}
.jumbotron h1{margin-bottom: 60px;}

html {scroll-behavior: smooth;}
table .btn {padding: 3px 9px;font-size: 12px;}
.table td,.table th {padding: .35rem;}
.btn-custom-info {
    color: #17a2b8 !important;
    background-color: #fff !important;
    border-color: #c7c7c7 !important;
}
.error{color:red !important;}
.btn-custom-light {
    color: #000;
    background-color: #fff;
    border-color: #fff;
}
/**custom pagination style**/
  ul.pagination {
      margin-top: 7px;
  }

  ul.pagination li {
      display: inline-block;
  }

 ul.pagination li a {
     color: black;
     float: left;
     padding: 10px 16px;
     text-decoration: none;
     transition: background-color .3s;
     border: 1px solid #ddd;
 }

 ul.pagination li.active {
     background-color: #17a2b8;
     color: white;
 }

ul.pagination li a:hover:not(.active) {
    background-color: #ddd;
}
.default-color {
    color: #17a2b8 !important;
}
button:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}

.custom-bg-info{
    background: #0da2d3 !important;
}
.navbar-light .navbar-nav .nav-link{
    color:#fff !important;
    cursor: pointer;
}
.navbar-light .navbar-nav .dropdown-menu .nav-link{
    color:#000 !important;
}











 .navbar-nav {
            margin-right: 0px !important;
        }
        #footer .container-fluid {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        #footer {
            text-align: center;
        }
            #footer .container-fluid .images {
                margin-left: 250px;
            }
        @media (max-width: 1200px) and (min-width: 991px) {
            #footer .container-fluid .images {
                margin-left: 150px;
            }  
        }
        @media (max-width: 768px) {
            #footer .container-fluid .images {
                margin-left: 0px;
            }
            #footer .container-fluid {
                display: block;
            }
        }























.navbar-nav li a:hover:not(.active) {
    background-color: #ddd;
    color:#000 !important;
}
/*************Rate****************/
.rating {
    border: none;
    /*margin-right: 49px*/
}

.myratings {
    font-size: 30px;
    color: darkgray;
}

.rating > [id^="star"] {
    display: none
}

.rating > label:before {
    margin: 5px;
    font-size: 2.25em;
    font-family: FontAwesome;
    display: inline-block;
    content: "\2605"
}

.rating > .half:before {
    content: "\f089";
    position: absolute
}

.rating > label {
    color: #ddd;
    /*float: right*/
}

.card-body h4 {
    font-size: 100%;
}
form {
    width: 100%;
}

.rating > [id^="star"]:checked ~ label,
.rating:not(:checked) > label:hover,
.rating:not(:checked) > label:hover ~ label {
    color: #FFD700
}

 .rating > [id^="star"]:checked + label:hover,
 .rating > [id^="star"]:checked ~ label:hover,
 .rating > label:hover ~ [id^="star"]:checked ~ label,
 .rating > [id^="star"]:checked ~ label:hover ~ label {
     color: #FFED85
 }

.reset-option {
    display: none
}

.reset-button {
    margin: 6px 12px;
    background-color: rgb(255, 255, 255);
    text-transform: uppercase
}

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

fieldset.rating:disabled {
    cursor: not-allowed;
    pointer-events: all !important;
}
/*.card-rate {
    position: relative;
    display: flex;
    width: 350px;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid #d2d2dc;
    border-radius: 11px;
    -webkit-box-shadow: 0px 0px 5px 0px rgb(249, 249, 250);
    -moz-box-shadow: 0px 0px 5px 0px rgba(212, 182, 212, 1);
    box-shadow: 0px 0px 5px 0px rgb(161, 163, 164)
}*/

.card-rate .card-body {
    padding: 1rem 1rem
}

.card-body {
    flex: 1 1 auto;
    padding: 1.25rem
}

.load {
    display: none;
    position: fixed;
    z-index: 1100;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba( 255, 255, 255, .8 ) url(dms-loader.gif) 50% 50% no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;
}

 /* Anytime the body has the loading class, our
 modal element will be visible */
  body.loading .load {
      display: block;
  }

/*******************************/
@media (max-width:480px) {
    .w-25 {
        width: 50% !important;
    }
}
@media(max-width: 600px) and (min-width: 200px) {
    .card-columns {
        display: block !important;
    }
}

@media(max-width: 800px) and (min-width: 200px) {
    .td-rate {
        display: inline-flex !important;
    }
}

@media(max-width: 450px) and (min-width: 300px) {
    input#PROCEDURENAME {
        width: 280px !important;
    }
}
@media(min-width: 460px) {
    input#PROCEDURENAME {
        width: 209px !important;
    }
}

.container {
    float: unset !important;
}