@media only screen and (max-width: 991px) {
    /*Layouting Mobile*/
    .mb-mbl-default {
        margin-bottom: 20px!important;
    }
    .pl-mbl-default {
        padding-left: 15px!important;
    }

    /*---- Home ----*/
    .landingpage {
        max-height: 30vh!important;
    }
    .bg-img .item img {
        top: 0!important;
    }
    #about-slider  {
        min-height: 0;
        width: auto!important;
    }
    #about-slider img {
        height: auto;
    }
    .home-content {
        margin: 15px!important;
    }
    .judul {
        font-size: 20px;
        line-height: 25px;
    }
    .owl-carousel .owl-stage-outer {
        overflow: hidden!important;
    }
    /*---- Breadcrumb ----*/
    .breadcrumb {
        padding-left: 15px!important;
    }
    /*---- Produk ----*/
    .blog {
        background: transparent;
    }
    /*---- Profil ----*/
    .rw-rspnsv {
        padding-right: 15px!important
    }
    .rw-rspnsv img {
        padding-bottom: 10px;
    }
    .row-indikator {
        flex-direction: column;
    }
    .navbar-brand h6{
        font-size: 11px;
        color:#fff;
    }

}
@media only screen and (min-width: 1024px) and (min-width: 768px) {
   
    img.indikator {
       width: 728px;
       /* margin-left: -5px;*/
    }
    /* .col-md-2.col-sm-2 {
        margin-left:-38px;
        
    } */  
    /* .col.col-md-3.col-xs-4.mb-4 {
        margin-top: -10px;
    }
    .col.col-md-2.col-xs-4.mb-4 {
        margin-top: -9px;
    } */
   
}
.title {
    font-size: 2rem;
    margin-left: 33px;
}

img.indikator {
    width: 728px;
    /* margin-left: -5px;*/
 }
 
 .form-group.text-left {
     margin-top: 0px;
     margin: 4px 10px;
 }
 .title {
    font-size: 2rem;
    margin-left: 33px;
}
.title h1{
    color: var(--accent-color);
    font-size: 29px;
    margin-bottom: .5rem;
    margin-left: -46px;
}
.btn-indikator{
    padding: 5px 10px!important;
    margin-left: -29px;
    /* margin-top: 4px; */
}
/* .col-md-12.col-sm-12 {
    margin-left: 28px;
} */

