/* 1px = 0.0625rem */
/* SCREEN RESOLUTION FOR HR58 PROJECT CREATED AT 20-04-2023 */

@media (min-width: 320px) {
    .toggle-nav {
        display: inline-block;
    }
    .search-hide-toggle {
        display: none;
    }
    /* mobile */
    .header-img-card-1 {
        margin-bottom: 1rem;
        /* width: 22.5rem; */
        width: 100%;
        /* height: 178px; */
    }
    .header-search-card {
        /* width: 46.5rem; */
        width: 100%;
    }

    .header-dashboard-img {
        position: relative;
        object-fit: cover;
        /* width: 23.2rem;*/
        height: 16.125rem;
        width: 100%;
        border-radius: 0px;
    }
    .header-user-img {
        position: absolute;
        width: 6.125rem;
        height: 6.125rem;
        left: 1rem;
        top: 1.1rem;

    }
    .contact-list-img {
        position: absolute;
        bottom: 3.5rem;
        left: 1rem;
        width: 22.2px;
        height: 17px;
    }

    .id-number-text {
        position: absolute;
        bottom: 3.5rem;
        left: 2.5rem;
        font-weight: 500;
        font-size: 14px;
        line-height: 16px;

    }
    .squire-list-img {
        position: absolute;
        bottom: 3.5rem;
        left: 7rem;
        width: 22.2px;
        height: 17px;
    }
    .visiting-card-text {
        position: absolute;
        bottom: 3.5rem;
        left: 8.5rem;
        font-weight: 500;
        font-size: 14px;
        line-height: 16px;
    }
    .fy-year-text {
        position: absolute;
        bottom: 5rem;
        left: 1rem;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
    }
    .header-name-text {
        position: absolute;
        bottom: 8rem;
        left: 1rem;
        font-weight: 600;
        font-size: 26px;
        line-height: 26px;
    }
    .header-designation-text {
        position: absolute;
        bottom: 6.5rem;
        left: 1rem;
        font-weight: 500;
        font-size: 17px;
        line-height: 16px;

    }
    .company-logo-img-1 {
        position: absolute;
        width: 8rem;
        height: 3.4rem;
        left: 10rem;
        top: 3.5rem;
    }
}

@media (min-width: 768px) {

    .search-hide-toggle {
        display: inline-block;
    }

    /* tablets */
    .header-img-card-1 {
        /* width: 46.5rem; */
        width: 100%;
        /* height: 11.125rem; */
    }

    .header-dashboard-img {
        position: relative;
        object-fit: cover;
        /* width: 46.5rem;
        height: 11.125rem; */
        width: 100%;
        border-radius: 6px;
    }

    .header-search-card {
        /* width: 46.5rem; */
        width: 100%;
    }

    .company-dropdown-text {
        font-weight: 600;
        border-radius: 8px;
        background-color: #fff;
        border: 2.5px solid #D4D4D4;
        position: relative;
        bottom: 14rem;
        right: 1rem;
    }

    .company-logo-img-1 {
        position: absolute;
        width: 10rem;
        height: 4rem;
        left: 28rem;
        top: 6.5rem;
    }

    .header-user-img {
        position: absolute;
        width: 10.125rem;
        height: 10.125rem;
        left: 1rem;
        top: 2.5rem;

    }

    .contact-list-img {
        position: absolute;
        bottom: 8rem;
        left: 12rem;
        width: 24.2px;
        height: 20px;
    }

    .id-number-text {
        position: absolute;
        bottom: 8rem;
        left: 14rem;
        font-weight: 500;
        font-size: 16px;
        line-height: 16px;

    }

    .squire-list-img {
        position: absolute;
        bottom: 8rem;
        left: 19.5rem;
        width: 24.2px;
        height: 20px;
    }

    .visiting-card-text {
        position: absolute;
        bottom: 8rem;
        left: 21.5rem;
        font-weight: 500;
        font-size: 16px;
        line-height: 16px;
    }


    .header-name-text {
        position: absolute;
        bottom: 13.4rem;
        left: 11.8rem;
        font-weight: 700;
        font-size: 30px;
        line-height: 30px;
    }

    .header-designation-text {
        position: absolute;
        bottom: 11.5rem;
        left: 12rem;
        font-weight: 500;
        font-size: 18px;
        line-height: 16px;

    }

    .fy-year-text {
        position: absolute;
        bottom: 10rem;
        left: 12rem;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
    }



    .content .card-size-1 {
        height: 17.625rem;
    }

    .content .card-size-2 {
        height: 17.625rem;
    }

    .content .card-size-3 {
        height: 17.625rem;
    }

    .content .card-size-5 {
        /* width: 18.3544rem; */
        height: 17.625rem;
    }



}

