body {
                    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
                    font-size: 14px;
                    color: #2e2e2e;
                }
                
                .bdr-rds {
                    border-radius: 100%;
                }
                
                .header-navbar {
                    height: 40px;
                    padding: 4px 0;
                    position: -webkit-sticky;
                    position: sticky;
                    top: 0;
                    z-index: 999;
                }
                
                .logo-tag {
                    margin: 0 6px 0 0;
                }
                
                .logo-tag a,
                .logo-tag img,
                .logo-tag span {
                    display: inline-block;
                    float: left;
                }
                
                .logo-tag span {
                    font-size: 17px;
                    font-weight: normal;
                    line-height: 20px;
                }
                
                .logo-tag a {
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    border-radius: 5px;
                    padding: 6px 8px;
                    margin: 0 2px;
                }
                
                .logo-tag img {
                    max-height: 20px;
                    margin-right: 5px;
                }
                
                .header-navbar .nav-pills>li>a {
                    padding: 7px 8px 8px 8px;
                    font-size: 12px;
                    font-weight: 600;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    height: 32px;
                }
                
                .header-navbar .nav-pills>li>a i {
                    font-size: 16px;
                }
                
                .header-navbar .nav-pills>li>a i.custom-down {
                    margin-left: 4px;
                    font-size: 15px !important;
                    padding-top: 2px;
                    display: inline-block;
                    float: right;
                }
                /* For different theme */
                
                .logo-tag a:hover,
                .header-navbar .nav-pills>li>a:hover,
                .header-navbar .nav-pills>li>a:focus,
                .header-navbar .nav .open>a,
                .header-navbar .nav .open>a:focus,
                .nav .open>a:hover {
                    background-color: rgba(255, 255, 255, 0.2);
                }
                
                .logo-tag span {
                    color: rgba(255, 255, 255, 0.9);
                }
                
                .header-navbar .nav-pills>li>a {
                    color: rgba(255, 255, 255, 0.7);
                }
                /* For different theme */
                
                .header-avatar {
                    border-radius: 100%;
                    border: solid 1px rgba(255, 255, 255, 0.9);
                }
                
                .nav-pills>li.header-user>a {
                    padding-top: 5px;
                    padding-bottom: 4px;
                }
                
                .nav>li>a>img {
                    display: inline-block;
                    margin-top: -1px;
                }
                
                .li-user {
                    padding: 3px 20px;
                    white-space: nowrap;
                }
                
                .li-user h2 {
                    font-size: 16px;
                    margin: 0 0 3px;
                }
                
                .li-user p {
                    margin: 0;
                }
                
                .li-title {
                    padding: 3px 20px;
                    font-size: 14px;
                    white-space: nowrap;
                    color: #707070;
                }
                
                .page-wrapper {
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                }
                
                .nav-sidebar {
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    position: fixed;
                    z-index: 99;
                    width: 220px;
                    top: 40px;
                    bottom: 0;
                    left: 0;
                    background-color: #fafafa;
                    box-shadow: inset -2px 0 0 #e5e5e5;
                }
                
                .inner-navbar {
                    overflow-x: hidden;
                    overflow-y: auto;
                    width: 100%;
                    height: 100%;
                }
                
                .ul-sidebar {
                    list-style: none;
                    margin: 0;
                    padding: 20px 0 60px;
                }
                
                .ul-sidebar li {
                    white-space: nowrap;
                }
                
                .ul-sidebar li a {
                    display: block;
                    padding: 12px 15px;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    text-decoration: none;
                    color: #707070;
                    position: relative;
                }
                
                .ul-sidebar>li.active {
                    box-shadow: inset 7px 0 0 #4b4ba3;
                }
                
                .ul-sidebar li.active>a {
                    background: rgba(0, 0, 0, 0.04);
                    background: #47479b1c;
                    color: #393982;
                }
                
                .ul-sidebar>li:hover>a,
                .ul-sidebar>li:focus>a {
                    background-color: rgba(0, 0, 0, 0.06);
                    color: #2e2e2e;
                }
                
                .ul-sidebar li ul li:hover a,
                .ul-sidebar li ul li:focus a {
                    background-color: rgba(0, 0, 0, 0.06);
                    color: #2e2e2e;
                }
                
                .ul-sidebar li.active>a:hover,
                .ul-sidebar li.active>a:focus {
                    background-color: rgba(0, 0, 0, 0.06);
                    color: #393982;
                }
                
                .ul-sidebar li a i {
                    display: inline-block;
                    float: left;
                    font-size: 15px;
                    width: 16px;
                    text-align: center;
                }
                
                .span-link {
                    display: block;
                    padding-left: 25px;
                    margin-top: -2px;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                }
                
                .page-contents {
                    min-height: calc(100vh - 40px);
                    padding-bottom: 100px;
                }
                
                .custom-border {
                    border-style: solid;
                    border-color: #e8e1e1;
                    border-radius: 10px;
                    border-width: thin;
                }
                
                @media(min-width: 370px) {
                    .custom-padding {
                        padding-right: 10px;
                        padding-left: 10px
                    }
                    .page-wrapper {
                        margin-left: 10px;
                        margin-right: 10px;
                        padding-left: 220px;
                    }
                }
                
                @media(min-width: 990px) {
                    .custom-padding {
                        padding-right: 50px;
                        padding-left: 150px
                    }
                    .page-wrapper {
                        margin-left: 50px;
                        margin-right: 50px;
                        padding-left: 220px;
                    }
                }
                
                .custom-container-fluid {
                    /* max-width: 1280px; */
                    padding-left: 15px;
                    padding-right: 15px;
                    margin-left: auto;
                    margin-right: auto;
                }
                
                .toggle-button {
                    display: block;
                    width: 218px;
                    position: fixed;
                    bottom: 0;
                    padding: 16px;
                    background-color: #fafafa;
                    border-top: 2px solid #e5e5e5;
                    color: #707070;
                    text-decoration: none !important;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    white-space: nowrap;
                }
                
                .toggle-button span {
                    display: inline-block;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                }
                
                .toggle-button:before {
                    position: relative;
                    content: '\F100';
                    font-family: 'FontAwesome';
                    top: 1px;
                    z-index: 9;
                    margin-right: 10px;
                    font-size: 20px;
                }
                
                .toggle-button:hover,
                .toggle-button:focus {
                    background-color: #e5e5e5;
                    color: #2e2e2e;
                }
                
                .ul-sidebar .panel {
                    margin-bottom: 0;
                    background-color: transparent;
                    border: none;
                    border-radius: 0;
                    box-shadow: none;
                }
                
                .ul-sidebar a.arw:after,
                .ul-sidebar a.arw.collapsed:after {
                    position: absolute;
                    right: 10px;
                    content: '\F054';
                    font-family: 'FontAwesome';
                    font-size: 8px;
                    top: 50%;
                    margin-top: -5px;
                    transition: 0.2s ease-in-out 0s;
                    -webkit-transition: 0.2s ease-in-out 0s;
                    z-index: 9;
                }
                
                .ul-sidebar a.arw:after {
                    transform: rotate(90deg);
                }
                
                .ul-sidebar a.arw.collapsed:after {
                    transform: rotate(0deg);
                }
                
                .ul-sidebar ul {
                    list-style: none;
                    margin: 0;
                    padding: 0;
                    background-color: rgba(0, 0, 0, 0.06);
                }
                
                .ul-sidebar ul li a {
                    padding: 8px 16px 8px 40px;
                }
                
                .toggle-page {
                    padding-left: 50px;
                }
                
                .toggle-page .nav-sidebar {
                    width: 50px;
                }
                
                .toggle-page .span-link,
                .toggle-page .ul-sidebar a.arw:after {
                    display: none;
                }
                
                .toggle-page .ul-sidebar li a i {
                    float: none;
                    display: block;
                    height: 18px;
                }
                
                .toggle-page .toggle-button {
                    width: 48px;
                }
                
                .toggle-page .toggle-button span {
                    opacity: 0;
                    display: none;
                }
                
                .toggle-page .toggle-button:before {
                    position: relative;
                    content: '\F101';
                    font-family: 'FontAwesome';
                    top: 1px;
                    z-index: 9;
                    margin-right: 10px;
                    font-size: 20px;
                }
                
                .toggle-page .ul-sidebar li ul li a {
                    padding-left: 25px;
                }
                
                .ul-sidebar ul li:first-child {
                    display: none;
                }
                
                .toggle-page .ul-sidebar ul li:first-child {
                    display: block;
                }
                
                .ul-sidebar ul li:nth-child(2) {
                    border-top: solid 1px rgba(0, 0, 0, 0.08);
                }
                
                .breadcrumb {
                    background-color: transparent;
                    border-bottom: 1px solid #e5e5e5;
                    padding: 12px 0;
                    border-radius: 0;
                    margin-bottom: 15px;
                }
                
                .table-responsive>.table>tbody>tr>td,
                .table-responsive>.table>tbody>tr>th,
                .table-responsive>.table>tfoot>tr>td,
                .table-responsive>.table>tfoot>tr>th,
                .table-responsive>.table>thead>tr>td,
                .table-responsive>.table>thead>tr>th {
                    white-space: normal;
                }
                
                .table>tbody>tr>td,
                .table>tbody>tr>th,
                .table>tfoot>tr>td,
                .table>tfoot>tr>th,
                .table>thead>tr>td,
                .table>thead>tr>th {
                    vertical-align: middle;
                }
                
                .table a,
                .table img {
                    display: inline-block;
                }
                
                .table p {
                    margin: 0;
                }
                
                table .form-group {
                    margin-bottom: 0;
                }
                
                .name-title {
                    display: flex;
                    align-items: center;
                }
                
                .name-title img {
                    margin-right: 5px;
                    align-self: flex-start;
                    border-radius: 50px;
                }
                
                .span-icon {
                    display: inline-block;
                    margin-right: 3px;
                }
                
                .span-icon i {
                    margin-right: 3px;
                }
                
                .no-bdr {
                    border: none;
                }
                
                .no-bckg {
                    background: none !important;
                }
                
                .panel,
                .panel-heading {
                    border-radius: 0;
                    box-shadow: none;
                }
                
                .page-head {
                    margin-bottom: 10px;
                }
                
                .panel-body {
                    padding-top: 20px;
                    padding-bottom: 20px;
                }
                
                .form-horizontal [class*=col-] {
                    margin-bottom: 5px;
                }
                
                .colsp-tr td {
                    padding: 0 !important;
                }
                
                .colsp-tr td .panel {
                    border: none !important;
                    border-bottom: solid 1px #ddd !important;
                    margin-bottom: 0;
                }
                
                .text-left {
                    text-align: left !important;
                }
                
                .text-center {
                    text-align: center !important;
                }
                
                .text-right {
                    text-align: right !important;
                }
                
                .form-horizontal .form-inline .form-group {
                    margin-right: 0;
                    margin-left: 0;
                }
                
                .table-bordered td {
                    border-bottom: none !important;
                }
                /* css started for login page */
                
                .login-wrapper {
                    width: 100%;
                    height: 100%;
                    display: table;
                    background: url(../../images/login-top.png) no-repeat right -240px top -70px, url(../../images/login-bottom.png) no-repeat left -280px bottom -140px;
                }
                
                .login-inner-wrapper {
                    display: table-cell;
                    vertical-align: middle;
                    padding: 0 20px;
                }
                
                .login-sec {
                    max-width: 470px;
                    margin: 30px auto;
                    border-radius: 21px;
                    background-color: #fff;
                    padding: 40px;
                    box-shadow: 0px 0px 12px 2px rgba(41, 41, 97, 0.08);
                }
                
                .login-sec h1 {
                    font-size: 29px;
                    text-transform: uppercase;
                    text-align: center;
                    font-weight: normal;
                    margin: 15px 0 35px;
                }
                
                .login-sec h2 {
                    color: #424242;
                    font-size: 15px;
                    text-align: center;
                    margin: 0 0 20px;
                }
                
                .btn-block {
                    width: 100%;
                }
                
                .login-group {
                    margin-bottom: 20px;
                }
                
                .login-group .form-control {
                    height: 50px;
                    border-radius: 6px;
                    /*  border-color: #BBBAD6;
  border-width: 2px;
  background-color: #FAFAFC;*/
                }
                
                .login-btn {
                    height: 50px;
                    color: #fff !important;
                    text-transform: uppercase;
                    font-size: 16px;
                    border-radius: 6px;
                    outline: none !important;
                    box-shadow: none !important;
                }
                
                .login-btn:hover {
                    opacity: 0.9;
                }
                
                .invalid-text {
                    text-align: center;
                    margin-bottom: 15px;
                    font-size: 16px;
                }
                
                .login-group i {
                    font-size: 20px;
                }
                
                @media(max-width: 1370px) {
                    .login-wrapper {
                        background-position: right -250px top -100px, left -350px bottom -200px;
                    }
                }
                
                @media(max-width: 991px) {
                    .login-wrapper {
                        background-position: right -300px top -175px, left -480px bottom -300px;
                    }
                }
                
                .dropdown-submenu {
                    position: relative;
                }
                
                .dropdown-submenu .dropdown-menu {
                    top: 0;
                    left: 100%;
                    margin-top: -1px;
                }
                
                .dropdown-submenu a:focus {
                    outline: none !important;
                }
                
                .nonelink {
                    text-decoration: none;
                    color: #707070;
                    position: relative;
                }
                /* css ended for login page */
                
                .require:after {
                    content: '*' !important;
                    color: red;
                }
                
                .customer-badge {
                    font-size: 80%;
                }
                
                .customer-badge i {
                    cursor: pointer;
                    color: #dc3545;
                }
                
                .custom-file~.invalid-feedback {
                    display: block;
                }
                
                .test {
                    background-color: red;
                }
                
                .ck-editor__editable {
                    min-height: 200px;
                }
                
                @media (min-width: 990px) {
                    .custom-padding {
                        padding-right: 50px !important;
                        padding-left: 50px;
                    }
                }
                
                .nav-tabs .nav-link.active {
                    color: #495057;
                    background-color: #fff;
                    border-color: #495057 #495057 white #495057 !important;
                }
                
                .nav-tabs {
                    border-bottom: 1px solid gray !important;
                }
                
                .toggle.btn {
                    width: 112.344px !important;
                }
                
                .row-month {
                    display: flex;
                    flex-wrap: wrap;
                    margin-left: -27px;
                    margin-right: -73px;
                }
                /* Chrome, Safari, Edge, Opera */
                
                input::-webkit-outer-spin-button,
                input::-webkit-inner-spin-button {
                    -webkit-appearance: none;
                    margin: 0;
                }
                /* Firefox */
                
                input[type=number] {
                    -moz-appearance: textfield;
                }
                
                .custom-padding-form {
                    padding-right: 20px !important;
                    padding-left: 28px !important;
                }
                
                .wrapper-toggle {
                    width: 98px;
                    background: rgba(0, 0, 0, 0.4);
                    border-radius: 30px;
                }
                
                .btn_container {
                    display: inline-block;
                    margin: 0px;
                }
                
                .btn_container .checkmark {
                    width: 30px;
                    height: 30px;
                }
                
                .checkmark {
                    padding-top: 4px;
                    padding-right: 2px;
                    padding-left: 7px;
                    padding-bottom: 5px;
                    margin: 0px;
                    color: white;
                }
                
                .yes:checked+.checkmark {
                    background-color: green;
                    border-radius: 30px;
                    border: 1px solid transparent;
                    background: rgb(32, 213, 50);
                    background: linear-gradient(to bottom, rgba(32, 213, 50, 1) 0%, rgba(28, 195, 1, 1) 100%);
                    -moz-animation-duration: 0.4s;
                    -moz-animation-name: slidein;
                    -webkit-animation-duration: 0.4s;
                    -webkit-animation-name: slidein;
                    animation-duration: 0.4s;
                    animation-name: slidein;
                    -webkit-transform: translateZ(0);
                }
                
                .neutral:checked+.checkmark {
                    color: #6c757d;
                    background-color: #ccc;
                    border: 1px solid #ccc;
                    border-radius: 30px;
                    background: rgb(238, 238, 238);
                    background: linear-gradient(to bottom, rgba(238, 238, 238, 1) 0%, rgba(204, 204, 204, 1) 100%);
                }
                
                .no:checked+.checkmark {
                    background-color: red;
                    border-radius: 30px;
                    border: 1px solid transparent;
                    -moz-animation-duration: 0.4s;
                    -moz-animation-name: slideno;
                    -webkit-animation-duration: 0.4s;
                    -webkit-animation-name: slideno;
                    animation-duration: 0.4s;
                    animation-name: slideno;
                }
                
                .ion-checkmark-round,
                .ion-close-round {
                    margin-left: 10px;
                    margin-top: 10px;
                    color: #fff;
                    line-height: 30px;
                }
                
                .ion-record {
                    margin-left: 8px;
                    color: #fff;
                    line-height: 30px;
                }
                
                @-webkit-keyframes slidein {
                    from {
                        transform: translate(50px, 0);
                    }
                    to {
                        transform: translate(0px, 0px);
                    }
                }
                
                @keyframes slidein {
                    from {
                        transform: translate(50px, 0);
                    }
                    to {
                        transform: translate(0px, 0px);
                    }
                }
                
                @-webkit-keyframes slideno {
                    from {
                        transform: translate(-50px, 0);
                    }
                    to {
                        transform: translate( 0px, 0px);
                    }
                }
                
                @keyframes slideno {
                    from {
                        transform: translate(-50px, 0);
                    }
                    to {
                        transform: translate( 0px, 0px);
                    }
                }
                
                @-webkit-keyframes returnLeft {
                    from {
                        transform: translate(-50px, 0);
                    }
                    to {
                        transform: translate(0px, 0);
                    }
                }
                
                @keyframes returnLeft {
                    from {
                        transform: translate(-50px, 0);
                    }
                    to {
                        transform: translate(0px, 0);
                    }
                }
                
                @-webkit-keyframes returnRight {
                    from {
                        transform: translate(50px, 0);
                    }
                    to {
                        transform: translate(0px, 0);
                    }
                }
                
                @keyframes returnRight {
                    from {
                        transform: translate(50px, 0);
                    }
                    to {
                        transform: translate(0px, 0);
                    }
                }
                /* Design dashboard starts  */
                
                .dash-wrapper {
                    padding-left: 220px;
                }
                
                .dash-contents {
                    background: #F6F6F6;
                }
                
                .dash-container {
                    padding-left: 66px;
                    padding-bottom: 22px;
                }
                
                .dash-inner-content {
                    background-color: #ffffff;
                }
                
                .dash-head {
                    padding-right: 50px;
                }
                
                .dash-title h4 {
                    font-size: 25px;
                    color: #111111;
                }
                
                .project-status {
                    display: flex;
                    justify-content: flex-end;
                    align-items: center;
                }
                
                .project-status p {
                    font-size: 16px;
                    margin-bottom: 0;
                }
                
                .project-status span {
                    font-size: 16px;
                    font-weight: 600;
                }
                
                .dashboard-card-border {
                    border: 1px solid #fff !important;
                    padding: 22px 35px 35px 22px !important;
                }
                
                .dash-wrapper .card {
                    border: 1px solid #fff;
                    padding: 22px 27px 16px 22px;
                    margin-top: 25px;
                    border-radius: 8px;
                }
                
                .inner-card {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-bottom: 18px;
                }
                
                .inner-card h1 {
                    font-size: 22px;
                    font-weight: 500;
                }
                
                .inner-card p {
                    margin-bottom: 0;
                    font-size: 22px;
                    font-weight: 600;
                    color: #3A3A3A;
                }
                
                .inner-card p span {
                    font-weight: 400;
                }
                
                .progress {
                    height: 15px;
                    border-radius: 7px;
                }
                
                .progress-bar {
                    background: #72C428;
                    border-radius: 7px;
                }
                
                .main-section-dasboard {
                    padding-left: 53px;
                    padding-right: 50px;
                }
                
                .arrow-part {
                    display: flex;
                    align-items: center;
                }
                
                .arrow-part i {
                    color: #d7d4d4;
                }
                
                .arrow-part h2 {
                    color: #656565;
                    font-size: 18px;
                    margin-bottom: 0;
                    padding-left: 12px;
                }
                
                .arrow-part p {
                    margin-bottom: 0;
                    padding-left: 32px;
                    color: #4D4D4D;
                    font-size: 18px;
                    font-weight: 300;
                }
                
                .top-cards {
                    margin-top: 15px;
                    background-color: #F9F9F9;
                    padding: 21px 30px 24px 20px;
                }
                
                .inner-dash-cards h3 {
                    color: #373737;
                    font-size: 16px;
                    font-weight: 500;
                }
                
                .dashboard-inner-contents {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                }
                
                .dashboard-inner-contents span {
                    color: #373737;
                    font-size: 16px;
                    font-weight: 500;
                    /* margin-top: 21px; */
                }
                
                .easychart {
                    /*from ww w.j  a  v  a 2s. co  m*/
                    position: relative;
                    text-align: center;
                    margin: 10px;
                }
                
                .pie-charts {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    margin-bottom: 0;
                }
                
                #mymap {
                    border: 1px solid white;
                    width: 100%;
                    height: 400px;
                }
                
                .main-sec-dasboard {
                    padding-left: 50px;
                    padding-right: 50px;
                }
                
                .inner-mainbox {
                    display: flex;
                    align-items: center;
                }
                
                .image-mainbox {
                    height: 50px;
                    width: 50px;
                    background: #e8e8e8;
                    margin-right: 10px;
                }
                
                .section-mainbox p {
                    margin-bottom: 0;
                    font-size: 12px;
                    font-weight: 500;
                }
                
                .section-mainbox span {
                    font-size: 25px;
                    font-weight: 700;
                }
                
                .dash-main-wrap {
                    padding-left: 0px;
                }
                
                .dash-main-wrap .card {
                    padding: 10px 20px;
                }
                
                .card-info-part h1 {
                    color: #373737;
                    font-size: 18px;
                    font-weight: 600;
                    margin-bottom: 0;
                    margin-top: 20px;
                }
                
                .main-info {
                    margin-bottom: 15px;
                }
                
                .main-info-head {
                    display: flex;
                    justify-content: space-between;
                }
                
                .main-info-head p {
                    margin-bottom: 10px;
                    margin-top: 10px;
                    font-size: 15px;
                    font-weight: 500;
                }
                
                .main-info-head .a-info {
                    display: flex;
                    align-items: center;
                }
                
                .inner-main-info {
                    border: 1px solid #c3c3c3;
                    border-radius: 8px;
                }
                
                .inner-main-info tr th,
                .inner-main-info tr td {
                    border: none;
                    padding-left: 20px;
                    padding-right: 20px;
                }
                
                .inner-main-info tr th {
                    font-size: 15px;
                    font-weight: 500;
                }
                
                .inner-main-info tr td {
                    font-size: 14px;
                    font-weight: 400;
                }
                
                .inner-main-info table {
                    margin-bottom: 0;
                }
                
                .inner-main-info tr:nth-child(even) {
                    background: #fdfcfc;
                }
                
                .image-map {
                    margin-top: 20px;
                }
                
                .dash-page-wrapper {
                    margin: 0px;
                }
                
                .dash-container-fluid {
                    padding: 0px;
                }
                
                .head-dashboard {
                    padding-left: 10px;
                }
                
                .dash-title {
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                }
                /* Dashboard second flow ends */
                /* new dashboard starts  */
                
                .new-dash-card {
                    flex-direction: row;
                    align-items: center;
                    padding: 8px 8px 8px 22px !important;
                }
                
                .inner-blue {
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                    color: #fff;
                }
                
                .inner-blue p {
                    margin-bottom: 0;
                }
                
                .blue-part {
                    background-color: #5283EC;
                    width: 300px;
                    display: flex;
                    align-items: center;
                    flex-shrink: 0;
                    padding: 15px;
                }
                
                .inner-blue-part {
                    padding-left: 22px;
                }
                
                .inner-blue-part input {
                    width: 162px;
                    margin-top: 15px;
                }
                
                .project-date p {
                    color: #373737;
                    font-size: 28px;
                    font-weight: bold;
                    margin-bottom: 0;
                }
                
                .date-text {
                    padding-top: 15px;
                    align-items: baseline;
                    justify-content: center;
                    margin-bottom: 20px;
                }
                
                .bordered-inner-dash {
                    border: 1px solid #E6E6E6 !important;
                    padding: 16px 8px !important;
                }
                
                .bordered-inner-dash h4 {
                    font-size: 16px;
                    color: #373737;
                    font-weight: 500;
                    margin-bottom: 20px;
                    padding-left: 15px;
                }
                
                .inner-major-comp {
                    display: flex;
                    width: 100%;
                    justify-content: space-around;
                    margin-top: 20px;
                }
                
                .weightage-button {
                    background: #5283EC;
                    border: 1px solid #5283EC;
                    color: #fff;
                    padding: 9px;
                    width: 100%;
                    margin-top: 12px;
                    font-size: 15px;
                }
                
                .weightage-button:hover {
                    color: white;
                }
                
                .check-major {
                    align-items: center;
                }
                
                .check-major p {
                    margin-bottom: 0;
                    font-size: 12px;
                }
                
                .check-major input {
                    width: 12px;
                    height: 12px;
                }
                
                .color-class {
                    width: 12px;
                    height: 12px;
                    border: 2px solid #E6E6E6;
                    background: #72C428;
                }
                
                .blue-color-class {
                    background: #1F78B4 !important;
                }
                
                .not-started {
                    background: #F0BD40 !important;
                }
                /* new dashboard ends  */
                /* third page starts */
                
                .bar-new {
                    background-color: #616A73;
                    border-color: #616A73 !important;
                    border-radius: 3px !important;
                }
                
                .line-new {
                    color: #9da2a8;
                    background-color: #F3F3F3;
                    border-color: #F3F3F3;
                    border-radius: 3px;
                }
                
                .line-new:hover {
                    color: #212529;
                    background-color: #ebebeb;
                    border-color: #F3F3F3;
                }
                
                .dash-title-new {
                    padding: 15px 90px 15px 66px;
                    border-bottom: 1px solid #E8E8E8;
                    background-color: #fff;
                }
                
                .dash-title-second {
                    margin-bottom: 27px;
                    border-bottom: none;
                }
                
                .prime-new {
                    padding: 6px 25px;
                }
                
                .selection {
                    position: relative;
                }
                
                .selection .form-control {
                    -webkit-appearance: none;
                    -moz-appearance: none;
                    background: none;
                }
                
                .selection i {
                    position: absolute;
                    right: 8px;
                    top: 6px;
                    font-size: 17px;
                    z-index: 0;
                    color: #AFAFAF;
                }
                
                .selection .selection-inner {
                    width: 249px;
                    height: 40px;
                    border-color: #DBDBDB;
                    padding: 10px 20px;
                    border-radius: 4px;
                    padding: 7px 20px;
                    border-radius: 4px;
                }
                
                .main-selection {
                    display: flex;
                }
                
                .activity-main-page {
                    padding: 5px 90px 15px 66px;
                }
                
                .activity-main-page h5 {
                    color: #373737;
                    font-size: 18px;
                    font-weight: 500;
                }
                
                .activity-new-card .project-date p {
                    color: #434343;
                    font-size: 16px;
                    font-weight: bold;
                    margin-bottom: 0;
                }
                
                .activity-new-card .project-date .project-status span {
                    font-size: 16px;
                    font-weight: 400;
                }
                
                .activity-new-card .project-date .arrow-part {
                    padding: 22px 27px 16px 22px;
                    border-bottom: 1px solid #E8E8E8;
                    justify-content: space-between;
                }
                
                .project-status-new-radio {
                    display: flex;
                    justify-content: space-between;
                    width: 35%;
                }
                
                .target-achievement {
                    display: flex;
                    justify-content: end;
                }
                
                .red-target {
                    display: flex;
                }
                
                .red-target span {
                    width: 22px;
                    height: 22px;
                    /* background-color: #D6503F; */
                    background-color: #800080;
                    display: inline-block;
                }
                
                .yellow-target span {
                    width: 22px;
                    height: 22px;
                    background-color: #0978F8;
                    display: inline-block;
                }
                
                .date-target span {
                    width: 22px;
                    height: 22px;
                    background-color: #D6503F;
                    display: inline-block;
                }
                
                .green-target span {
                    background-color: #59A55B;
                }
                
                .activity-new-card .project-date .arrow-part p {
                    padding-left: 15px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    height: 40px;
                    line-height: 20px;
                    font-weight: 400 !important;
                }
                
                .inneractivity-status {
                    display: flex;
                }
                
                .date-text {
                    padding: 22px 27px 16px 22px;
                }
                
                .activity-new-card {
                    padding: 0 !important;
                }
                
                .project-status-new-radio .custom-radio .custom-control-label::before {
                    border: solid 2px #E9E9E9 !important;
                    width: 18px;
                    height: 18px;
                    box-shadow: none !important;
                    border-radius: 2px !important;
                }
                
                .project-status-new-radio .custom-radio .custom-control-input:checked~.custom-control-label::after {
                    background: #5283EC;
                    width: 12px;
                    height: 12px;
                    top: 7px;
                    left: -21px;
                    border-radius: 1px;
                }
                
                .inner-static {
                    display: flex;
                    align-items: flex-start;
                }
                
                .inner-static i {
                    padding-top: 5px;
                }
                
                .image-act {
                    flex-shrink: 0;
                }
                
                .view-dashboard-button {
                    background: #5283EC;
                    border: 1px solid #5283EC;
                    color: #fff;
                    padding: 9px;
                    width: 50%;
                    margin-top: 12px;
                    font-size: 15px;
                    display: inline-block;
                }
                
                .view-dashboard-button:hover {
                    color: white;
                }
                
                .total-projects {
                    color: black;
                }
                
                .total-projects:hover {
                    color: black;
                    text-decoration: none;
                }
                
                #currentMonth #ndp-month-select,
                #currentMonth #ndp-year-select {
                    color: white !important;
                    font-size: 12px;
                    font-weight: 400;
                    padding: 2 px 1 px 0;
                    height: 22 px;
                }@media (max-width: 1440px) {
    .project-date p {
        font-size: 25px;
    }
    .arrow-part h2 {
        font-size: 14px;
    }
    .bordered-inner-dash h4 {
        font-size: 14px;
    }
    .main-major input {
        margin-top: 3px;
    }
}