@media only screen and (max-width: 1024px) {
 /* label.kabupaten {
     margin-left: -104px;
 } */
 /* label.kapanewon {
     margin-left: -104px;
 } */
 .btn-purple{
    background: var(--accent-color);
    color:#fff;
    border-radius: 5px;
   /*margin-top: 100px;*/
   margin-left: -2px;
   /* width: 95%; */
}
 .title h1{
    color: var(--accent-color);
    font-size: 29px;
    margin-bottom: .5rem;
    margin-left: -25px;
}
.icon {
    margin-bottom: 20px;
    padding: 15px;
    /*height: 260px;*/
    margin-left: 2px;
    width: 78%;
    margin-top: 61px;
}

}
@media only screen and (max-width: 1366px) {
    .title h1{
        color: var(--accent-color);
        font-size: 29px;
        margin-bottom: .5rem;
        margin-left: -46px;
    }
    p.penjelasan{
        margin-left: -59px;
    } 

}
@media only screen and (max-width: 1366px) and (min-width: 1024px) {
 .produk-desa .card-product {
     height: 310px;
 }
 

 /* label.kabupaten {
     margin-left: -104px;
 }
 label.kapanewon {
     margin-left: -104px;
 } */
 .form-group.text-left {
     /* display: initial; */
     margin-top: -20px;
 }
 /*.desa-indikator {
     margin-left: -80px;
 }*/
 img.indikator {
     width: 911px;
     /*margin-left: -5px;*/
 }
 .icon {
     margin-bottom: 20px;
     padding: 15px;
     /*height: 260px;*/
     margin-left: 21px;
     width: 78%;
     margin-top: 94px;
     margin-left: inherit;
 }
 .modal-indikator{
     width: 710px!important;
 }
 .btn-indikator{
     padding: 5px 10px!important;
     margin-left: -27px;
     margin-top: -6px;
 }
 .pb-5 {
     padding-bottom: 1rem;
 }
 .section-heading {
     background: #191919;
     color: #fff;
     position: relative;
     padding-top: 0;
      padding-bottom: 0; 
     margin-top: 0;
 }
 .media-body h3{
     font-size: 22px;
 }
 .media-body h4{
     font-size: 14px
 }
 .article {
     line-height: 2;
     font-size: 14px;
     margin-left: -16px;
 }
 .row-bestselling-product {
     width: auto;
     padding-bottom: 0;
 }
 .card-product .image {
     overflow: hidden;
     height: 170px;
 }
 .navbar-brand .logo, .navbar-brand .logo-alt {
     max-height: 40px!important;
 }
 .md-padding {
     padding-top: 50px;
     padding-bottom: 0;
 }
 .sm-padding {
     padding-top: 68px;
 }
 /*.icon {
     margin-bottom: 20px;
     padding: 15px;
     /*height: 260px;*/
     /*margin-left: 2px;*/
     /*width: 78%;
     /*margin-top: -180px;*/
/* }*/
 .row-indikator .row{
     padding-bottom: 1rem;
 }
 .title {
     color: var(--accent-color);
 font-size: 29px;
 margin-bottom: .5rem;
/*margin-left: 60px;*/
 }
 /* .title h1{
    color: var(--accent-color);
    font-size: 29px;
    margin-bottom: .5rem;
    margin-left: -61px;
}
p.penjelasan{
    margin-left: -59px;
}  */
 .isi {
     margin-left: 263px;
 }
 .row-produk-slider {
     width: auto;
 }
 .judul-produk{
     text-align: center;
 }
 .indikator-pd{
     padding-bottom: 0;
 }

 #deskripsi p{
     text-align: justify;
 }

 #deskripsi h2{
     font-size: 25px;
 }
 .card-product .image img {
     width: 100%;
     object-fit: cover;
 }
 /*.container {
     width: 100%;
 }*/
 .card-product .image img {
     width: 100%;
     object-fit: cover;
     height: 140px;
 }
 .card-product .img-produk img {
     width: 100%;
     object-fit: cover;
     height: 170px;
 }
 
}

@media only screen and (max-width: 1366px) and (min-width: 1024PX) {
    /* .form-group.text-left {
        width: 178px;
        margin-left: -359px;
    }
    .col.mb-4 {
        margin-left: -188px;
    } */
  
    .form-group.text-left {
        margin-left: 9px;
        margin-top: -4px;
    }
    .col mb-4 {
        margin-top: -2px;
    }
}
@media only screen and (max-width:450px) {
	.filter-profil {
        flex-direction: column;
        justify-content: space-between;
	}
    .col-auto.mb-4 {
        width: 220px;
    }
    .btn-purple{
        background: var(--accent-color);
        color:#fff;
        border-radius: 5px;
       /*margin-top: 100px;*/
       margin-left: 6px;
    }
    .mt-4.form-group.text-left {
        margin-left:-7px;
    }
    .select-box {
        margin-bottom: 0.3rem!important;
    }
}

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2)  and (orientation: landscape)  {
    .produk-desa .card-product {
        height: 310px;
    }
   
   
    .col.col-md-2.col-xs-8.mb-4 {
        margin-top: -93px;
    }
  
    /* label.kabupaten {
        margin-left: -104px;
    }
    label.kapanewon {
        margin-left: -104px;
    } */
    /* .form-group.text-left {
        display: initial; 
        margin-top: -1px;
    } */
    .desa-indikator {
        margin-left: -80px;
    }
    img.indikator {
        width: 911px;
        /*margin-left: -5px;*/
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 21px;
        width: 78%;
        /*margin-top: -180px;*/
    }
    .modal-indikator{
        width: 710px!important;
    }
    .btn-indikator{
        padding: 5px 10px!important;
        margin-left: -21px;
    }
    .pb-5 {
        padding-bottom: 1rem;
    }
    .section-heading {
        background: #191919;
        color: #fff;
        position: relative;
        padding-top: 0;
         padding-bottom: 0; 
        margin-top: 0;
    }
    .media-body h3{
        font-size: 22px;
    }
    .media-body h4{
        font-size: 14px
    }
    .article {
        line-height: 2;
        font-size: 14px;
        margin-left: -16px;
    }
    .row-bestselling-product {
        width: auto;
        padding-bottom: 0;
    }
    .card-product .image {
        overflow: hidden;
        height: 170px;
    }
    .navbar-brand .logo, .navbar-brand .logo-alt {
        max-height: 40px!important;
    }
    .md-padding {
        padding-top: 50px;
        padding-bottom: 0;
    }
    .sm-padding {
        padding-top: 68px;
    }
    /*.icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        /*margin-left: 2px;*/
        /*width: 78%;
        /*margin-top: -180px;*/
   /* }*/
    .row-indikator .row{
        padding-bottom: 1rem;
    }
    .title {
        color: var(--accent-color);
    font-size: 29px;
    margin-bottom: .5rem;
   /*margin-left: 60px;*/
    }
    .isi {
        margin-left: 263px;
    }
    .row-produk-slider {
        width: auto;
    }
    .judul-produk{
        text-align: center;
    }
    .indikator-pd{
        padding-bottom: 0;
    }

    #deskripsi p{
        text-align: justify;
    }

    #deskripsi h2{
        font-size: 25px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
    }
    /*.container {
        width: 100%;
    }*/
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 140px;
    }
    .card-product .img-produk img {
        width: 100%;
        object-fit: cover;
        height: 170px;
    }
}

