@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.bg-web {
    background: url("https://res.cloudinary.com/dotwza62o/image/upload/v1623368122/public/dist/images/files/foto-kantor-bupati.webp");
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
a {
    text-decoration:none;
}
.bg-grad {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#7b4397+0,dc2430+100&0.9+0,0.9+100 */
background: -moz-linear-gradient(45deg,  rgba(123,67,151,0.9) 0%, rgba(220,36,48,0.9) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  rgba(123,67,151,0.9) 0%,rgba(220,36,48,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  rgba(123,67,151,0.9) 0%,rgba(220,36,48,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e67b4397', endColorstr='#e6dc2430',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.bg-grad-1 {
    background: #FC5C7D;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #6A82FB, #FC5C7D);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #6A82FB, #FC5C7D); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-grad-2 {
    background: #ff00cc;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #333399, #ff00cc);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #333399, #ff00cc); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-grad-3 {
    background: #0F2027;  /* fallback for old browsers */
background: -webkit-linear-gradient(to bottom, #2C5364, #203A43, #0F2027);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to bottom, #2C5364, #203A43, #0F2027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-grad-fb {
    background: #00c6ff;  /* fallback for old browsers */
background: -webkit-linear-gradient(to top, #0072ff, #00c6ff);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to top, #0072ff, #00c6ff); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-utama {
    background: #159957;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #155799, #159957);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #155799, #159957); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */    
}
.btn-utama {
    background: #159957;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #155799, #159957);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #155799, #159957); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.btn-utama:hover {
    background: #ECE9E6;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FFFFFF, #ECE9E6);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FFFFFF, #ECE9E6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.jame {
    font-family: 'Roboto', sans-serif;
}
.border-merah {
    border-color: red;
}
.bg-layanan {
    border-bottom: 4px solid white;
}
.bg-layanan:hover {
    border-bottom: 4px solid #ff9999;
}
.bg-kontak:hover {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#eaeaea+0,eaeaea+100 */
background: #eaeaea; /* Old browsers */
background: -moz-linear-gradient(top,  #eaeaea 0%, #eaeaea 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #eaeaea 0%,#eaeaea 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #eaeaea 0%,#eaeaea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaeaea', endColorstr='#eaeaea',GradientType=0 ); /* IE6-9 */

}
.cropa {
    float:left;
    width:50%;
    height:100%;
    object-fit:cover;
}
.bg-merah {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cc0000+0,cc0000+100;Red+Flat */
background: #cc0000; /* Old browsers */
background: -moz-linear-gradient(top,  #cc0000 0%, #cc0000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #cc0000 0%,#cc0000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #cc0000 0%,#cc0000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc0000', endColorstr='#cc0000',GradientType=0 ); /* IE6-9 */
}
.crops {
  object-fit: cover;
  object-position: 100% 0;
  width: 115px;
  height: 115px;
}
.cropas {
  object-fit: cover;
  object-position: 100% 0;
  width: 70px;
  height: 70px;
}

.rounded{border-radius:.75rem !important}.rounded-0{border-radius:0 !important}.rounded-1{border-radius:.5rem !important}.rounded-2{border-radius:.75rem !important}.rounded-3{border-radius:1rem !important}.rounded-circle{border-radius:50% !important}.rounded-pill{border-radius:50rem !important}.rounded-top{border-top-left-radius:.75rem !important;border-top-right-radius:.75rem !important}.rounded-top-0{border-top-left-radius:0 !important;border-top-right-radius:0 !important}.rounded-end{border-top-right-radius:.75rem !important;border-bottom-right-radius:.75rem !important}.rounded-end-0{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}.rounded-bottom{border-bottom-right-radius:.75rem !important;border-bottom-left-radius:.75rem !important}.rounded-bottom-0{border-bottom-right-radius:0 !important;border-bottom-left-radius:0 !important}.rounded-start{border-bottom-left-radius:.75rem !important;border-top-left-radius:.75rem !important}.rounded-start-0{border-bottom-left-radius:0 !important;border-top-left-radius:0 !important}

.icon-box-media{display:block;width:3.5rem;min-width:3rem;height:3.5rem;transition:background-color 0.22s ease-in-out,color 0.22s ease-in-out;border-radius:.5rem;background-position:center;background-size:cover;font-size:2rem;line-height:3.55rem;text-align:center}.icon-box-title{margin-bottom:.5rem}.icon-box-title:not(.text-light):not(.text-white){color:#1f1b2d !important}.icon-box:hover .icon-box-media.text-primary,.icon-box.active .icon-box-media.text-primary,.icon-box.show .icon-box-media.text-primary{background-color:#fd5631 !important;color:#fff !important}.icon-box:hover .icon-box-media.text-accent,.icon-box.active .icon-box-media.text-accent,.icon-box.show .icon-box-media.text-accent{background-color:#5d3cf2 !important;color:#fff !important}.icon-box:hover .icon-box-media.text-success,.icon-box.active .icon-box-media.text-success,.icon-box.show .icon-box-media.text-success{background-color:#07c98b !important;color:#fff !important}.icon-box:hover .icon-box-media.text-info,.icon-box.active .icon-box-media.text-info,.icon-box.show .icon-box-media.text-info{background-color:#3c76f2 !important;color:#fff !important}.icon-box:hover .icon-box-media.text-warning,.icon-box.active .icon-box-media.text-warning,.icon-box.show .icon-box-media.text-warning{background-color:#fdbc31 !important;color:#fff !important}.icon-box:hover .icon-box-media.text-danger,.icon-box.active .icon-box-media.text-danger,.icon-box.show .icon-box-media.text-danger{background-color:#f23c49 !important;color:#fff !important}.icon-box:hover .icon-box-media.text-dark,.icon-box.active .icon-box-media.text-dark,.icon-box.show .icon-box-media.text-dark{background-color:#1f1b2d !important;color:#fff !important}.icon-box:hover .icon-box-media.text-light,.icon-box.active .icon-box-media.text-light,.icon-box.show .icon-box-media.text-light{background-color:#fff !important;color:#fd5631 !important}