@media (min-width:200px) and (max-width:767px) {
    .animated {right: 0 !important; width: 90% !important; left: 0 !important;}
    .authentication{padding:60px 15px;}
    .authentication-main {padding: 30px 30px 5px 30px; margin: 0 auto;}
    .navbar-light .navbar-toggler {border: 0; padding: 0; margin: 0;}
    .header{z-index: 999;}
    .header .navbar{position: static;}
    .header .navbar .container{position: static;}
    .navbar-light [aria-expanded="false"] .navbar-toggler-icon { background: url(../images/menu-icon.svg) no-repeat center;}
    .navbar-light [aria-expanded="true"] .navbar-toggler-icon { background: url(../images/close-icon.svg) no-repeat center;}
    .header .navbar .navbar-collapse {position: absolute; top: 100%; transform: scaleY(0); transform-origin: top; transition: transform 0.3s ease-out; left: 0; right: 0; width: 100%; height: 100vh; background-color: #222222; z-index: 100; flex-direction: column; justify-content: center; align-items: center;}
    .header .navbar .navbar-collapse.show {transform: scaleY(1); overflow: auto;}
    .navbar .navbar-collapse .navbar-nav li {margin: 0px 0 10px;}
    .navbar .navbar-collapse .navbar-nav li a {padding: 10px 0px; color: #fff;}
    .navbar .navbar-collapse .navbar-nav li a:before {background: #fff;}
    .navbar .navbar-collapse .navbar-nav li a:after {color: #fff; padding: 10px 0px;}
    .navbar .navbar-collapse .navbar-nav li a.active {color: #fff;}
    .header .header-inner .navbar .navbar-nav li a {padding: 10px 0; color: #fff; font-size: 16px; line-height: 18px;}
    .header .header-inner .navbar .navbar-nav li a:before{background-color: #ffffff;}
    .header .header-inner .navbar .navbar-nav {justify-content: start;  height: 100%; overflow: auto; min-height: 500px; padding-top: 50px;}
    .header .header-inner{padding: 10px 0;}
    body{padding-top:60px;}
    .payment .panel{padding: 0;}
    .payment .logo{max-width: 150px;}
    .payment .panel .panel-heading .panel-title{font-size: 1.4rem;}
    .dashboard-wrap .container {padding: 0;}
    .iu-table { overflow: auto; position: relative; z-index: 9;}
    .input-group.input-daterange { max-width: 225px; flex-wrap: inherit;}
    .mfp-content .mfp-form-popup .organisation-form form .form-group:last-child .btn, .mfp-content .mfp-form-popup form .form-group:last-child .btn{width: 100%; max-width: 100%; flex: 0 0 100%; margin: 0 0 10px 0;}
    .subheader-top{top: 60px;}
    .subheader .header-inner{flex-wrap:wrap;}
    .subheader .header-inner h2 {font-size: 35px; line-height:45px; margin-bottom: 15px; margin-right:auto;}
    .subheader .header-inner .header_right_panel a.btn { padding: 0 15px; margin-bottom: 10px;}
    .subheader .header-inner .header_right_panel {margin: 0 0 0 0;}
    .customers-details-wrap .customers-details-right-wrap { width: 100%; padding-left: 0;}
    .customers-details-wrap .customers-details-left-wrap {width: 100%;}
    .customers-details-left-wrap .innovation-details-group .organisation-details-title {width: 100%;}
    .domain-view .tabs-above .nav-tabs li{padding-right: 20px;}
    .domain-view .tabs-above .nav-tabs li:last-child{padding-right:0;}
    .domain-view .tabs-above .nav-tabs:after, .domain-view .tabs-above .nav-tabs:before{display: none}
    .tab-pane ul.sortable li{width: 50%; max-width: 50%;  flex: 0 0 50%;}
    .tab-pane ul.sortable li.sortable-placeholder {width: 50%; max-width: 50%;  flex: 0 0 50%;}
    .grid-view.iu-value-table-form {overflow: auto; margin-bottom: 15px;}
    .task-detail-wrapper .task-title{flex-wrap:wrap;}
    .task-detail-wrapper .task-title .task-right-row, .task-detail-wrapper .task-title .task-left-row{max-width: 100%; flex: 0 0 100%; width: 100%;}
    .task-detail-wrapper .task-title .task-right-row .profile { margin: 20px 0 0 0; justify-content: flex-start;}
    .task-detail-wrapper .task-title .task-left-row h2 {font-size: 30px; line-height: 40px;}
    .task-detail-wrapper .task-row .task-details .task-col {width: 100%; max-width: 100%; flex: 0 0 100%; flex-wrap: wrap;}
    .task-detail-wrapper .task-title .task-right-row .profile .profile-img, .task-detail-wrapper .task-title .task-right-row .profile .profile-img img {width: 50px; height: 50px;}
    .task-detail-wrapper .task-title .task-right-row .profile .profile-details{padding-left: 15px;}
    .subheader{position: relative}
    .subheader.user-details .header-inner .user-filter {width: 100%; margin: 0; padding: 0;}
    .subheader.user-details .header-inner .user-filter .filter-panel { margin: 15px -10px 0;}
    .subheader.user-details .header-inner .user-filter .filter-panel li {margin: 0 0 15px 0;}
    .subheader.user-details .header-inner .search_icon {position: absolute; right: 0; top:0;}
    .subheader.user-details .header-inner{position:relative;}
    .subheader.user-details .header-inner .user-filter .filter-panel li a {font-size: 14px;  padding: 11px 11px 11px 11px;}
    .user-details-inner{margin:0;}
    .user-details-profile {width: 100%;}
    .user-details-profile-content {width: 100%; margin-top: 15px;}
    .user-details-wrap .container {padding: 0;}
    .min-title h1 {font-size: 35px; line-height: 45px; margin-bottom: 20px; }
    .content-list .alert.alert-danger {flex-wrap: wrap;}
    .content-list-table ul li {padding: 0 10px 10px;  width: 50%;}
    .iu-table table thead tr td .select2-container .select2-selection--single .select2-selection__rendered{padding-right:30px;}
    .iu-table table thead tr td .select2-container--krajee-bs4 .select2-selection--single .select2-selection__clear{right:20px; top: 9px;}
    .signin-wrap{padding:60px 15px;}
    .signin-step-logo {width: 100%; max-width: 100%; flex: 0 0 100%; text-align: center}
    .signin-step-logo a img { max-width: 100px; width: 100%; margin: 0 auto 30px auto;}
    .signin-step-panel {width: 100%; max-width: 100%; flex: 0 0 100%;}
    .signin-step-form-box{margin: 0 auto;}
    .signin-step-form-box .box-logo h2, .signin-step-form-box .subheader-logo h2 { font-size: 24px; line-height: 32px; margin-bottom: 10px;}
    .signin-step-form form .form-row .form-group { width: 100%;  max-width: 100%; flex: 0 0 100%;}
    .signin-step-form-box .box-logo p, .signin-step-form form .form-group .text-muted{font-size: 14px;}
    .signin-step-form-box .box-logo.verification{margin-bottom: 20px;}
    .signin-step-form-box .verification-form .sign-button {margin-top: 15px;}

    .dashboard-top-section .highcharts-section .highcharts-container{width: 100% !important; height: auto !important;}
    .dashboard-top-section .highcharts-section .highcharts-container .highcharts-root {width: 100%; max-width: 100%; height: auto;}
    .dashboard-top-section .nav-nav-tabs ul{margin: 0 0; padding: 0 6px;}
    .dashboard-top-section .nav-nav-tabs ul li, .dashboard-top-section .nav-nav-tabs.ui-admin-tiles ul li{width: 33.33%;}
    .user-status-wrap .row{margin: 0px;}
    .dashboard-top-section .subheader .grafdownload{margin-right: 15px;}
    .user-status-wrap .grid-margin .user-status-box{margin: 0 0 25px 0;}
    .dashboard-top-section .nav-nav-tabs ul li a h3 {font-size: 26px; line-height: 45px;}
    .user-status-bottom .user-status-inner .row {margin: 0;}
    .user-status-bottom{overflow-x: auto;}
    /*.user-status-bottom .user-status-inner .highcharts-container {width: 100% !important; }*/
    /*.user-status-bottom .user-status-inner .highcharts-container .highcharts-root {max-width: 100%;}*/
    /*.user-status-bottom .grid-margin{ max-width: 100%;}*/
    .header .header-inner .logo span {padding-left: 10px; margin-left: 10px;}
    .org-logo { width:40px;}
    .signin-wrap .org-logo {width: 91px;}
    .task-detail-wrapper .task-row .task-extra-details .task-activities .activities li p { font-size: 14px; line-height: 20px;}
    .task-detail-wrapper .task-row .task-details .task-col p, .task-detail-wrapper .task-row .task-extra-details .custom-data .details p{font-size: 16px; line-height: 21px;}
    .iu-table .grid-view table tr td input{min-width: 110px;}
    .iu-table table tbody tr td a > .glyphicon{right:0;}
    .setting-rightInner { width: 100%; padding-left: 0;}
    .setting-leftSideBar {width: 100%; height: auto; border-right: 0;}
    .guest-mode-on {padding-top: 110px;}
    .guest-mode-on .guest-user-header .header_left_panel a img {width: 6px;}
    .guest-mode-on .guest-user-header .header_left_panel a{font-size:14px;}
    .guest-mode-on .guest-user-header .org-name{font-size: 14px; width: calc(100% - 150px);}
    .guest-mode-on .subheader-top {top: 111px;}
    .user-status-bottom .user-status-inner .highcharts-container .highcharts-root tspan {font-size: 12px;}
    .header .header-inner .navbar .navbar-nav li:last-child {padding-right: 16px;}
    .dashboard-top-section .nav-nav-tabs ul li a .card-title{min-height: 32px;}
    .dashboard-wrap .dashboard-top-section .highcharts-container { width: 95% !important; height: auto !important; margin: 0 auto;}
    .page-loader-wrapper .loader {left: 43%;}
    span.avtar-image-icon{line-height: 20px;}
    .default-avtar-image{line-height: 223px;}

    .organisation-details-wrap{margin-top: 25px;}
    .iu-table table thead tr th a {white-space: nowrap;}
    .iu-table table tbody tr td{min-width: 189px;}
    .activity-index.iu-table table tbody tr td:last-child, .user-index.iu-table table tbody tr td:nth-child(6){min-width: 185px;}
    .iu-table table tbody tr td:last-child{min-width:auto;}
    .user-index.iu-table table tbody tr td:nth-child(2) { min-width: auto;}
    .user-index.iu-table table tbody tr td:nth-child(9) { min-width: auto;}
    .activity-index.iu-table table tbody tr td:nth-child(4) {min-width: 230px;}
    .activity-index.iu-table table tbody tr td:nth-child(1) {min-width: 190px;}
    .activity-index.iu-table table tbody tr td:nth-child(5) {min-width: 300px;}
    .group-index.iu-table table tbody tr td:nth-child(4) {min-width: auto;}
    .bootstrap-dialog .modal-dialog{max-width: 310px;}
    .content-list .content-list-table .items ul li p{font-size: 14px;}
    .content-list .content-list-table .items ul li label{font-size: 14px;}
    .task-row span.avtar-image-icon {width: 50px; height: 50px; line-height: 55px; font-size: 21px;}
    .grid-view.iu-value-table-form .table tr th {min-width: 230px;}
    .panel-body-checkout .form-content-inner { padding: 30px 20px; }
}
@media (min-width:397px) and (max-width:421px) {
    .download_success_section .web_console a {white-space: nowrap;}
}


@media (min-width:768px) and (max-width:991px) {
    .header{z-index: 999;}
    .navbar-light .navbar-toggler {border: 0; padding: 0; margin: 0;}
    .header .navbar{position: static;}
    .header .navbar .container{position: static;}
    .navbar-light [aria-expanded="false"] .navbar-toggler-icon { background: url(../images/menu-icon.svg) no-repeat center;}
    .navbar-light [aria-expanded="true"] .navbar-toggler-icon { background: url(../images/close-icon.svg) no-repeat center;}
    .header .navbar .navbar-collapse {position: absolute; top: 100%; transform: scaleY(0); transform-origin: top; transition: transform 0.3s ease-out; left: 0; right: 0; width: 100%; height: 100vh; background-color: #222222; z-index: 100; flex-direction: column; justify-content: center; align-items: center;}
    .header .navbar .navbar-collapse.show {transform: scaleY(1);}
    .navbar .navbar-collapse .navbar-nav li {margin: 0 0 10px;}
    .navbar .navbar-collapse .navbar-nav li a {padding: 10px 0; color: #fff;}
    .navbar .navbar-collapse .navbar-nav li a:before {background: #fff;}
    .navbar .navbar-collapse .navbar-nav li a:after {color: #fff; padding: 10px 0;}
    .navbar .navbar-collapse .navbar-nav li a.active {color: #fff;}
    .header .header-inner .navbar .navbar-nav li a {padding: 10px 0; color: #fff; font-size: 16px; line-height: 18px;}
    .header .header-inner .navbar .navbar-nav li a:before{background-color: #ffffff;}
    .header .header-inner .navbar .navbar-nav{justify-content: center; height: 100%;}
    .header .header-inner{padding: 10px 0;}
    body{padding-top:60px;}
    .payment .panel{padding: 0;}
    .payment .logo{max-width: 160px;}
    .input-group.input-daterange { max-width: 225px; flex-wrap: inherit;}
    .iu-table { overflow: auto; position: relative; z-index: 9;}
    .subheader-top{top: 60px;}
    .domain-view .tabs-above .nav-tabs:after, .domain-view .tabs-above .nav-tabs:before{display: none}
    .tab-pane ul.sortable li {width: 33.33%; max-width: 33.33%; flex: 0 0 33.33%;}
    .tab-pane ul.sortable li.sortable-placeholder {width: 33.33%; max-width: 33.33%; flex: 0 0 33.33%;}
    .task-detail-wrapper .task-title .task-left-row h2 {font-size: 33px; line-height: 42px;}
    .content-list-table ul li {padding: 0 10px 10px; width: 33.33%;}

    .signin-wrap{padding:60px 15px;}
    .signin-step-logo {width: 100%; max-width: 100%; flex: 0 0 100%; text-align: center}
    .signin-step-logo a img { max-width: 100px; width: 100%; margin: 0 auto 30px auto;}
    .signin-step-panel {width: 100%; max-width: 100%; flex: 0 0 100%;}
    .signin-step-form-box{margin: 0 auto;}
    .signin-step-form-box .subheader-logo h2 { font-size: 24px; line-height: 32px; margin-bottom: 10px;}
    .signin-step-form form .form-group .text-muted{font-size: 14px;}


    .dashboard-top-section .highcharts-section .highcharts-container{width: 100% !important; height: auto !important;}
    .dashboard-top-section .highcharts-section .highcharts-container .highcharts-root {width: 100%; max-width: 100%; height: auto;}
    .dashboard-top-section .nav-nav-tabs ul{margin: 0 0; padding: 0 6px;}
    .dashboard-top-section .nav-nav-tabs ul li, .dashboard-top-section .nav-nav-tabs.ui-admin-tiles ul li{width:25%;}
    .dashboard-top-section .subheader .grafdownload{margin-right: 15px;}
    .user-status-wrap .grid-margin .user-status-box{margin: 0 0 15px 0;}
    .dashboard-top-section .nav-nav-tabs ul li a h3 {font-size: 26px; line-height: 45px;}
    .user-status-bottom .user-status-inner .row {margin: 0;}
    .user-status-bottom .user-status-inner .col-md-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    .user-status-bottom .user-status-inner .highcharts-container {width: 100% !important; height: auto !important;}
    .user-status-bottom .user-status-inner .highcharts-container .highcharts-root {width: 100%; height: auto; max-width: 100%;}

    .iu-table table td .select2 .selection .select2-selection{min-width: 100px;}
    .iu-table table tbody tr td a > .glyphicon{right:0;}
    .animated {width: 50%; flex: 0 0 50%; max-width: 50%;}
    .header .header-inner .navbar .navbar-nav li:last-child{padding-right: 15px;}
    .iu-table table tbody tr td{min-width: 189px;}

}
@media (min-width:992px) and (max-width:1199px) {
    .domain-view .tabs-above .nav-tabs:after, .domain-view .tabs-above .nav-tabs:before{display: none}
    .tab-pane ul.sortable li {width: 25%; max-width: 25%; flex: 0 0 25%;}
    .tab-pane ul.sortable li.sortable-placeholder {width: 25%; max-width: 25%; flex: 0 0 25%;}

    .dashboard-top-section .highcharts-section .highcharts-container{width: 100% !important; height: auto !important;}
    .dashboard-top-section .highcharts-section .highcharts-container .highcharts-root {width: 100%; max-width: 100%; height: auto;}
    .dashboard-top-section .nav-nav-tabs ul{margin: 0 0; padding: 0 6px;}
    .dashboard-top-section .nav-nav-tabs ul li, .dashboard-top-section .nav-nav-tabs.ui-admin-tiles ul li{width:25%;}
    .dashboard-top-section .subheader .grafdownload{margin-right: 15px;}
    .user-status-wrap .grid-margin .user-status-box{margin: 0 0 15px 0;}
    .dashboard-top-section .nav-nav-tabs ul li a h3 {font-size: 26px; line-height: 45px;}
    .user-status-bottom .user-status-inner .highcharts-container {width: 100% !important; height: auto !important;}
    .user-status-bottom .user-status-inner .highcharts-container .highcharts-root {width: 100%; height: auto; max-width: 100%;}
    .user-status-bottom .user-status-inner .highcharts-container .highcharts-root .highcharts-legend-item text{font-size: 13px !important;}
    .user-status-bottom .user-status-inner .highcharts-container .highcharts-root tspan {font-size: 12px;}
    .iu-table table td .select2 .selection .select2-selection{min-width: 100px;}
    .iu-table table tbody tr td a > .glyphicon{right:0;}
    .iu-table{overflow: auto}
    .iu-table table tbody tr td{min-width: 189px;}
}
@media (min-width:1200px) and (max-width:1300px) {
    .iu-table{overflow: auto}
    .user-index.iu-table table tbody tr td:nth-child(4){min-width: 189px;}
    .user-index.iu-table table tbody tr td:nth-child(5){min-width: 189px;}
    .user-index.iu-table table tbody tr td:nth-child(6){min-width: 189px;}
    .user-index.iu-table table tbody tr td:nth-child(8){min-width: 189px;}
    .activity-index.iu-table table tbody tr td:nth-child(1){min-width: 189px;}
    .activity-index.iu-table table tbody tr td:nth-child(2){min-width: 189px;}
    .activity-index.iu-table table tbody tr td:nth-child(3){min-width: 200px;}
}