@media screen and (device-aspect-ratio: 40/71) {
    .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 25%;
    }
    .modal-dialog.modal-indikator {
        display: contents;
    }
    /* .col-sm-4.col-xs-12 {
        margin-left: 100px;
    } */
    .col.col-md-2.col-xs-4.mb-4 {
        margin-top: -74px;
        margin-left: -11px;
    }
    .col.col-md-3.col-xs-4.mb-4 {
        margin-top: -34px;
    }
    img.indikator {
        width: 339px;
        margin-left: -5px;
    }
    p:last-of-type {
        /*margin-bottom: 0;*/
        margin-left: 3px;
    }
    .nav-collapse {
        padding-right: 2rem;
    }
}

/*Tes*/

@media screen and (max-width: 731px) and (min-width: 411px){
    img.indikator {
        width: 389px;
       /* margin-left: -5px;*/
    }
}

@media screen and (max-width: 360px) {
   /* img.indikator {
        width: 392px;
        margin-left: -5px;
    }*/
}

@media only screen and (max-width: 640px){
    /*img.indikator {
        width: 392px;
        margin-left: -5px;
    }*/
    .col-sm-4.col-xs-12 {
        margin-left: 100px;
        width: 100px;
    }
}

@media only screen and (max-width: 768px) {
	.navbar-brand .logo, .navbar-brand .logo-alt {
    	max-height: 40px!important;
	}
    .mt-4.form-group.text-left {
        margin-left:-7px;
    }
   
    /* .col-sm-4.col-xs-12 {
        margin-left: 100px;
    } */
    /* .desa-indikator {
        width: 339px;
        margin-left: -127px;
    } */
    img.logo-dana {
        width: 124px;
    }
    p.penjelasan{
        margin-left: -23px;
    } 
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: -19px;
        width: 69%;
        /*margin-top: -180px;*/
    }
    .list-group-item {
        position: relative;
        display: block;
        padding: 10px;
        background-color: #fff;
        border: 1px solid rgba(0,0,0,.125);
    }
    .list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
        z-index: 2;
        color: #fff;
        background-color: var(--accent-color);
        border-color: #fff;
        font-size: 14px;
    }
    .kelompok .card-product .image {
        overflow: hidden;
        height: 170px;
    }
    .kelompok .card-footer {
        padding: 10px;
    }
    .card-product .harga {
        color: #EF6E0D;
        font-weight: bold;
        font-size: 12px;
    }
    .btn-detail{
        margin-left: -15px;
    }
    .produk-desa .card-product {
        height: 325px;
    }
    .produk-desa .card-product .image {
        overflow: hidden;
        height: auto;
    }
    .produk-desa .card-footer {
        padding: 10px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 180px;
    }

    .profil-text{
        margin-bottom: 50px!important;
    }
}
@media only screen and (max-width: 667px) {
    .produk-desa .card-product {
        height: 310px;
    }
 img.indikator {
        width: 339px;
        margin-left: -5px;
        margin-top: 21px;
    }*/
    .modal-indikator{
        width: 710px!important;
    }
    .btn-indikator{
        padding: 5px 10px!important;
    }
    .pb-5 {
        padding-bottom: 1rem;
    }
    .section-heading {
        background: #191919;
        color: #fff;
        position: relative;
        padding-top: 0;
         padding-bottom: 0; 
        margin-top: 0;
    }
    .media-body h3{
        font-size: 22px;
    }
    .media-body h4{
        font-size: 14px
    }
    .article {
        line-height: 2;
        font-size: 14px;
        margin-left: -15px;
    }
    .row-bestselling-product {
        width: auto;
        padding-bottom: 0;
    }
    .card-product .image {
        overflow: hidden;
        height: 170px;
    }
    .navbar-brand .logo, .navbar-brand .logo-alt {
        max-height: 40px!important;
    }
    .md-padding {
        padding-top: 50px;
        padding-bottom: 0;
    }
    .sm-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    /*.icon {
        margin-bottom: 20px;
        padding: 15px;
        height: 260px;
    }*/
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 70px;
        width: 78%;
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 2px;
        width: 78%;
        margin-top: -22px;
    }
    .row-indikator .row{
        padding-bottom: 1rem;
    }
    .title {
        font-size: 2rem;
        margin-left: 33px;
    }
    .title h1{
        color: var(--accent-color);
        font-size: 29px;
        margin-bottom: .5rem;
        margin-left: -25px;
    }
    .row-produk-slider {
        width: auto;
    }
    .judul-produk{
        text-align: center;
    }
    .indikator-pd{
        padding-bottom: 0;
    }

    #deskripsi p{
        text-align: justify;
    }

    #deskripsi h2{
        font-size: 25px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
    }
    .container {
        width: 100%;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 140px;
    }
    .card-product .img-produk img {
        width: 100%;
        object-fit: cover;
        height: 170px;
    }
}

