@media(max-width:1199px){
    h1{
        font-size: 38px;
        line-height: normal;
    }
    h2{
        font-size: 20px;
    }
    .left-wrapper {
        background: #004C7B;
        width: 150px;
    }
    .right-wrapper {
        width: calc(100% - 150px);
    }
    .Consultation-card {
        padding: 15px 10px 15px 10px;
        max-width: 100%;
    }
    .employee-entry {
        flex-direction: column-reverse;
        gap: 20px;
    }
    .table-section {
        overflow-x: auto;
    }
    .employee-entry-right {
        width: 100%;
    }
    .field.process-1 span {
        min-width: 200px;
    }
    .field.process-2 span {
        min-width: 150px;
    }
    .transation-card .field {
        padding-bottom: 15px;
        gap: 10px;
    }
    .card {
        padding: 10px;
    }
    .transation-card span {
        height: 30px;
    }
    .transation-record span.min-width {
        width: 220px;
    }
    .transation-record span {
        width: 40px;
        height: 30px;
    }
    .transation-card-main {
        padding: 25px 0px;
        flex-wrap: wrap;
        gap: 20px;
    }
    .Logs {
        overflow-x: auto;
    }
    .plan-section .col-sm-12 {
        padding-bottom: 20px;
    }
    .card-top-main {
        flex-wrap: wrap;
    }
    .card-bottom-main {
        flex-wrap: wrap;
    }
    .Transaction-section.card-4 {
        order: -1;
    }
  
}
@media(max-width:991px){
    h1{
        font-size: 32px;
    }
    h3{
        font-size: 17px;
    }
    .left-wrapper {
        background: #004C7B;
        width: 100px;
    }
    .right-wrapper {
        width: calc(100% - 100px);
    }
    .rewiew-form {
        flex-direction: column-reverse;
        gap: 15px;
    }
    .rewiew-form .field-set {
        width: 100%;
    }
    .add-more {
        width: 100%;
    }
    .account-tabing .nav-pills {
        gap: 20px;
    }
    .field-set {
        flex-direction: column;
    }
    .account-tabing .field label {
        min-width: 70px;
    }
    .account-tabing .btn {
        margin-top: 25px;
        margin-bottom: 25px;
    }
    .account-tabing form th, .account-tabing form td {
        border: 1px solid #fff;
    }
    .account-tabing {
        margin-top: 50px;
    }
    .btn a {
        padding: 8px;
        min-width: 150px;
    }
    .employee-entry-right img {
        max-width: 80px;
    }
    .add-more img{
        max-width: 30px;
    }
    .card.color-text.card-1, .card.card-2, .two-card.card-3{
        min-width: auto;
    }
  
}

@media(max-width:767px){
    a.logo img {
        max-width: 150px;
    }
    h1{
        font-size: 28px;
    }
    h2{

        font-size: 19px;
    }
    h3{
        font-size: 16px;
    }
    h2.orange-text {
        font-size: 18px;
    }
    .page-wrapper{
        flex-direction: column;
    }
    .left-wrapper {
        background: #004C7B;
        width: 100%;
        height: 40px;
    }
    .right-wrapper {
        width: 100%;
    }
    .right-wrapper-top, .Consultation-section .right-wrapper-top {
        padding: 0px 0px 10px 0px;
    }
    .Consultation-pic {
        margin-bottom: 20px;
        margin-top: 20px;
    }
    .Consultation-section {
        min-height: 100vh;
        padding-bottom: 25px;
    }
    header {
        padding: 15px 12px;
        text-align: center;
    }
    .right-wrapper .container{
        padding: 0px 12px;
    }
    .Employee-Review .btns.btn {
        gap: 15px;
        flex-wrap: wrap;
    }
    .rewiew-tabing .field-set.field {
        padding: 35px 0px;
    }
    .nav-pills .nav-link span IMG {
        MAX-WIDTH: 100%;
    }
    .nav-pills .nav-link span {
        min-width: 50px;
        min-height: 50px;
        width: 50px;
    }
    .rewiew-form input {
        padding: 8px 15px;
        color: #444444;
        font-weight: 700;
        height: 40px;
        font-size: 14px;
        border-radius: 8px;
    }
    .field-set .field, .field.width-half, .field-set .field.width-cus {
        width: 100%;
    }
    .Employee-Review h3 {
        font-size: 23px;
        font-weight: 900;
        margin-bottom: 15px;
        margin-top: 16px;
    }
    
    .account-tabing .field-set .field, .input-div .datetime{
        width: 100%;
    }
    .account-tabing .nav-pills .nav-link {
        border-radius: 8px;
        padding: 12px;
        min-width: 154px;
        width: 100%;
    }
    .account-tabing .nav-pills {
        gap: 15px;
    }
    .account-tabing {
        margin-top: 25px;
    }
    .btns.btn {
        display: flex;
        align-items: baseline;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }
    .Consultation-card-left img {
        max-width: 100%;
    }
    .table-section {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .employee-entry-right img {
        max-width: 55px;
    }
    .employee-entry-right .btn {
        margin-bottom: 12px;
    }
    .add-more img {
        max-width: 30px;
    }
    .table-section td:first-child, .table-section th:first-child a{
        min-width: 70px;
    }
    .field.process-1 span {
        min-width: 150px;
    }
    .field.process-2 span {
        min-width: 100px;
    }
    .field.process-3 span {
        min-width: 50px;
    }
    .transation-card span {
        height: 30px;
        min-width: 25px;
    }
    .transation-record .field {
        padding-bottom: 14px;
    }
    .logs-section {
        padding: 20px 0px;
    }
    .logs-section label {
        font-size: 18px;
    }
    span.price {
        font-size: 22px;
    }
    .plans-half span.alert {
        margin-bottom: 30px;
    }

    
}

@media(max-width:480px){
    .btns.btn a, .btn, .btn a{
        width: 100%;
    }
    .rewiew-tabing .field input {
        max-width: 100%;
    }
    li.nav-item {
        width: 25%;
    }
    .account-tabing li.nav-item{
        width: 100%;
    }
    .input-div {
        flex-wrap: wrap;
    }
    .transation-card label {
        max-width: 112px;
    }
}