@media screen and (max-width: 1399px) {
}
@media screen and (max-width: 1199px) {
    .navbar .navbar-nav .nav-link {
        font-size: 14px;
        padding-left: 25px;
        padding-right: 25px;
    }
    .navbar .navbar-nav .nav-link.nav-login {
        padding-right: 0;
        padding-left: 20px;
        margin-left: 10px;
    }
    footer, footer a, footer p {
        font-size: 14px;
    }
    footer h5 {
        font-size: 16px;
        margin-bottom: 15px;
    }
    .dropdown-search {
        min-width: 180px;
    }
    .card-ss .thumb-ssdt {
        min-width: 80px;
        width: 80px;
    }
    .card-ss .thumb-ssdt strong {
        font-size: 12px;
    }
    .card-ss ul li, .card-ss .btn-red {
        font-size: 14px;
    }
    .nav-tabs-pi.nav-tabs .nav-link {
        font-size: 22px;
    }
    .search-page .dm-search {
        width: 895px;
    }
    .list-popular.col-md-4 {
        width: 25%;        
    }
    .news-information .list-popular {
        min-width: 275px;
    }
}
@media screen and (max-width: 991px) {
    .list-popular.col-md-4 {
        width: 33.333333333%;        
    }
    .navbar .navbar-nav .nav-link {
        font-size: 14px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .nav-tabs-pi.nav-tabs .nav-link {
        font-size: 16px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .navbar .navbar-nav .nav-link.nav-login {
        padding-right: 0;
        padding-left: 20px;
        margin-left: 5px;
    }
    .container {
        max-width: 96%;
    }
    .logo img {
        max-height: 40px;
    }
    .logo-cariyanlik img {
        max-height: 25px;
    }
    .nav-bottom .navbar-nav .nav-item {
        padding: 0 10px;
    }
    .searching-middle h3 {
        font-size: 18px;
    }
    .post-left {
        min-width: 210px;
        width: 210px;
        margin-right: 20px;
    }
    .lp-contact .post-right .left-post {
        display: block;
    }
    .lp-contact .post-right .post-right {
        margin-top: 30px;
    }
    .lp-contact .post-left {
        margin-right: 0;
    }
    .acs-modal .modal-dialog {
        max-width: 750px;
    }
    .dm-search {
        left: 0 !important;
        width: 100%;
    }
    .search-page .dm-search {
        left: -18px !important;
        width: calc(100% - 45px);
    }
    .news-information .list-popular {
        min-width: 215px;
    }
}
@media screen and (max-width: 767px)  {
    .list-unit-pelayanan h4 {
        font-size: 14px;
    }
    .fs-14-md {
        font-size: 14px;
    }
    .nav-tabs-pi.nav-tabs {
        justify-content: center;
    }
    .banner-detail .img-top {
        height: 300px;
    }
    .acs-modal .modal-dialog {
        max-width: 400px;
    }
    .acs-modal .desc {
        display: none !important;
    }
    .d-none-m {
        display: none;
    }
    .nav-bottom {
        display: none;
    }
    .navbar {
        background: #fff;
        box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
    }
    .navbar .container {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .nav-mobile {
        margin-left: auto;
        display: block;
    }
    .nav-mobile label, .nav-mobile a, .head-navm a, .head-navm label {
        box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
        background: #fff;
        color: var(--red);
        display: inline-block;
        padding: 10px;
        border-radius: 5px;
        margin-left: 10px;
    }
    .nav-menu-mobile {
        position: absolute;
        top: 0;
        height: 100vh;
        width: 300px;
        z-index: 999;
        background: #fff;
        display: flex;
        flex-direction: column;
        left: -300px;
        transition: ease all .2s;
        box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
    }
    input#nav_mobile[type=checkbox]:checked ~ .nav-menu-mobile {
        left: 0;
    }
    .head-navm {
        display: flex;
        align-items: center;
        padding: 11px;
    }
    .head-navm a, .head-navm label {
        padding: 7px;
        width: 40px;
        height: 40px;
        text-align: center;
    }
    .head-navm .logo-cariyanlik img {
        max-height: 30px;
    }
    .head-navm .logo-cariyanlik {
        border: 0;
        padding: 0;
        margin: 0;
        box-shadow: none;
        background: none;
    }
    .body-navm {
        overflow: auto;
        height: 100%;
        padding: 11px;
        display: flex;
        flex-direction: column;
    }
    .body-navm a {
        font-size: 20px;
        padding: 5px 0;
        text-decoration: none;
        font-weight: 400;
    }
    .body-navm a.active {
        color: var(--red);
    }
    .body-navm .submenu {
        display: flex;
        flex-direction: column;
        background: var(--red);
        padding: 5px 11px;
    }
    .body-navm .submenu a {
        color: #fff;
        font-size: 16px;
    }
    .body-navm .submenu a.active {
        color: rgba(255, 255, 255, .5);
    }
    .footer-navm {
        display: flex;
        flex-direction: column;
        padding: 11px;
    }
    .footer-navm a {
        font-size: 16px;
        padding: 5px 0;
        text-decoration: none;
        font-weight: 400;
        display: flex;
        align-items: center;
        color: var(--red);
    }
    .footer-navm a img {
        margin-right: 10px;
        width: 18px;
    }
    .footer-navm a.nav-login {
        background: var(--red);
        color: #fff;
        text-align: center;
        justify-content: center;
        border-radius: 5px;
        padding-top: 7px;
        padding-bottom: 7px;
    }
    .footer-navm a.nav-login img {
        filter: brightness(0) invert(1);
    }
    footer .footer-bottom {
        font-size: 12px;
        font-weight: 300;
    }
    footer h5 {
        font-size: 20px;
    }
    .owl-carousel .owl-item .slide {
        overflow: hidden;
        position: relative;
    }
    .owl-carousel .owl-item .slide img {
        position: absolute;
        left: 50%;
        top: 50%;
        height: 100%;
        width: auto;
        max-width: none;
        max-height: none;
        -webkit-transform: translate(-50%,-50%);
          -ms-transform: translate(-50%,-50%);
              transform: translate(-50%,-50%);
    }
    .hero-slider .owl-prev, .hero-slider .owl-next {
        width: 40px !important;
        height: 40px !important;
        margin-top: -20px !important;
    }
    .slide p {
        display: none;
    }
    .desc-slide {
        padding-left: 50px;
        padding-right: 50px;
    }
    .slide h2 {
        font-size: 22px;
        margin: 0;
    }
    .c-slider-index {
        max-width: 100%;
        padding: 0;
    }
    .hero-slider {
        margin-top: 0;
    }
    .category-pp, .public-service {
        padding-top: 20px;
        padding-bottom: 10px;
    }
    .title-section {
        font-size: 22px;
    }
    .category-pp .list-3r li:last-child {
        text-align: center;
    }
    .category-pp .list-3r li:last-child a {
        display: inline-flex;
        font-weight: 400;
        padding-left: 25px;
        padding-right: 25px;
        margin-top: 10px;
    }
    .container {
        max-width: 100%;
    }
    .searching-middle h3 {
        display: none;
    }
    .dropdown-search {
        display: none;
    }
    .d-flex.w-100.ps-4 {
        padding-left: 0 !important;
    }
    .title-list-ps span {
        font-size: 20px;
    }
    .title-list-ps a {
        font-size: 14px;
    }
    .thumb-top-ni .desc h5 {
        font-size: 20px;
    }
    .thumb-top-ni .desc p, .thumb-top-ni .desc span {
        font-size: 13px;
    }
    .news-information .list-intro .card-ps .thumb-ps {
        min-width: 130px;
        width: 130px;
        min-height: 130px;
    }
    .news-information .list-intro .card-ps .desc-ps {
        line-height: normal;
    }
    .news-information .list-intro .card-ps .desc-ps span {
        display: none;
    }
    .news-information .list-intro .card-ps .desc-ps h3 {
        font-size: 18px;
    }
    .news-information .list-intro .card-ps .desc-ps i,
    .news-information .list-intro .card-ps .desc-ps p {
        font-size: 13px;
        line-height: normal;
    }
    .sippn-ig {
        padding-top: 20px;
    }
    .lp-contact, .left-post {
        display: block;
    }
    .post-left {
        margin-right: 0;
        margin-bottom: 20px;
    }
    .f-nav-left {
        margin-bottom: 15px;
    }
    .f-nav-left li a {
        font-size: 16px;
    }
    .title-help-center {
        font-size: 24px;
    }
    .breadcrumb {
        display: none;
    }
    .list-ni {
        display: block;
    }
    .news-information .list-popular,
    .list-popular {
        width: 100%;
        margin-left: 0;
        margin-top: 30px;
    }
    .news-information .list-popular {
        margin-top: 30px !important;
    }
    p.fs-22, .date-news-dtl, .foot-dtl {
        font-size: 16px !important;
    }
    .title-news-dtl {
        font-size: 28px;
        margin-bottom: 0;
    }
    .nav-tabs-pi.nav-tabs .nav-link {
        font-size: 18px;
    }
    .c-banner-pi {
        padding: 0;
    }
    .banner-detail {
        font-size: 14px;
    }
    .img-top {
        height: 250px;
        position: relative;
        overflow: hidden;
    }
    .img-top img {
        position: absolute;
        left: 50%;
        top: 50%;
        height: 100%;
        width: auto !important;
        -webkit-transform: translate(-50%,-50%);
          -ms-transform: translate(-50%,-50%);
              transform: translate(-50%,-50%);
    }
    .banner-detail h4 {
        font-size: 18px;
    }
    .banner-detail svg {
        width: 18px;
        min-width: 18px;
    }
    .banner-detail .card .card-body .thumb {
        min-width: 70px;
        width: 70px;
        margin-right: 15px;
        margin-left: 0;
    }
    .banner-detail .card {
        left: 15px;
        right: 15px;
    }
    .acc-pi .accordion-button {
        font-size: 18px;
    }
    .acc-pi .accordion-item .accordion-body .accordion-button {
        font-size: 14px;
    }
    .thumb-acc, .thumb-survey {
        width: 50px;
        min-width: 50px;
        margin-right: 15px;
    }
    .acc-pi .accordion-item .accordion-body .accordion-button .thumb-acc {
        width: 40px;
        min-width: 40px;
    }
    .btn-search-new {
        display: block;
        position: fixed;
        background: #fff;
        padding: 10px 15px;
        box-shadow: 0px 1px 2px 1px rgba(0, 0, 0, 0.1);
    }
    .btn-search-new-close {
        background: #fff;
        padding: 6px 0;
    }
    .f-search-left {
        left: -300px;
        transition: ease all .2s;
    }
    input[type=checkbox]:checked ~ .f-search-left {
        left: 0;
    }
    .maps-survey {
        display: none;
    }
    .card-survey .card-body h5 {
        font-size: 14px !important;
    }
    .card-survey .card-body h4 {
        font-size: 18px;
    } 

}
@media screen and (max-width: 575px)  {
    .acs-modal .modal-dialog {
        max-width: 100%;
    }
    .acs-modal h4 {
        font-size: 16px;
    }
    .banner-detail .card .card-body .thumb {
        min-width: 50px;
        width: 50px;
        margin-right: 10px;
    }
    .banner-detail {
        font-size: 12px;
    }
    .banner-detail h4 {
        font-size: 16px;
    }
    .navbar .container {
        padding: 5px;
    }
    .navbar-brand.logo {
        margin-right: 10px;
    }
    .navbar-brand.logo img {
        max-height: 30px;
    }
    .logo-cariyanlik {
        padding-left: 10px;
        margin-right: 0;
    }
    .nav-mobile label, .nav-mobile a, .head-navm a, .head-navm label {
        padding: 8px;
        margin-left: 5px;
    }
    .logo-cariyanlik img {
        max-height: 20px;
    }
    .list-3r {
        display: block;
    }
    .list-3r li {
        padding-bottom: 5px;
    }
    .category-pp .list-3r li a {
        padding: 8px 17px;
        font-size: 14px;
    }
    .thumb-top-ni {
        height: 250px;
        background: #ccc;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .thumb-top-ni img {
        height: 100%;
        width: auto;
    }
    .title-list-ps a {
        font-size: 12px;
    }
    .nav-tabs-pi.nav-tabs .nav-link {
        font-size: 14px;
    }
    .survey-tabs {
        display: block !important;
    }
    .survey-tabs .nav {
        margin-right: 0 !important;
    }
}
@media screen and (max-width: 439px)  {
    .p-abs {
        display: none;
    }
    #widget-survei {
        width: auto;
        left: 15px;
        bottom: 15px;
        right: 15px;
    }
    .slide .card {
        padding: 10px;
    }
    .slide .card h2 {
        font-size: 18px;
    }
    .card-ss .thumb-ssdt {
        min-width: 60px;
        width: 60px;
    }
    .card-ss .thumb-ssdt strong {
        font-size: 10px;
    }
    .card-ss ul li {
        font-size: 14px;
    }
    .card-ss .btn-red {
        font-size: 14px;
    }
}