/*@media only screen and (max-width: 568px) {
    .total p b {
        font-size: 11px;
    }
    img.indikator {
        width: 339px;
        margin-left: -5px;
    }
    .btn-purple {
        font-size: 9px;
        margin-left: 1px;
    }
    .title h1 {
        margin-left: -31px;
    }
    .navbar-brand h6 {
        font-size: 9px;
        color: #fff;
        margin-top: 10px;
    }
    .navbar-brand img {
        width: auto;
        height: 50px;
        object-fit: contain;
        margin: -10px 10px 0 0;
    }
    .card-product p {
        font-size: 9px!important;
        color: #000;
        margin-bottom: 1rem;
    }
    .filter-profil label {
        font-size: 8px;
    }
    .profil-text {
        font-size: 10px;
    }
    .moto-profil {
        font-size: 13px;
        margin: -15px 0;
    }
    .modal-indikator {
        width: 300px!important;
    }
    .jumlah h3 {
        font-weight: bold;
        color: #EF6E0D;
        font-size: 16px;
    }
    .modal-indikator td {
        font-size: 10px;
    }
    .media-body h4 {
        font-size: 11px;
    }
    .title h1 {
        color: var(--accent-color);
        font-size: 18px;
        margin-bottom: 0rem;
        margin-left: -35px;
    }
}//
/*@media only screen 
  and (min-width: 992px) 
  and (max-height: 1024px)  {
    .row-indikator {
        flex-direction: row;
    }
}*/

/*@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
      .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 30%;
    }
}*/