@media (min-width: 1280px) {
    .selection .selection-inner {
        width: 200px;
    }
}

@media (min-width: 1201px) {
    .toggle-page .ul-sidebar li ul {
        transform: translate3d(50px -42px 0);
        -webkit-transform: translate3d(50px, -42px, 0);
        left: 0;
        position: fixed;
        width: 170px;
        display: block;
        background-color: #fafafa;
        border: solid 1px #eee;
        box-shadow: 2px 1px 3px rgba(0, 0, 0, 0.1);
        visibility: hidden;
        opacity: 0;
        height: auto !important;
    }
    .toggle-page .ul-sidebar li:hover ul {
        visibility: visible;
        opacity: 1;
    }
}

@media (max-width: 1200px) {
    .nav-sidebar {
        width: 50px;
    }
    .toggle-page .nav-sidebar {
        width: 220px;
        box-shadow: inset -2px 0 0 #e5e5e5, 2px 1px 3px rgba(0, 0, 0, 0.1);
    }
    .page-wrapper {
        padding-left: 50px;
    }
    .toggle-button {
        width: 48px;
    }
    .toggle-page .toggle-button {
        width: 218px;
    }
    .toggle-button span {
        opacity: 0;
        display: none;
    }
    .toggle-button:before {
        content: '\F101';
    }
    .toggle-page .toggle-button span {
        display: inline-block;
        opacity: 1;
    }
    .toggle-page .toggle-button:before {
        content: '\F100';
    }
    .span-link,
    .ul-sidebar a.arw:after {
        display: none;
    }
    .toggle-page .span-link,
    .toggle-page .ul-sidebar a.arw:after {
        display: block;
    }
    .ul-sidebar li a i {
        float: none;
        display: block;
        height: 18px;
    }
    .toggle-page .ul-sidebar li a i {
        display: inline-block;
        float: left;
        height: auto;
    }
    .page-wrapper:not(.toggle-page) .ul-sidebar li ul {
        transform: translate3d(50px -42px 0);
        -webkit-transform: translate3d(50px, -42px, 0);
        left: 0;
        position: fixed;
        width: 170px;
        display: block;
        background-color: #fafafa;
        border: solid 1px #eee;
        box-shadow: 2px 1px 3px rgba(0, 0, 0, 0.1);
        visibility: hidden;
        opacity: 0;
        height: auto !important;
    }
    .page-wrapper:not(.toggle-page) .ul-sidebar li ul li a {
        padding-left: 25px;
    }
    .page-wrapper:not(.toggle-page) .ul-sidebar li:hover ul {
        visibility: visible;
        opacity: 1;
    }
    .ul-sidebar ul li:first-child {
        display: block;
    }
    .toggle-page .ul-sidebar ul li:first-child {
        display: none;
    }
}

@media (min-width: 768px) {
    .form-inline .form-group {
        vertical-align: top;
    }
}