﻿/*@media (min-width: 1200px) {
    .tbl_incident thead th {
        background: #ddd !important;
        padding: 1.3rem !important;
        color: #B0B0B0;
        text-align: center;
        position: sticky;
        top: -1px;
        font-size: 1.2rem;
    }
}
*/
@media screen and (min-width: 200px) and (max-width: 319px) {
    .col-pad {
        width: 100% !important;
        padding: 1rem 1rem !important;
    }
    .Header_Bg {
        border-radius: 0.6rem !important;
        margin-bottom: -1.7rem !important;
    }
    .SitepatrollingForm {
        width: 100%;
        padding: 0.8rem;
        column-gap: 1rem;
        display: block;
    }
        .navbar {
        left: 1% !important;
        position: relative;
        top: 0;
        margin-bottom: 4px !important;
        width: 100%;
        padding: 0px 10px;
    }
    .vdivide .vertical:not(:last-child):after {
        display: none !important;
    }
    .cards {
        display: block;
        column-gap: 0.5rem !important;
        flex-wrap: wrap;
    }
    .well1 {
        /* padding: 6px 4px 8px 4px; */
        height: 100%;
    }
    .navbar > .container, .navbar > .container-fluid {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: end;
    }
    .login-container {
        display: inherit;
    }
    .heading img{
        width:100%;
    }


    }
    @media screen and (min-width: 320px) and (max-width: 768px) {
        .SitepatrollingForm {
            width: 100%;
          
            display: block !important;
            justify-content: center !important;
        }
        .viewContentModal label {
            word-break: break-all;
            font-size: 1rem;
        }
        .well1 {
            height: 100%;
            padding: 8px 8px 7px 26px;
            margin-bottom: 0.4rem !important;
        }

        .SelDdWidth {
            width: 100%;
        }
        /*  #select2-data-1-5mxq {
        width: 100% !important;
    }*/
        .Card_Pading {
            padding: 0px;
        }

        .select2-container--default {
            width: 100% !important;
        }
        .Header_Bg {
            border-radius: 0.6rem !important;
            margin-bottom: -1.7rem !important;
        }
            .cards {
            display: block;
            column-gap: 0.5rem !important;
            flex-wrap: wrap;
        }

        .col-pad {
            width: 100% !important;
            padding: 5px !important;
        }

        .sel_pad select {
            height: calc(2.25 rem + 2 px );
            margin-bottom: 1rem;
        }

        .DashboardDD {
            display: block;
            justify-content: center;
        }

        .login-form-1 .heading {
            top: 0rem !important;
        }

        .navbar {
            /* min-height: 50px; */
            top: 8px;
            z-index: 99;
            left: 0rem !important;
            box-shadow: rgb(0 0 0 / 20%) 0px 0px 4px 0px, rgb(0 0 0 / 19%) 0px 9px 30px -18px !important;
            width: 100% !important;
            right: 0% !important;
            margin-bottom: 11px !important;
            height: auto !important;
            border: 1px solid transparent;
        }

        .navbar-header {
            display: block;
            padding: 2rem 0rem;
        }

        .login-form-1 {
            height: auto;
        }
        .heading img {
            width: 100%;
        }
        .row1 .verticalline:not(:last-child):after {
          
            display: none;
          
        }
        .Header_right {
            position: absolute;
            right: 0%;
            z-index: 99;
            top: -4rem;
        }

        .navbar-fixed-left .dropdown .dropdown-menu {
            left: 0%;
        }

        .Card_h {
            width: 100%;
            display: block;
            align-items: stretch;
            justify-content: space-around;
        }

        .modal-dialog {
            min-width: 270px;
            max-width: 280px;
            max-height: 503px;
            overflow: auto;
        }

        .navbar-inverse .navbar-toggle {
            border-color: #333;
            background-color: #E4002B !important;
        }

        .Header_right {
            display: none;
        }

        .navbar-collapse {
            padding-right: 15px;
            height: 100vh;
        }

        #mytab {
            padding: 0rem 0.7rem;
        }

        .LeaveForm {
            display: block !important;
            justify-content: center !important;
        }

        .sbmt_btn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            font-size: 1rem;
            width: 100%;
            margin: 1rem 0rem;
            padding: 0.8rem 2rem;
            outline: none;
            border: none;
            color: white;
        }

        .RightFlexContent {
            display: block;
            column-gap: 10px;
        }


        .SiteInspectionForm {
            display: block;
            justify-content: center !important;
        }
    }

    @media screen and (min-width: 769px) and (max-width: 1000px) {
        .RespTable {
            display: block !important;
        }

        .RespSecondrowTbl {
            display: none !important;
        }

        .RespAttendanceTbl {
            display: none !important;
        }

        .RespGrid {
            display: grid;
            width: 100%;
        }

        .ResWidth {
            width: 100%;
            max-width: 972px;
        }

        .content {
            display: table-cell;
            align-items: baseline;
        }

        .Firstcardsrow {
            width: 100%;
            display: table !important;
            justify-content: center;
        }

        .Card_h {
            width: 100%;
            display: table;
            align-items: stretch;
            justify-content: space-around;
        }

        .DashboardDD {
            display: block !important;
        }

        .sel_pad .form-group {
            width: 100%;
        }

        .sbmt_btn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.7rem;
            padding: 0.3rem 2rem;
        }

        .c-input--flatpickr {
            background-image: url(../images/calendar-icon.png) !important;
            background-position: 96% 50% !important;
            background-size: 24px !important;
            background-repeat: no-repeat !important;
            padding: 0.7rem 1rem !important;
            font-size: 0.6rem !important;
            height: 25px !important;
        }

        .form_select {
            padding: 0% 5% !important;
            border: 1px solid #ccc !important;
            color: #555;
            height: 34px;
            font-size: 0.7rem !important;
        }

        .cardheading h5 {
            font-weight: 600;
            font-size: 0.9rem;
            color: #e4002b;
        }

        .contractText {
            display: inline-block;
            font-size: 0.8rem;
            font-weight: 600;
        }

        .Leavecardarea {
            display: flex;
            justify-content: space-between;
            padding: 0.4rem 0rem;
        }

        .MpImg {
            width: 2rem;
        }

        .Header_text {
            /* margin: 0; */
            font-size: 1.3rem !important;
            font-weight: 600;
        }
    }

    @media screen and (min-width:1002px) and (max-width: 1200px) {
        .form-group {
          
            margin-bottom: 0px !important;
        }

        .RespTable {
            display: block !important;
        }

        .RespSecondrowTbl {
            display: none !important;
        }

        .RespAttendanceTbl {
            display: none !important;
        }

        .RespGrid {
            display: grid;
            width: 100%;
        }

        .ResWidth {
            width: 100%;
            max-width: 972px;
        }
    }







    @media (max-width: 768px) {
        .dropdown-right {
            text-align: inherit;
        }

        .BroadCastView {
            display: block;
            column-gap: 6px;
            height: auto;
            padding: 0rem 0.6rem 0rem 0rem !important;
        }

        .RespTable {
            display: block !important;
        }

        .RespSecondrowTbl {
            display: none !important;
        }

        .RespAttendanceTbl {
            display: none !important;
        }

        .RespGrid {
            display: grid;
            width: 100%;
        }

        .ResWidth {
            width: 100%;
            max-width: 972px;
        }

        .content {
            display: table-cell;
            align-items: baseline;
        }

        #sidebar {
            min-width: 70px;
            max-width: 70px;
            text-align: center;
            margin-left: -90px !important;
        }

        .navbar {
            display: block !important;
        }

        #sidebar.active {
            min-width: 205px;
            max-width: 400px;
            margin-left: 0 !important;
        }



        #sidebar .sidebar-header h3,
        #sidebar .CTAs {
            display: none;
        }

        #sidebar .sidebar-header strong {
            display: block;
        }

        #sidebar ul li a {
            padding: 20px 10px;
        }

            #sidebar ul li a span {
                font-size: 0.85em;
            }

            #sidebar ul li a i {
                margin-right: 0;
                display: block;
            }

        #sidebar ul ul a {
            padding: 10px !important;
        }

        #sidebar ul li a i {
            font-size: 1.3rem !important;
            display: inline !important;
        }

        #sidebar {
            margin-left: 0;
        }

        #sidebarCollapse span {
            display: none;
        }

        .imgRes {
            display: block;
        }

        .Nav-h {
            padding: 0rem;
            height: 100vh;
        }

        .select2 {
            width: 100% !important;
        }

        .SearchDD form .form-group {
            /* width: 100%; */
            margin-bottom: 6px !important;
        }

        .LeaveSbmtBtn {
            width: 100%;
        }

        .AttendanceLog_Formpad {
            padding: 0 !important;
        }

        .nav_logout {
            display: none;
        }

        .SiteInspectionManageForm .form-group {
            margin-bottom: 8px !important;
        }

        .ClientColor {
            display: none;
        }

        .searchBar input[type="text"] {
            border: none;
            padding: 0.5rem 0.6rem 0.5rem 2.4rem !important;
            width: 100%;
            background-image: url(../images/iconsearch.png) !important;
            background-repeat: no-repeat;
            outline: 0;
            background-position: 9px;
            background-size: 10px;
        }
    }


    @media screen and (min-width: 320px) and (max-width: 425px) {
        .well1 {
            height: 100%;
            padding: 8px 8px 7px 26px;
            margin-bottom: 2.4vw !important;
        }

        .Header_Bg {
            border-radius: -6.4vw !important;
            margin-bottom: -4.5vw !important;
        }

        .Searchbutton {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 10rem;
            padding: 0rem 1.2rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        #ViewAll {
            font-size: 1.1rem;
            margin-bottom: 0px;
            font-weight: 600;
            color: #e4002b;
            text-decoration: underline;
            margin-bottom: 0px;
            white-space: nowrap;
            font-weight: 600;
            color: #e4002b;
            text-decoration: underline;
        }

        .search_form {
            display: flex;
            /* justify-content: flex-start; */
            align-items: center;
            column-gap: 6px;
        }

        .DownloadImages {
            width: 100%;
        }
        .Tourviewdiv {
            padding: 0.5rem 1rem;
           
        }
        .SectionBg {
            /* min-height: 84.5vh !important; */
            height: auto;
        }
            .AddNewBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 3rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            font-size: 1.1rem;
            border: none;
            color: white;
        }

        .Respmargin {
            margin-bottom: 0.5rem;
        }

        .DownloadIcon {
            justify-content: flex-start;
        }

        .AttendancePad .form-group {
            margin: 0px !important;
        }

        .AttendanceLogSbmt_Btn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            /* width: 100%; */
            outline: none !important;
            font-size: 1.2rem;
            border: none;
            color: white;
        }

        #AttendanceLogValid .text-center {
            margin-bottom: 0.6rem;
            padding: 1rem;
        }

        .round_img {
            border-radius: 50rem !important;
            width: 50%;
            /* justify-content: center; */
            display: block;
            margin: 0 auto;
        }

        .LeaveLogLeftContent .nav {
            flex-wrap: nowrap !important;
        }

        .RespPad {
            padding: 1rem 2rem;
        }

        .no_wrap {
            flex-wrap: nowrap !important;
        }

        .SiteInspectionReport {
            width: 100%;
            padding: 0.8rem;
            display: block !important;
            justify-content: center !important;
        }
        .Res-pad {
            padding:0px !important;
        }

        .SearchDD form .form-group {
            margin-bottom: 6px !important;
        }

        .modal-body {
            /* position: relative; */

            max-height: 470px;
            overflow-y: auto;
        }

        .AssigntblScrol {
            max-height: 274px;
            overflow-y: auto !important;
        }

        .SiteInspReptSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            width: 100%;
            color: white;
        }

        .SearchDD .form-group {
            margin-bottom: 6px;
        }

        #SiteInspManageSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            font-size: 1rem;
            width: 100%;
            color: white;
        }

        .SiteInspectionManageForm .form-group {
            margin-bottom: 6px !important;
        }

        #datepicker {
            font-size: 1rem;
        }

        .SiteInspectionManageForm {
            width: auto !important;
            max-height: initial !important;
            height: 100% !important;
        }

        .SiteInspectionForm {
            width: auto !important;
            max-height: initial !important;
            height: 100% !important;
        }

        .SearchDD .form-group {
            margin-bottom: 6px !important;
        }

        #SiteInspSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            width: 100%;
            font-size: 1rem;
        }

        .AddNewSchedBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        #ViewAllTblContent {
            font-size: 1rem !important;
        }

        #SiteInspNewSchdSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            margin: 0 auto;
            font-size: 1rem;
        }

        .SiteInspchecklistSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        #AssignmentStatusMsg {
            padding: 0.5rem 0rem;
            font-size: 1.2rem;
            color: #e4002b;
            text-align: left;
        }

        .modal-btn {
            /*display: flex;*/
            column-gap: 10px;
        }
        .ResPad-0{
            padding:0px;
        }
        .ReptSbmt {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 1rem 2rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
            margin: 0 auto;
        }

        #QrcodeStatusMsg {
            font-size: 1rem;
            color: #e4002b;
            font-weight: 700;
        }

        #FormValidationModalValidate button {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box !important;
            border-radius: 0.6rem !important;
            padding: 0.6rem 3rem !important;
            outline: none !important;
            font-size: 1rem !important;
            margin: 0 auto !important;
        }

        .modal-title {
            font-size: 1.2rem !important;
        }

        #hidden-print1 {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            margin: 0 23%;
            font-size: 1rem;
        }

        #imagesList {
            display: block !important;
        }

        #EmployeeStatusMsg {
            font-size: 1.2rem;
            text-align: initial;
            padding: 0.6rem 0rem;
            color: #e4002b;
            font-weight: 700;
        }

        #FormValidationModal .modal-text h6 {
            font-size: 1.2rem;
            line-height: 1.6;
        }

        .modal-text {
            margin: 0px !important;
            font-size: 1rem;
        }

        .viewContentModal {
            flex-wrap: nowrap !important;
        }

        .Nav-h {
            padding: 0.2rem 0.2rem;
            height: 100vh;
        }

        .Modal_Scroll .row {
            display: block;
        }
        .Center_btns {
            
            text-align: center;
        }
            .center_modal {
            position: absolute !important;
            top: 46%;
            z-index: 999999;
            left: 50%;
            transform: translate(-55%, -50%) !important;
        }

        .SelDdWidth {
            width: 100%;
        }

        .ResponsiveBtn {
            margin: 0 auto !important;
            display: block !important;
        }

        .Cancel_Btn {
            background: #101010 !important;
            color: white;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            margin: 0 auto;
            font-size: 1rem;
        }

        .Delete_btn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box !important;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            margin: 0 auto;
            font-size: 1rem;
        }

        .ResimgWidth {
            width: 35% !important;
            margin: 0 auto;
        }

        .modal-img .QRCode_img {
            display: block;
            /* margin: 0 auto; */
            width: 90% !important;
        }

        .modal-img .DeletePop_Img {
            display: block;
            margin: 0 auto;
            width: 21% !important;
        }

        #LeaveStatusMsg {
            top: 25%;
            position: absolute;
            right: 63%;
            font-size: 1rem;
            color: #f34768;
            font-weight: 700;
        }

        .Back_Search {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 37rem;
            padding: 0.6rem 2rem !important;
            outline: none;
            font-size: 1rem !important;
        }

        .LeaveSearch {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 37rem;
            padding: 0.6rem 2rem;
            outline: none;
            /* display: flex; */
            font-size: 1rem;
            border: none;
            color: white;
        }

        #FormValidationModal button {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box !important;
            border-radius: 0.6rem;
            padding: 0.6rem 3rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        .modal-header {
            padding: 6px 7px !important;
        }

            .modal-header .addsitecancel {
                color: white;
                border-radius: 50%;
                width: 20px !important;
                height: 20px !important;
                margin-top: -3px !important;
            }

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

        .respTextHidn {
            display: none;
        }

        #Update_info button {
            margin: 0 auto;
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box !important;
            border-radius: 0.6rem;
            padding: 0.6rem 3rem;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        .modal-header .close {
            margin-right: 0rem;
            color: white;
            border-radius: 50%;
            width: 20px !important;
            height: 20px !important;
            opacity: 1;
            outline: none;
            margin-top: -3px !important;
            text-align: center;
            padding: 0px !important;
        }

        .newschedmodal {
            color: white;
            border-radius: 50%;
            width: 20px;
            font-weight: 700;
            cursor: pointer !important;
            line-height: 1;
            height: 20px;
            opacity: 1;
            outline: none;
            margin-top: -5px;
            text-align: center;
            padding: 0px !important;
        }

        .RespDate {
            background-image: none !important;
        }
    }


    @media screen and (min-width: 427px) and (max-width: 580px) {
        .SiteInspectionManageForm {
            height: auto !important;
            margin: 0px !important;
        }

        .Header_Bg {
            border-radius: 0.6vw !important;
            margin-bottom: -2.5vw !important;
        }

        #SiteInspManageSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.6rem;
            padding: 0.6rem 2rem;
            width: 100%;
            outline: none !important;
            font-size: 1rem;
            border: none;
            color: white;
        }

        .no_wrap {
            flex-wrap: nowrap !important;
        }

        .DownloadIcon {
            justify-content: start;
        }
    }

    @media screen and (min-width: 2000px) and (max-width: 3000px) /*(67%)*/ {
        .Nav-h {
            height: 98vh;
        }

        .SectionBg {
            height: auto;
        }

        .LeaveLogLeftContent {
            height: auto;
        }

        #TblContentManageChecklist {
            height: auto;
        }

        .dataTables_scrollHeadInner {
            width: 100% !important;
        }
    }

    @media screen and (min-width: 3001px) and (max-width: 6000px) /*(50,35,25%)*/ {
        .Nav-h {
            /*   height: auto !important;*/
            height: 98vh;
        }

        .SectionBg {
            height: auto;
        }

        .LeaveLogLeftContent {
            height: auto;
        }

        #TblContentManageChecklist {
            height: auto;
        }

        .dataTables_scrollHeadInner {
            width: 100% !important;
        }
    }

    @media screen and (min-width: 1440px) and (max-width: 2000px) /*(75%)*/ {
        .Nav-h {
            height: 98vh;
        }

        .SectionBg {
            height: auto;
        }

        .LeaveLogLeftContent {
            height: auto;
        }

        #TblContentManageChecklist {
            height: auto;
        }

        .dataTables_scrollHeadInner {
            width: 100% !important;
        }
    }

    @media screen and (min-width:1002px) and (max-width: 1200px) /* (125%)*/ {
        #sidebar {
            display: none;
        }
            #sidebar ul li a img {
                width: 100%;
            }

            #sidebar ul li a span {
                display: flex;
                column-gap: 1rem;
                align-items: baseline;
            }

            #sidebar.active ul li a i {
                margin-right: 0;
                display: block;
                font-size: inherit;
                margin-bottom: 4px;
            }
        .navbar {
            position: relative;
            min-height: 50px;
            margin-bottom: 8px;
            border: 1px solid transparent;
            left: 0% !important;
            position: relative;
            top: 5px;
            width: 100%;
            border-radius: 0.6vw !important;
        }
        .navbar {
            display: block !important;
        }
        .col-pad {
            width: calc(100% - 4px) !important;
        }
        .navbar > .container, .navbar > .container-fluid {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: justify;
            justify-content: end;
        }
        .navbar {
            position: relative;
            min-height: 50px;
            margin-bottom: 9px !important;
        }
            .select2-container {
            min-width: 110px !important;
            margin-right: 5px !important;
        }
        .DashboardDD .form-group{
            width:auto;
        }
        .DashboardDD {
            display: flex;
            flex-wrap: nowrap;
            justify-content: center;
        }
            #AssignmentStatusMsg {
            font-size: 1.5rem;
            margin: 0px;
        }

        .ClientColor {
            font-size: 1.2rem;
        }

        .tblrow > tbody > tr > td {
            border-top: none !important;
            white-space: nowrap;
            font-size: 1rem;
            vertical-align: middle !important;
            padding: 0.4rem !important;
            height: 28px;
            text-align: center;
        }
        .InspCard {
            flex: 0 1 16.6% !important;
        }
        .table thead th {
            vertical-align: baseline;
            border-bottom: 0px !important;
            color: #000;
            font-size: 1.1rem;
        }
        .SelDdWidth {
            width: 13rem !important;
            margin-bottom: 0px !important;
        }
        .CardImg .card-category {
            font-weight: 600 !important;
            font-size: 0.8rem !important;
        }
        .CardImg div p {
            white-space: inherit !important;
        }
        .card-content p {
            font-size: 0.8rem;
        }
        .card-category {
            font-weight: 600;
            font-size: 0.8rem;
        }
        #sidebar.active {
            min-width: 205px;
            max-width: 400px;
            display: block !important;
            margin-left: 0 !important;
        }
            .CardBtn button {
            font-size: 0.7rem !important;
            padding: 0.4rem 0rem !important;
        }
        .SiteHeadings h6 {
            margin: 0px;
            font-size: 1rem !important;
        }
        .pagination-sm > li > a, .pagination-sm > li > span {
            padding: 0.3rem 1.4rem !important;
            font-size: 12px;
            color: #000000;
        }
    }

    @media screen and (min-width:1200px) and (max-width: 1500px) /* (110%)*/ {
        .tblrow > tbody > tr > td {
            border-top: none !important;
            white-space: nowrap;
            font-size: 1.1rem;
            vertical-align: middle !important;
            padding: 0.6rem !important;
            height: 36px;
            text-align: center;
        }

        table.dataTable thead th, table.dataTable thead td {
            padding: 6px !important;
        }

        .SectionBg {
            /* min-height: 84.5vh !important; */

            padding: 13px 4px 0px 4px;
            margin-bottom: 0.4vw !important;
            background-color: white;
            border: 1px solid #e3e3e3;
            border-radius: 0.6rem !important;
            box-shadow: rgb(0 0 0 / 20%) 0px 0px 4px 0px, rgb(0 0 0 / 19%) 0px 9px 30px -18px !important;
        }
    }

    @media screen and (min-width:769px) and (max-width: 980px) /* (125%)*/ {
        #sidebar {
            display: none;
        }
          
        .navbar {
            display: block !important;
        }
        .CardImg div p {
            white-space: inherit !important;
        }
        .col-pad {
            width: calc(100% - 4px) !important;
            position: absolute !important;
            top: 0;
            right: 0;
            padding: 5px 6px 0px 0px !important;
        }

        .navbar {
            position: relative;
            min-height: 50px;
            margin-bottom: 8px !important;
            border: 1px solid transparent;
            left: 0% !important;
            position: relative;
            top: 5px;
            width: 100%;
            border-radius: 0.6vw !important;
        }

        .SelDdWidth {
            width: 10rem !important;
        }
        .c-input--flatpickr {
            
            height: 29px !important;
        }
        .select2-container {
            min-width: 93px !important;
            margin-right: 5px !important;
        }
        .SitepatrollingForm{
            column-gap:normal;
        }
        #sidebar ul li a img {
            width: 100%;
        }
        #sidebar ul li a span {
            display: flex;
            column-gap: 1rem;
            align-items: baseline;
        }
        #sidebar.active ul li a i {
            margin-right: 0;
            display: block;
            font-size: inherit;
            margin-bottom: 4px;
        }
        .Nav-h {
            padding: 0.6rem 0.1rem;
        }
            .well1 {
            height: 100%;
        }

        .SitePatrolSbmtBtn {
            background: transparent linear-gradient( 180deg, #FF8098 0%, #E4002B 100%) 0% 0% no-repeat padding-box;
            border-radius: 0.7rem;
            padding: 0.6rem 2rem;
            outline: none !important;
            width: 100%;
            color: white;
            font-size: 1.3rem;
            border: none;
        }

        .DashboardDD {
            display: flex !important;
            flex-wrap: nowrap;
        }

        .select2-container .select2-selection--single {
            padding: 0% 0% !important;
            border: 1px solid #ccc !important;
            height: 30px !important;
        }

        element.style {
            background: white;
        }

        .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
            background-color: #eee;
            opacity: 1;
        }

        .flatpickr-input[readonly] {
            cursor: pointer;
        }

        .form-control:disabled, .form-control[readonly] {
            background-color: #e9ecef;
            opacity: 1;
        }

        .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
            background-color: #eee;
            opacity: 1;
        }

        .c-input--flatpickr {
            background-image: url(../images/calendar-icon.png) !important;
            background-position: 96% 50% !important;
            background-size: 24px !important;
            background-repeat: no-repeat !important;
            padding: 0.7rem 1rem !important;
            font-size: 1rem !important;
            height: 30px !important;
        }

        .CardImg .card-category {
            font-weight: 600 !important;
            font-size: 0.7rem !important;
        }
        .InspCard {
            flex: 0 1 15.6% !important;
        }
        .navbar {
            padding: 6px 10px;
        }
        .select2-container .select2-selection--single .select2-selection__rendered {
            display: block;
            padding-left: 0px;
            font-size: 0.8rem;
        }
            .CardImg p {
            margin: 0px;
            font-size: 0.8rem;
            font-weight: 600;
        }

        .card-category {
            font-weight: 600;
            font-size: 0.8rem;
            word-break: break-all;
        }

        .SiteHeadings h6 {
            margin: 0px;
            font-size: 0.8rem !important;
        }

        .card-content p {
            font-size: 0.7rem;
        }

        .CardImg div p {
            font-size: 0.8rem;
        }

        .card-title {
            font-weight: 700;
            font-size: 0.8rem;
        }

        .CardBtn button {
            font-size: 0.6rem !important;
            padding: 0.4rem 0rem !important;
        }

        .card_dashboard .CardImg {
            align-items: center !important;
        }
        .cont-pad {
            padding: 0.5rem 1rem 0rem 0.3rem !important;
        }
      

        .cardwidth {
            flex: 0 1 16.5% !important;
        }

        #sidebar.active {
            min-width: 205px;
            max-width: 400px;
            display: block !important;
            margin-left: 0 !important;
        }

        #sidebar {
            display: none;
        }

        .navbar > .container, .navbar > .container-fluid {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-pack: justify;
            justify-content: end;
        }
    }