@media screen and (device-aspect-ratio: 40/71) {
    .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 25%;
    }
    .col-sm-4.col-xs-12 {
        margin-left: 77px;
    }
    .row.text-center.filter-profil {
        margin-top: 60px;
    }
    .form-group.text-left {
        margin-top: 10px;
    }
     img.indikator {
        width: 303px;
        margin-left: -1px;
    }
    @media only screen and (max-width: 991px) {
    /*Layouting Mobile*/
    .mb-mbl-default {
        margin-bottom: 20px!important;
    }
    .pl-mbl-default {
        padding-left: 15px!important;
    }

	/*---- Home ----*/
	.landingpage {
    	max-height: 30vh!important;
	}
    .bg-img .item img {
        top: 0!important;
    }
    #about-slider  {
        min-height: 0;
        width: auto!important;
    }
    #about-slider img {
        height: auto;
    }
	.home-content {
		margin: 15px!important;
	}
	.judul {
		font-size: 20px;
    	line-height: 25px;
	}
	.title {
    	font-size: 2rem;
    	padding-left: 10px;
    }
    .owl-carousel .owl-stage-outer {
    	overflow: hidden!important;
    }
    /*---- Breadcrumb ----*/
    .breadcrumb {
    	padding-left: 15px!important;
    }
    /*---- Produk ----*/
    .blog {
    	background: transparent;
    }
    /*---- Profil ----*/
    .rw-rspnsv {
    	padding-right: 15px!important
    }
    .rw-rspnsv img {
    	padding-bottom: 10px;
    }
    .row-indikator {
        flex-direction: column;
    }
    .navbar-brand h6{
        font-size: 11px;
        color:#fff;
    }
}
@media only screen and (max-width: 1366px) {
	.navbar-brand .logo, .navbar-brand .logo-alt {
    	max-height: 40px!important;
	}
    /* .desa-indikator{
        margin-left: -78px;
    } */
    .btn-purple{
        background: var(--accent-color);
        color:#fff;
        border-radius: 5px;
       /*margin-top: 100px;*/
       margin-left: 40px;
       /* width: 95%; */
    }
    .list-group-item {
        position: relative;
        display: block;
        padding: 10px;
        background-color: #fff;
        border: 1px solid rgba(0,0,0,.125);
    }
    .list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
        z-index: 2;
        color: #fff;
        background-color: var(--accent-color);
        border-color: #fff;
        font-size: 14px;
    }
    .kelompok .card-product .image {
        overflow: hidden;
        height: 170px;
    }
    .kelompok .card-footer {
        padding: 10px;
    }
    .card-product .harga {
        color: #EF6E0D;
        font-weight: bold;
        font-size: 12px;
    }
    .btn-detail{
        margin-left: -15px;
    }
    .produk-desa .card-product {
        height: 325px;
    }
    .produk-desa .card-product .image {
        overflow: hidden;
        height: auto;
    }
    .produk-desa .card-footer {
        padding: 10px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 180px;
    }

    .profil-text{
        margin-bottom: 50px!important;
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 2px;
        width: 78%;
        /*margin-top: -180px;*/
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 2px;
        width: 78%;
        /*margin-top: -180px;*/
    }
}
@media only screen and (max-width: 568px) {
    .total p b {
        font-size: 11px;
    }
    .btn-purple {
        font-size: 9px;
    }
    .navbar-brand h6 {
        font-size: 9px;
        color: #fff;
        margin-top: 10px;
    }
    .navbar-brand img {
        width: auto;
        height: 50px;
        object-fit: contain;
        margin: -10px 10px 0 0;
    }
    .card-product p {
        font-size: 9px!important;
        color: #000;
        margin-bottom: 1rem;
    }
    .filter-profil label {
        font-size: 8px;
    }
    .profil-text {
        font-size: 10px;
    }
    .moto-profil {
        font-size: 13px;
        margin: -15px 0;
    }
    .modal-indikator {
        width: 300px!important;
    }
    .jumlah h3 {
        font-weight: bold;
        color: #EF6E0D;
        font-size: 16px;
    }
    .modal-indikator td {
        font-size: 10px;
    }
    .media-body h4 {
        font-size: 11px;
    }
    .title h1 {
        color: var(--accent-color);
        font-size: 18px;
        margin-bottom: 0rem;
    }
}
@media only screen and (max-width: 640px) {
    .produk-desa .card-product {
        height: 310px;
    }
    /* .desa-indikator {
        width: 339px;
        margin-left: -127px;
    } */
    .modal-indikator{
        width: 710px!important;
    }
    .btn-indikator{
        padding: 5px 10px!important;
    }
    .pb-5 {
        padding-bottom: 1rem;
    }
    .section-heading {
        background: #191919;
        color: #fff;
        position: relative;
        padding-top: 0;
         padding-bottom: 0; 
        margin-top: 0;
    }
    .media-body h3{
        font-size: 22px;
    }
    .media-body h4{
        font-size: 14px
    }
    .article {
        line-height: 2;
        font-size: 14px;
        margin-left: -15px;
    }
    .row-bestselling-product {
        width: auto;
        padding-bottom: 0;
    }
    .card-product .image {
        overflow: hidden;
        height: 170px;
    }
    .navbar-brand .logo, .navbar-brand .logo-alt {
        max-height: 40px!important;
    }
    .md-padding {
        padding-top: 50px;
        padding-bottom: 0;
    }
    .sm-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        height: 260px;
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 70px;
        width: 78%;
    }
    .icon {
        margin-bottom: 20px;
        padding: 15px;
        /*height: 260px;*/
        margin-left: 2px;
        width: 78%;
        /*margin-top: -180px;*/
    }
    .row-indikator .row{
        padding-bottom: 1rem;
    }
    .title {
        font-size: 2rem;
        padding-left: 0;
        margin-left: 55px;
    }
    .title h1{
        color: var(--accent-color);
        font-size: 29px;
        margin-bottom: .5rem;
        margin-left: 210px;
    }
    
    p:last-of-type {
    /*margin-bottom: 0;*/
    margin-left: 3px;
    }
    .mt-4.form-group.text-left {
        margin-left: -1px;
    }
    .row-produk-slider {
        width: auto;
    }
    .judul-produk{
        text-align: center;
    }
    .indikator-pd{
        padding-bottom: 0;
    }

    #deskripsi p{
        text-align: justify;
    }

    #deskripsi h2{
        font-size: 25px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
    }
    .container {
        width: 100%;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 140px;
    }
    .card-product .img-produk img {
        width: 100%;
        object-fit: cover;
        height: 170px;
    }
}
/*@media screen 
and (min-width : 414px) 
and (max-width : 736px)
and (-webkit-device-pixel-ratio : 3)
and (orientation: portrait)
{   
  #x-section-1 {
    margin-top: 274px!important; 
  }                
}*/