@media (min-width: 992px) {

    .toggle-nav {
        display: none;
    }

    .search-hide-toggle {
        display: inline-block;
    }

    .header-dashboard-img {
        position: relative;
        object-fit: cover;
        /* width: 91rem;
        height: 11.125rem; */
        width: 100%;
        border-radius: 6px;
    }

    .header-img-card-1 {
        /* width: 111rem; */
        margin-bottom: 0;
        width: 100%;
        /* height: 11.125rem; */
    }

    .header-search-card {
        /* width: 113.4rem; */
        width: 100%;
    }

    .content .card-size-1 {
        /* width: 18.3544rem; */
        height: 17.625rem;
    }

    .content .card-size-4 {
        /* width: 18.3544rem; */
        height: 17.625rem;
    }

    .content .card-size-5 {
        /* width: 18.3544rem; */
        height: 17.625rem;
    }

    .company-dropdown-text {
        font-weight: 600;
        border-radius: 8px;
        background-color: #fff;
        border: 2.5px solid #D4D4D4;
        position: relative;
        bottom: 9rem;
        right: 1rem;
    }


    .header-dashboard-img {
        position: relative;
        object-fit: cover;
        /* width: 113.5rem;*/
        height: 11.125rem;
        width: 100%;
        border-radius: 6px;
    }

    .header-user-img {
        position: absolute;
        width: 9.125rem;
        height: 9.125rem;
        left: 2rem;
        top: 1.1rem;

    }

    .contact-list-img {
        position: absolute;
        bottom: 6rem;
        left: 12rem;
        width: 24.2px;
        height: 20px;
    }

    .id-number-text {
        position: absolute;
        bottom: 6rem;
        left: 14rem;
        font-weight: 500;
        font-size: 16px;
        line-height: 16px;

    }

    .squire-list-img {
        position: absolute;
        bottom: 6rem;
        left: 19.5rem;
        width: 24.2px;
        height: 20px;
    }

    .visiting-card-text {
        position: absolute;
        bottom: 6rem;
        left: 21.5rem;
        font-weight: 500;
        font-size: 16px;
        line-height: 16px;
    }

    .fy-year-text {
        position: absolute;
        bottom: 7.5rem;
        left: 12rem;
        font-weight: 500;
        font-size: 13px;
        line-height: 15px;
        color: #102D4F;
    }


    .header-name-text {
        position: absolute;
        bottom: 10rem;
        left: 12rem;
        font-weight: 700;
        font-size: 30px;
        line-height: 30px;
    }

    .header-designation-text {
        position: absolute;
        bottom: 8.8rem;
        left: 12rem;
        font-weight: 500;
        font-size: 18px;
        line-height: 16px;

    }

    .company-logo-img-1 {
        position: absolute;
        width: 12rem;
        height: 5rem;
        left: 31rem;
        top: 3.5rem;
    }

    .btn-round {
        position: relative;
        display: inline-block;
        width: 1.37rem;
        height: 1.37rem;
        border-radius: 50%;
        border: none;
        margin-right: 3.925rem;
    }

    .btn-round i {
        font-style: normal;
        font-weight: bold;
        width: 30px;
        height: 30px;
    }


}

@media (min-width: 1200px) {
    /* body {
        font-size: 18px;
      } */
    .header-dashboard-img {
        position: relative;
        object-fit: cover;
        width: 100%;
        /* width: 91rem;
        height: 11.125rem; */
        border-radius: 6px;
    }

    .header-img-card-1 {
        /* width: 111rem; */
        /* height: 11.125rem; */
        margin-bottom: 0;
        width: 100%;
    }

    .header-search-card {
        /* width: 113.4rem; */
        width: 100%;
    }

    .company-logo-img-1 {
        position: absolute;
        width: 12rem;
        height: 5rem;
        left: 52rem;
        top: 3.5rem;
    }
}