@media only screen and (max-width: 1024px) {
  
}

@media only screen and (max-width: 411px) {
    .produk-desa .card-product {
        height: 301px;
    }
    /* .desa-indikator {
        margin-left: -130px;
        width: 271px;
    } */
    p.penjelasan{
        margin-left: -49px;
    } 
    .fil{
        padding-left: 0;
        width: 275px;
    }
    .modal-indikator td{
        font-size: 12px;
    }
    .modal-indikator th{
        font-size: 13px;
    }
    .modal-indikator {
        width: 395px!important;
    }
    .btn-detail {
        margin-left: 0px;
    }
    .kelompok .card-product .image {
        overflow: hidden;
        height: 175px;
    }
    .media img{
        width: 80px
    }
    .desa .media {
        display: flex;
        align-items: flex-start;
        margin-bottom: 15px;
    }
    .terkait .card-product {
        height: 240px;
        margin-bottom: 15px;
    }
    #deskripsi p{
        font-size: 14px;
        text-align: justify;
    }
    #deskripsi h2{
        font-size: 20px;
    }
    .tab-content-product {
        padding: 0;
    }
    .card-product .image {
        overflow: hidden;
        height: 270px;
    }
    .icon {
        margin-bottom: 20px;
        padding: 10px;
        height: 215px;
        margin-left: 23px;
        /*margin-top: -114px;*/
    }
    .title h1 {
        color: var(--accent-color);
        font-size: 25px;
        margin-bottom: .5rem;
    }
    .text p {
        font-size: 14px;
        margin-bottom: 1rem;
    }
    .total{
        text-align: center;
    }
    .total p b{
        font-size: 14px;
    }
    .profil-number {
        font-size: 35px;
        font-weight: bold;
        color: var(--accent-color);
        margin-top: -10px;
    }
    .btn-purple{
        font-size: 12px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 165px;
    }
    .card-product .img-home img {
        width: 100%;
        object-fit: cover;
        height: 275px;
    }
    .filter-profil label{
        font-size: 11px;
    }
    .moto-profil{
        font-size: 13px;
    }
    .profil-text{
        font-size: 14px;
    }
}
@media only screen and (max-width: 375px) {
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 150px;
    }
    .produk-desa .card-product {
        height: 281px;
    }
    .modal-indikator {
        width: 355px!important;
    }
        .card-product .img-home img {
        width: 100%;
        object-fit: cover;
        height: 275px;
    }
    .filter-profil label {
        font-size: 10px;
    }
    .profil-text {
        font-size: 12px;
    }
    .moto-profil {
        font-size: 13px;
        margin: -15px 0;
    }
}
@media only screen and (max-width: 320px) {
    .total p b {
        font-size: 11px;
    }
    .btn-purple {
        font-size: 9px;
        margin-left: 11px;
        /*margin-top: -60px;*/
    }
    .navbar-brand h6 {
        font-size: 9px;
        color: #fff;
        margin-top: 10px;
    }
    .navbar-brand img {
        width: auto;
        height: 50px;
        object-fit: contain;
        margin: -10px 10px 0 0;
    }
    .card-product p {
        font-size: 9px!important;
        color: #000;
        margin-bottom: 1rem;
        margin-left: -4px;
    }
    .filter-profil label {
        font-size: 8px;
    }
    .profil-text {
        font-size: 10px;
    }
    .moto-profil {
        font-size: 13px;
        margin: -15px 0;
    }
    .modal-indikator {
        width: 300px!important;
    }
    .jumlah h3 {
        font-weight: bold;
        color: #EF6E0D;
        font-size: 16px;
    }
    .modal-indikator td {
        font-size: 10px;
    }
    .media-body h4 {
        font-size: 11px;
    }
    .title h1 {
        color: var(--accent-color);
        font-size: 18px;
        margin-bottom: 0rem;
        margin-left: -50px;
    }
}
/*@media only screen 
  and (min-width: 992px) 
  and (max-height: 1024px)  {
    .row-indikator {
        flex-direction: row;
    }
}*/

@media only screen and (max-width: 667px) {

}

/*@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
      .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 30%;
    }
}*/

/*@media screen and (device-aspect-ratio: 40/71) {
    .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 25%;
    }
}
}*/

/*@media only screen 
  and (min-width: 992px) 
  and (max-height: 1024px)  {
    .row-indikator {
        flex-direction: row;
    }
}*/

/*@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
      .widget-search .search-btn {
        position: absolute;
        left: auto;
        right: 0;
        width: 30%;
    }
}*/

@media only screen and (max-width: 640px) {
    .produk-desa .card-product {
        height: 301px;
    }
    /*img.indikator {
        width: 339px;
        margin-left: -5px;
    }*/
    .card1.card.icon.text-center {
        margin-top: -29px;
    }
    p.penjelasan{
        margin-left: -46px;
    } 
    .fil{
        padding-left: 0;
        width: 289px;
    }
    .modal-indikator td{
        font-size: 12px;
    }
    .modal-indikator th{
        font-size: 13px;
    }
    .modal-indikator {
        width: 395px!important;
    }
    .btn-detail {
        margin-left: 0px;
    }
    .kelompok .card-product .image {
        overflow: hidden;
        height: 175px;
    }
    .media img{
        width: 80px
    }
    .desa .media {
        display: flex;
        align-items: flex-start;
        margin-bottom: 15px;
    }
    .terkait .card-product {
        height: 240px;
        margin-bottom: 15px;
    }
    #deskripsi p{
        font-size: 14px;
        text-align: justify;
    }
    #deskripsi h2{
        font-size: 20px;
    }
    .tab-content-product {
        padding: 0;
    }
    .card-product .image {
        overflow: hidden;
        height: 270px;
    }
    .icon {
        margin-bottom: 20px;
        padding: 10px;
        height: 215px;
        /*margin-top: -73px;*/
        margin-left: 16px;
    }
    .title h1 {
        color: var(--accent-color);
        font-size: 25px;
        margin-bottom: .5rem;
    }
    .text p {
        font-size: 14px;
        margin-bottom: 1rem;
    }
    .total{
        text-align: center;
    }
    .total p b{
        font-size: 14px;
    }
    .profil-number {
        font-size: 35px;
        font-weight: bold;
        color: var(--accent-color);
        margin-top: -10px;
    }
    .btn-purple{
        font-size: 12px;
    }
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 165px;
    }
    .card-product .img-home img {
        width: 100%;
        object-fit: cover;
        height: 275px;
    }
    .filter-profil label{
        font-size: 11px;
    }
    .moto-profil{
        font-size: 13px;
    }
    .profil-text{
        font-size: 14px;
    }
}
@media only screen and (max-width: 375px) {
    .card-product .image img {
        width: 100%;
        object-fit: cover;
        height: 150px;
    }
    /*img.indikator {
        width: 339px;
        margin-left: -5px;
    }*/
    .produk-desa .card-product {
        height: 281px;
    }
    .modal-indikator {
        width: 355px!important;
    }
        .card-product .img-home img {
        width: 100%;
        object-fit: cover;
        height: 275px;
    }
    .filter-profil label {
        font-size: 10px;
    }
    .profil-text {
        font-size: 12px;
    }
    .moto-profil {
        font-size: 13px;
        margin: -15px 0;
    }
}

}