/*-----------------------------------------------------------------------------------
	GIS DPMPTSP BATANGHARI
	About: A shiny new Blocs website.
	Author: bramana jaya safutra 
	Version: 1.0
	Built with Blocs
-----------------------------------------------------------------------------------*/
body {
	margin: 0;
	padding: 0;
	background: #FFFFFF;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.page-container {
	overflow: hidden;
}

/* Prevents unwanted scroll space when scroll FX used. */
a,
button {
	transition: background .3s ease-in-out;
	outline: none !important;
}

/* Prevent blue selection glow on Chrome and Safari */
a:hover {
	text-decoration: none;
	cursor: pointer;
}

.scroll-fx-lock-init {
	position: fixed !important;
	top: 0;
	bottom: 0;
	left: :0;
	right: 0;
	z-index: 99999;
}

/* ScrollFX Lock */
.blocs-grid-container {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto auto;
	column-gap: 1.5rem;
	row-gap: 1.5rem;
}

/* CSS Grid */


/* Preloader */

.page-preloader {
	position: fixed;
	top: 0;
	bottom: 0;
	width: 100%;
	z-index: 100000;
	background: #FFFFFF url("img/pageload-spinner.gif") no-repeat center center;
	animation-name: preloader-fade;
	animation-delay: 2s;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}

.preloader-complete {
	animation-delay: 0.1s;
}

@keyframes preloader-fade {
	0% {
		opacity: 1;
		visibility: visible;
	}

	100% {
		opacity: 0;
		visibility: hidden;
	}
}

/* = Web Fonts
-------------------------------------------------------------- */

@font-face {
	font-family: 'Airstrike3D';
	src: url('./fonts/Airstrike3D/airstrike3d.ttf');
	src: url('./fonts/Airstrike3D/airstrike3d.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'FORQUE';
	src: url('./fonts/FORQUE/Forque.ttf');
	src: url('./fonts/FORQUE/Forque.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'TejaratchiEx';
	src: url('./fonts/TejaratchiEx/Tejaratchi%20Ex.ttf');
	src: url('./fonts/TejaratchiEx/Tejaratchi%20Ex.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Wedgie-Regular';
	src: url('./fonts/Wedgie-Regular/Wedgie%20Regular.ttf');
	src: url('./fonts/Wedgie-Regular/Wedgie%20Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'PinkScooterDemoRegular';
	src: url('./fonts/PinkScooterDemoRegular/PinkScooterDemoRegular.ttf');
	src: url('./fonts/PinkScooterDemoRegular/PinkScooterDemoRegular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/* = Blocs
-------------------------------------------------------------- */

.bloc {
	width: 100%;
	clear: both;
	background: 50% 50% no-repeat;
	padding: 0 20px;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
	display: flex;
}

.bloc .container {
	padding-left: 0;
	padding-right: 0;
	position: relative;
}


/* Sizes */

.bloc-md {
	padding: 50px 20px;
}

.bloc-sm {
	padding: 20px;
}

/* = Full Screen Blocs 
-------------------------------------------------------------- */

.bloc-fill-screen {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	padding-top: 20px;
	padding-bottom: 20px;
}

.bloc-fill-screen>.container {
	align-self: flex-middle;
	flex-grow: 1;
	display: flex;
	flex-wrap: wrap;
}

.bloc-fill-screen>.container>.row {
	flex-grow: 1;
	align-self: center;
	width: 100%;
}

.bloc-fill-screen .fill-bloc-top-edge,
.bloc-fill-screen .fill-bloc-bottom-edge {
	flex-grow: 0;
}

.bloc-fill-screen .fill-bloc-top-edge {
	align-self: flex-start;
}

.bloc-fill-screen .fill-bloc-bottom-edge {
	align-self: flex-end;
}

/* = Full Width Blocs 
-------------------------------------------------------------- */

.full-width-bloc {
	padding-left: 0;
	padding-right: 0;
}

.full-width-bloc .row {
	margin-left: 0;
	margin-right: 0;
}

.full-width-bloc .container {
	width: 100%;
	max-width: 100% !important;
}

.full-width-bloc .carousel img {
	width: 100%;
	height: auto;
}


/* Background Textures */

.bloc-bg-texture::before {
	content: "";
	background-size: 2px 2px;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.texture-darken::before {
	background: rgba(0, 0, 0, 0.5);
}


/* Background Effects */

.parallax__container {
	clip: rect(0, auto, auto, 0);
	height: 100%;
	left: 0;
	overflow: hidden;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

.parallax {
	position: fixed;
	top: 0;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	width: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}


/* Dark theme */

.d-bloc {
	color: rgba(255, 255, 255, .7);
}

.d-bloc button:hover {
	color: rgba(255, 255, 255, .9);
}

.d-bloc .icon-round,
.d-bloc .icon-square,
.d-bloc .icon-rounded,
.d-bloc .icon-semi-rounded-a,
.d-bloc .icon-semi-rounded-b {
	border-color: rgba(255, 255, 255, .9);
}

.d-bloc .divider-h span {
	border-color: rgba(255, 255, 255, .2);
}

.d-bloc .a-btn,
.d-bloc .navbar a,
.d-bloc a .icon-sm,
.d-bloc a .icon-md,
.d-bloc a .icon-lg,
.d-bloc a .icon-xl,
.d-bloc h1 a,
.d-bloc h2 a,
.d-bloc h3 a,
.d-bloc h4 a,
.d-bloc h5 a,
.d-bloc h6 a,
.d-bloc p a {
	color: rgba(255, 255, 255, .6);
}

.d-bloc .a-btn:hover,
.d-bloc .navbar a:hover,
.d-bloc a:hover .icon-sm,
.d-bloc a:hover .icon-md,
.d-bloc a:hover .icon-lg,
.d-bloc a:hover .icon-xl,
.d-bloc h1 a:hover,
.d-bloc h2 a:hover,
.d-bloc h3 a:hover,
.d-bloc h4 a:hover,
.d-bloc h5 a:hover,
.d-bloc h6 a:hover,
.d-bloc p a:hover {
	color: rgba(255, 255, 255, 1);
}

.d-bloc .navbar-toggle .icon-bar {
	background: rgba(255, 255, 255, 1);
}

.d-bloc .btn-wire,
.d-bloc .btn-wire:hover {
	color: rgba(255, 255, 255, 1);
	border-color: rgba(255, 255, 255, 1);
}

.d-bloc .card {
	color: rgba(0, 0, 0, .5);
}

.d-bloc .card button:hover {
	color: rgba(0, 0, 0, .7);
}

.d-bloc .card icon {
	border-color: rgba(0, 0, 0, .7);
}

.d-bloc .card .divider-h span {
	border-color: rgba(0, 0, 0, .1);
}

.d-bloc .card .a-btn {
	color: rgba(0, 0, 0, .6);
}

.d-bloc .card .a-btn:hover {
	color: rgba(0, 0, 0, 1);
}

.d-bloc .card .btn-wire,
.d-bloc .card .btn-wire:hover {
	color: rgba(0, 0, 0, .7);
	border-color: rgba(0, 0, 0, .3);
}


/* Light theme */

.d-bloc .card,
.l-bloc {
	color: rgba(0, 0, 0, .5);
}

.d-bloc .card button:hover,
.l-bloc button:hover {
	color: rgba(0, 0, 0, .7);
}

.l-bloc .icon-round,
.l-bloc .icon-square,
.l-bloc .icon-rounded,
.l-bloc .icon-semi-rounded-a,
.l-bloc .icon-semi-rounded-b {
	border-color: rgba(0, 0, 0, .7);
}

.d-bloc .card .divider-h span,
.l-bloc .divider-h span {
	border-color: rgba(0, 0, 0, .1);
}

.d-bloc .card .a-btn,
.l-bloc .a-btn,
.l-bloc .navbar a,
.l-bloc a .icon-sm,
.l-bloc a .icon-md,
.l-bloc a .icon-lg,
.l-bloc a .icon-xl,
.l-bloc h1 a,
.l-bloc h2 a,
.l-bloc h3 a,
.l-bloc h4 a,
.l-bloc h5 a,
.l-bloc h6 a,
.l-bloc p a {
	color: rgba(0, 0, 0, .6);
}

.d-bloc .card .a-btn:hover,
.l-bloc .a-btn:hover,
.l-bloc .navbar a:hover,
.l-bloc a:hover .icon-sm,
.l-bloc a:hover .icon-md,
.l-bloc a:hover .icon-lg,
.l-bloc a:hover .icon-xl,
.l-bloc h1 a:hover,
.l-bloc h2 a:hover,
.l-bloc h3 a:hover,
.l-bloc h4 a:hover,
.l-bloc h5 a:hover,
.l-bloc h6 a:hover,
.l-bloc p a:hover {
	color: rgba(0, 0, 0, 1);
}

.l-bloc .navbar-toggle .icon-bar {
	color: rgba(0, 0, 0, .6);
}

.d-bloc .card .btn-wire,
.d-bloc .card .btn-wire:hover,
.l-bloc .btn-wire,
.l-bloc .btn-wire:hover {
	color: rgba(0, 0, 0, .7);
	border-color: rgba(0, 0, 0, .3);
}

/* Row Margin Offsets */

.voffset {
	margin-top: 30px;
}

/* Dividers */

.b-divider {
	border-top: 1px solid rgba(0, 0, 0, .1);
	border-bottom: 1px solid rgba(0, 0, 0, .1);
}


/* = NavBar
-------------------------------------------------------------- */

/* = Sticky Nav
-------------------------------------------------------------- */

.sticky-nav.sticky {
	position: fixed;
	top: 0;
	z-index: 1000;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
	transition: all .2s ease-out;
}

/* Navbar Icon */
.svg-menu-icon {
	fill: none;
	stroke: rgba(0, 0, 0, 0.5);
	stroke-width: 2px;
	fill-rule: evenodd;
}

.navbar-dark .svg-menu-icon {
	stroke: rgba(255, 255, 255, 0.5);
}

.menu-icon-thin-bars {
	stroke-width: 1px;
}

.menu-icon-thick-bars {
	stroke-width: 5px;
}

.menu-icon-rounded-bars {
	stroke-width: 3px;
	stroke-linecap: round;
}

.menu-icon-filled {
	fill: rgba(0, 0, 0, 0.5);
	stroke-width: 0px;
}

.navbar-dark .menu-icon-filled {
	fill: rgba(255, 255, 255, 0.5);
}

.navbar-toggler-icon {
	background: none !important;
	pointer-events: none;
	width: 33px;
	height: 33px;
}

/* Handle Multi Level Navigation */
.dropdown-menu .dropdown-menu {
	border: none
}

@media (min-width:576px) {

	.navbar-expand-sm .dropdown-menu .dropdown-menu {
		border: 1px solid rgba(0, 0, 0, .15);
		position: absolute;
		left: 100%;
		top: -7px
	}

	.navbar-expand-sm .dropdown-menu .submenu-left {
		right: 100%;
		left: auto
	}
}

@media (min-width:768px) {
	.navbar-expand-md .dropdown-menu .dropdown-menu {
		border: 1px solid rgba(0, 0, 0, .15);
		border: 1px solid rgba(0, 0, 0, .15);
		position: absolute;
		left: 100%;
		top: -7px
	}

	.navbar-expand-md .dropdown-menu .submenu-left {
		right: 100%;
		left: auto
	}
}

@media (min-width:992px) {
	.navbar-expand-lg .dropdown-menu .dropdown-menu {
		border: 1px solid rgba(0, 0, 0, .15);
		position: absolute;
		left: 100%;
		top: -7px
	}

	.navbar-expand-lg .dropdown-menu .submenu-left {
		right: 100%;
		left: auto
	}
}

/* = Bric adjustment margins
-------------------------------------------------------------- */

.mg-clear {
	margin: 0;
}

.mg-md {
	margin-top: 10px;
	margin-bottom: 20px;
}

/* = Buttons
-------------------------------------------------------------- */

.btn-d,
.btn-d:hover,
.btn-d:focus {
	color: #FFF;
	background: rgba(0, 0, 0, .3);
}

/* Prevent ugly blue glow on chrome and safari */
button {
	outline: none !important;
}

.btn-rd {
	border-radius: 40px;
}

.btn-clean {
	border: 1px solid rgba(0, 0, 0, .08);
	border-bottom-color: rgba(0, 0, 0, .1);
	text-shadow: 0 1px 0 rgba(0, 0, 1, .1);
	box-shadow: 0 1px 3px rgba(0, 0, 1, .25), inset 0 1px 0 0 rgba(255, 255, 255, .15);
}

.btn-glossy {
	border: 1px solid rgba(0, 0, 0, .09);
	border-bottom-color: rgba(0, 0, 0, .2);
	text-shadow: 0 1px 0 rgba(0, 0, 1, .2);
	box-shadow: 0 1px 3px rgba(0, 0, 1, .35), inset 0 1px 0 0 rgba(255, 255, 255, .4), inset 0 1px 0 2px rgba(255, 255, 255, .08);
	background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, .07) 0%, rgba(255, 255, 255, .07) 100%);
	background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, .07) 0%, rgba(255, 255, 255, .07) 100%);
	background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .07) 0%, rgba(255, 255, 255, .07) 100%);
	background-image: linear-gradient(bottom, rgba(0, 0, 0, .07) 0%, rgba(255, 255, 255, .07) 100%);
}

.a-block {
	width: 100%;
	text-align: left;
	display: inline-block;
}

.text-center .a-block {
	text-align: center;
}

.icon-spacer {
	margin-right: 5px;
}

/* = Icons
-------------------------------------------------------------- */
.icon-sm {
	font-size: 18px !important;
}

.icon-md {
	font-size: 30px !important;
}

.icon-lg {
	font-size: 60px !important;
}

/* Image Frame */
.img-frame,
.img-frame-md,
.img-frame-lg,
.img-frame-rd,
.img-frame-rd-md,
.img-frame-rd-lg {
	background: #FFF;
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05);
	padding: 4px;
}

.img-frame {
	border-radius: 3px;
}

.img-frame-md,
.img-frame-lg {
	border-radius: 6px;
}

.img-frame-md,
.img-frame-rd-md {
	padding: 8px;
}

.img-frame-lg,
.img-frame-rd-lg {
	padding: 14px;
}

/*  Image Protection */
.img-protected {
	-webkit-touch-callout: none;
}

/* = Text & Icon Styles
-------------------------------------------------------------- */
.pressed-t {
	text-shadow: 0 1px 0 #FFF;
}

.text-justify {
	text-align: justify;
}


.card-sq,
.card-sq .card-header,
.card-sq .card-footer {
	border-radius: 0;
}

.card-rd {
	border-radius: 30px;
}

.card-rd .card-header {
	border-radius: 29px 29px 0 0;
}

.card-rd .card-footer {
	border-radius: 0 0 29px 29px;
}

/* = Masonary
-------------------------------------------------------------- */
.card-columns .card {
	margin-bottom: 0.75rem;
}

@media (min-width: 576px) {
	.card-columns {
		-webkit-column-count: 3;
		-moz-column-count: 3;
		column-count: 3;
		-webkit-column-gap: 1.25rem;
		-moz-column-gap: 1.25rem;
		column-gap: 1.25rem;
		orphans: 1;
		widows: 1;
	}

	.card-columns .card {
		display: inline-block;
		width: 100%;
	}
}



.carousel-nav-icon {
	fill: none;
	stroke: #fff;
	stroke-width: 2px;
	fill-rule: evenodd;
	stroke-linecap: round;
}

/* Scroll FX */
.scroll-fx-in-range {
	will-change: opacity;
}


/* ScrollToTop button */

.scrollToTop {
	width: 36px;
	height: 36px;
	padding: 5px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	opacity: 0;
	z-index: 999;
	transition: all .3s ease-in-out;
	pointer-events: none;
}

.showScrollTop {
	opacity: 1;
	pointer-events: all;
}

.scroll-to-top-btn-icon {
	fill: none;
	stroke: #fff;
	stroke-width: 2px;
	fill-rule: evenodd;
	stroke-linecap: round;
}

/* = Custom Styling
-------------------------------------------------------------- */

h1,
h2,
h3,
h4,
h5,
h6,
p,
label,
.btn,
a {
	font-family: "Helvetica";
}

.container {
	max-width: 1140px;
}

.green-bg-gradient {
	background: linear-gradient(68deg, #61E1A3, #49AFFF);
}

.text-trans-gradient {
	background-clip: text !important;
	-webkit-background-clip: text !important;
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.0), #FFFFFF);
	color: transparent !important;
}

.hero-header-text {
	font-size: 200px;
	font-weight: bold;
}

.hero-subheader {
	font-size: 35px;
	font-weight: normal;
}

.shore-bg-gradient {
	background: linear-gradient(0deg, #FFBA1E, #0AA2FF);
}

.blue-bg-gradient {
	background: linear-gradient(190deg, #0149FF 20%, #00F9F0 61%, #A6EDB6 84%, #FFFFFF 93%);
}

.logokecil {
	width: 80px;
	height: 40px;
}

.navbar-brand img {
	width: 170px;
	height: 50px;
}

.icon {
	border-style: solid;
	border-color: #FFF33A !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 4px 4px 4px 4px;
	background: linear-gradient(0deg, #45135A 0%, #FFFFFF 100%);
}

.footer1 {
	font-size: 25px;
	color: #0000FF !important;
	font-family: "Lato";
	font-weight: 900;
	text-decoration: underline !important;
}

.font1 {
	color: #0432FF !important;
	font-family: "Tylko-SemiBold";
	font-size: 20px;
}

.judul {
	font-size: 80px;
	font-family: "Wedgie-Regular";
	font-weight: 700;
	color: var(--swatch-var-Unnamed-Swatch-copy-6) !important;
	background: linear-gradient(0deg, #FEFFFF 3%, #0432FF 99%);
	background-clip: text !important;
	-webkit-background-clip: text !important;
	text-shadow: 3.53px 1.88px 9px #0432FF;
}

.video {
	box-shadow: 5.51px 19.23px 48px #000000;
}

.font2 {
	font-size: 60px;
	font-family: "Poppins";
	font-weight: 700;
	color: #0432FF !important;
	text-shadow: 4.05px 2.94px 2px #000000;
}

.font3 {
	font-family: "PinkScooterDemoRegular";
	color: #0432FF !important;
	font-weight: 700;
	font-size: 30px;
	text-shadow: 0.81px 0.59px 2px #FEFFFF;
}

.fontvisi {
	font-size: 22px;
	color: #0432FF !important;
	font-family: "Roboto Slab";
	font-weight: 700;
	width: 900px;
}

.logosedang {
	width: 400px;
	height: 120px;
}

.icon2 {
	background: linear-gradient(0deg, #0432FF 0%, #FFFFFF 100%);
	border-style: solid;
	border-color: #FEFB00 !important;
	border-width: 3px 3px 3px 3px;
	box-shadow: 0.00px -0.00px 9px #FEFB00;
	width: 100px;
	height: 100px;
	border-radius: 50px 50px 50px 50px;
}

.fontabout {
	font-family: "Ubuntu";
	color: #FEFB00 !important;
	font-size: 15px;
	text-shadow: 0.73px 0.68px 2px #000000;
}

.fonttentang {
	font-size: 30px;
	color: #00F900 !important;
	text-shadow: 1.68px 1.09px 0px #000000;
}

.nav-top {
	background-image: url("img/beautiful-white-cloud.jpg");
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-size: length;
	background-origin: border-box;
	box-shadow: 0.00px 0.00px 23px #000000;
	border-style: solid;
	border-color: #FEFFFF !important;
	border-top-width: 3px;
	border-bottom-width: 3px;
}

.logo {
	border-width: 0px 0px 0px 0px;
	max-width: 200px;
}

.apple-blue-button {
	font-family: "Lato";
	font-weight: bold;
	font-size: 14px;
	background-color: #0071E3;
	color: #0432FF !important;
	line-height: 14px;
	padding: 10px 5px 10px 5px;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-4110) 0%, var(--swatch-var-Unnamed-Swatch-copy-4869) 42%);
	box-shadow: inset 18.17px 5.56px 14px #FEFB00, inset -16.96px -1.19px 11px #FEFB00, inset 0.00px -11.00px 25px #FF40FF;
	margin-right: 5px;
	margin-left: 5px;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	border-style: solid;
	border-width: 2px 2px 2px 2px;
}

.apple-blue-button:hover {
	background-color: #007EFF;
}

.profil {
	color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	line-height: 140px;
	text-shadow: 6.02px 6.69px 3px #FEFFFF;
	font-family: "Roboto Slab";
	font-weight: 700;
	font-size: 170px;
}

.h4-sekretariat -style {
	font-size: 27px;
	text-shadow: 1.81px 2.40px 2px #000000;
	color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
}

.icon-logo-2 {
	width: 120px;
	height: 60px;
	box-shadow: 0.55px 1.92px 7px #000000;
	border-radius: 4px 4px 4px 4px;
	padding: 5px 5px 5px 5px;
}

.icon-logo-3 {
	width: 70px;
	height: 70px;
	padding: 3px 3px 3px 3px;
	box-shadow: 1.23px 1.58px 6px #000000;
	border-radius: 5px 5px 5px 5px;
}

.icon-logo-bpsdm {
	width: 200px;
	height: 80px;
}

.tombol-bidang {
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	font-size: 16px;
	font-family: "Roboto";
	background: linear-gradient(0deg, var(--swatch-var-517) 4%, #FFFFFF 100%);
	border-style: solid;
	border-color: var(--swatch-var-842) !important;
	border-width: 2px 2px 2px 2px;
	font-weight: bold;
	text-shadow: 1.55px 1.26px 2px #000000;
	line-height: 17px;
}

.bloc-divider-t-style {
	height: 872px;
	fill: #FEFFFF;
	background: linear-gradient(0deg, #000000 0%, transparent 100%);
	width: 100%;
}

.bloc-divider-b-style {
	height: 400px;
	fill: transparent;
	background: linear-gradient(0deg, #000000 0%, transparent 100%);
}

.h3-kepala-bagian-style {
	font-family: "PT Serif Caption";
	font-weight: 700;
	font-size: 25px;
	color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
	text-shadow: 2.16px 2.08px 0px #AA7941;
	line-height: 26px;
	background-clip: text !important;
	-webkit-background-clip: text !important;
}

.kadis {
	width: 200px;
	height: 210px;
}

.kaban {
	color: var(--swatch-var-Unnamed-Swatch-copy-1) !important;
	font-size: 25px;
	font-family: "Old Standard TT";
	background: linear-gradient(0deg, #000000 0%, #FFFFFF 51%);
	background-clip: text !important;
	-webkit-background-clip: text !important;
}

.jabatan {
	color: var(--swatch-var-Unnamed-Swatch-copy-3) !important;
	text-shadow: 1.26px 1.55px 2px #121212;
	font-size: 18px;
	line-height: 19px;
	font-family: "Lato";
	text-transform: none;
	font-weight: 900;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	padding: 5px 0px 5px 0px;
	border-radius: 10px 10px 10px 10px;
	border-width: 1px 1px 1px 1px;
	background: linear-gradient(0deg, #FEFFFF 0%, var(--swatch-var-Unnamed-Swatch-copy-4520) 100%);
	background-clip: padding-box !important;
	-webkit-background-clip: padding-box !important;
	box-shadow: 1.77px 0.94px 11px #000000;
}

.nama {
	font-size: 18px;
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	font-weight: 700;
	font-family: "Poppins";
	text-shadow: 1.71px 1.03px 2px #000000;
}

.photo-aselon3 {
	width: 130px;
	height: 140px;
}

.icon-medsos {
	background: linear-gradient(0deg, #000000 0%, #FFFFFF 53%);
	background-clip: text !important;
	-webkit-background-clip: text !important;
	border-style: solid;
	border-color: var(--swatch-var-4799) !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 5px 5px 5px 5px;
}

.icon-medsos-xs {
	box-shadow: -0.00px -0.00px 35px #FEFFFF;
	background: linear-gradient(0deg, #0000C8 0%, #FFFFFF 100%);
	border-width: 5px 5px 5px 5px;
	border-color: #FEFFFF !important;
	border-style: solid;
	border-radius: 5px 5px 5px 5px;
}

.bloc-divider-b-warning-style {
	height: 400px;
	fill: transparent;
	background: linear-gradient(0deg, #000000 0%, transparent 100%);
}

.logoprov {
	width: 120px;
	height: 120px;
}

.footer {
	box-shadow: inset 1.29px 1.53px 12px #0432FF;
	color: var(--swatch-var-Unnamed-Swatch) !important;
	text-align: center;
	font-size: 16px;
	border-radius: 10px 10px 10px 10px;
	border-style: solid;
	border-color: #00FF13 !important;
	border-width: 2px 2px 2px 2px;
	line-height: 25px;
	font-weight: bold;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 0%, #FFFFFF 49%);
	text-shadow: 1.77px 0.94px 0px #FEFFFF;
}

.footer-link {
	font-size: 14px;
	color: var(--swatch-var-517) !important;
	text-align: center;
	background: linear-gradient(0deg, var(--swatch-var-5185) 0%, var(--swatch-var-5993) 100%);
	box-shadow: inset 1.51px 1.31px 7px #FF40FF;
	line-height: 20px;
	font-weight: bold;
	border-style: solid;
	border-color: #FEFB00 !important;
	border-width: 1px 1px 1px 1px;
	border-radius: 10px 10px 10px 10px;
	font-family: "Abril Fatface";
}

.dinaspenanaman {
	font-size: 40px;
	font-family: "Abril Fatface";
	color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
	background: linear-gradient(0deg, var(--swatch-var-1607) 0%, var(--swatch-var-1607) 72%, transparent 100%);
	background-clip: text !important;
	-webkit-background-clip: text !important;
	line-height: 38px;
	text-shadow: 1.15px 1.64px 3px #000000;
}

.bloc-divider-t-fill {
	fill: var(--swatch-var-Unnamed-Swatch-copy-2);
}

.judulbidang {
	color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
	font-size: 50px;
	font-family: "Poppins";
	font-weight: 700;
	background-clip: text !important;
	-webkit-background-clip: text !important;
	line-height: 60px;
	text-shadow: 3.06px 2.57px 2px #000000;
}

.h1-bloc-44-style {
	font-size: 25px;
	line-height: 40px;
	color: var(--swatch-var-517) !important;
}

.bpsdm-bidang {
	width: 100px;
	height: 40px;
}

.bidang {
	font-size: 18px;
	color: var(--swatch-var-5993) !important;
	background: linear-gradient(0deg, var(--swatch-var-5993) 41%, #FFFFFF 100%);
	background-clip: text !important;
	-webkit-background-clip: text !important;
	font-family: "Lato";
	font-weight: 700;
	line-height: 20px;
	border-radius: 15px 15px 15px 15px;
	border-style: solid;
	border-color: var(--swatch-var-6165) !important;
	border-width: 2px 2px 2px 2px;
	text-transform: none;
	text-decoration: none;
}

.gambar-bidang {
	width: 600px;
}

.defenisi-bidang {
	font-size: 18px;
	line-height: 20px;
	color: var(--swatch-var-6651) !important;
	text-shadow: 1.51px 1.31px 0px #000000;
}

.peraturan {
	font-size: 22px;
	color: #FF40FF !important;
	font-family: "Open Sans";
	font-weight: 800;
}

.card2 {
	box-shadow: inset 0.00px -2.00px 14px #0433FF;
	border-radius: 30px 30px 30px 30px;
	border-width: 5px 5px 5px 5px;
	border-style: solid;
	border-color: #FEFFFF !important;
}

.subbagian-judul {
	font-size: 14px;
	line-height: 16px;
	font-family: "Domine";
	font-weight: 600;
	color: var(--swatch-var-5972) !important;
	background-clip: text !important;
	-webkit-background-clip: text !important;
	background-blend-mode: normal;
	border-color: var(--swatch-var-842) !important;
	margin: 0px 0px 0px 0px;
	padding: 2px 2px 2px 2px;
}

.photo-aselon4 {
	width: 140px;
	height: 140px;
}

.namanip-peg {
	font-family: "PT Serif Caption";
	font-size: 15px;
	text-shadow: 0.00px 0.00px 0px #000000;
	color: var(--swatch-var-6651) !important;
	line-height: 16px;
	font-weight: normal;
	background: linear-gradient(0deg, #FF40FF 0%, #FFFFFF 100%);
	border-style: solid;
	border-color: #FEFB00 !important;
	border-radius: 20px 20px 20px 20px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.apple-wire-button {
	font-size: 16px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	line-height: 16px;
	color: var(--swatch-var-4799) !important;
	border-width: 1px 1px 1px 1px;
}

.apple-wire-button:hover {
	color: #000000 !important;
	background-color: #FFFFFF;
}

.link-style {
	width: 100%;
	border-style: solid;
	border-color: var(--swatch-var-6651) !important;
	border-radius: 10px 10px 10px 10px;
	border-width: 1px 1px 1px 1px;
	box-shadow: inset 0.00px 0.00px 6px #0433FF;
}

.gambar-bidang2 {
	width: 600px;
	height: 500px;
}

.bloc-style {
	width: 59.81%;
	opacity: 1.0;
}

.nav {
	background-image: url("img/beautiful-white-cloud.jpg");
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	box-shadow: 0.14px 2.00px 33px #000000;
	border-style: solid;
	border-color: #FEFFFF !important;
	border-top-width: 3px;
	border-bottom-width: 3px;
}

.shadow {
	box-shadow: 9.35px 9.03px 15px #000000;
	border-style: solid;
	border-top-width: 2px;
	border-bottom-width: 2px;
}

.iconlogoptsp {
	height: 70px;
	box-shadow: 1.31px 1.51px 8px #000000;
	border-radius: 8px 8px 8px 8px;
	padding: 5px 5px 5px 5px;
	width: 60px;
}

.logolhkpn {
	width: 120px;
	height: 60px;
	box-shadow: 1.23px 1.58px 7px #000000;
	border-radius: 58px 58px 58px 58px;
}

.esakip {
	width: 120px;
	height: 50px;
	box-shadow: 0.88px 1.80px 6px #000000;
	border-radius: 7px 7px 7px 7px;
}

.logosirup {
	width: 120px;
	height: 70px;
	border-radius: 4px 4px 4px 4px;
	box-shadow: 1.44px 1.39px 6px #000000;
	padding: 9px 3px 9px 3px;
}

.jdihn {
	width: 100px;
	height: 70px;
	padding: 4px 4px 4px 4px;
	box-shadow: 1.31px 1.51px 8px #000000;
	border-radius: 20px 20px 20px 20px;
}

.namakadis {
	font-size: 25px;
	color: var(--swatch-var-1607) !important;
	font-weight: 700;
	text-shadow: 1.44px 1.39px 2px #000000;
	font-family: "Roboto Slab";
}

.logodashboard {
	width: 500px;
}

.contact {
	box-shadow: inset 7.22px 8.30px 13px #FEFFFF;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-1) 0%, #FFFFFF 100%);
	font-size: 16px;
	font-family: "PinkScooterDemoRegular";
	font-weight: 700;
	color: #FEFFFF !important;
	text-shadow: 1.62px 1.18px 2px #000000;
}

.tentang {
	color: #FF40FF !important;
	font-size: 17px;
	line-height: 17px;
	font-family: "Open Sans";
	font-weight: 600;
}

.img-batang-ha-style {
	height: 140px;
	width: 126px;
}

.judulbatanghari {
	color: #0432FF !important;
	font-size: 90px;
	line-height: 35px;
	font-family: "TejaratchiCaps";
	font-weight: 700;
	text-shadow: 3.15px 2.46px 2px #FEFFFF;
}

.judulbatanghari2 {
	font-family: "Pt Sans Narrow";
	color: var(--swatch-var-Unnamed-Swatch-copy-3) !important;
	font-size: 40px;
	text-shadow: 1.36px 1.46px 2px #000000;
	line-height: 42px;
	font-weight: 700;
}

.isibatanghari {
	font-size: 26px;
	color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	line-height: 30px;
	text-shadow: 1.18px 1.62px 0px #FEFFFF;
	font-family: "PT Serif";
	font-weight: 700;
}

.gambarjudul {
	box-shadow: 1.81px 2.40px 45px #000000;
	width: 1000px;
	height: 250px;
	max-width: 1000px;
}

.h4-sejarah-style {
	opacity: 0.8;
}

.defenisi {
	color: #932092 !important;
	text-shadow: 1.36px 1.46px 0px #FEFFFF;
	font-size: 18px;
	line-height: 26px;
	font-weight: bold;
}

.nama-bupati {
	font-size: 22px;
	color: #FEFB00 !important;
	line-height: 24px;
	text-shadow: 1.85px 0.75px 2px #000000;
	font-weight: bold;
}

.bupati {
	width: 120px;
	height: 140px;
}

.list {
	font-size: 16px;
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	line-height: 16px;
	text-shadow: 1.23px 1.58px 0px #000000;
}

.p-pendidikan-style {
	line-height: 20px;
}

.img-sertifika-style {
	width: 360px;
	height: 380px;
}

.jabatan2 {
	font-size: 17px;
	color: #AA7941 !important;
	font-weight: bold;
	text-shadow: 1.58px 1.23px 0px #FEFFFF;
}

.icon4 {
	width: 100px;
	font-size: 20px;
	color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	line-height: 20px;
	height: 100px;
}

.h4-kepala-daerah-style {
	font-family: "Tylko-SemiBold";
}

.font-icon {
	font-family: "Poppins";
	font-weight: 700;
	font-size: 14px;
	line-height: 15px;
	color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	text-shadow: 1.39px 1.44px 0px #00FCFF;
	text-align: center;
}

.gambarkotak {
	width: 290px;
	height: 200px;
	box-shadow: 7.19px 5.42px 9px #000000;
}

.gambarlandscape {
	width: 400px;
	height: 220px;
	box-shadow: 8.36px 9.96px 10px #000000;
}

.gambarwisata2 {
	width: 500px;
	height: 300px;
	box-shadow: 5.25px 6.04px 6px #000000;
}

.gambarwisata3 {
	box-shadow: 11.26px 6.50px 10px #000000;
	width: 350px;
	height: 200px;
}

.gambar {
	width: 1000px;
	height: 400px;
	box-shadow: 1.23px 1.58px 14px #000000;
}

.logofooter {
	width: 250px;
	height: 70px;
}

.wisataalam {
	width: 500px;
	height: 300px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch) !important;
	border-width: 5px 5px 5px 5px;
}

.img-style {
	height: 686px;
	width: 512px;
}

.iconfungsional {
	width: 100px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 20px 20px 20px 20px;
	padding: 5px 5px 3px 5px;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-copy-1) 0%, #FFFFFF 100%);
}

.menunav {
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 2%, #FFFFFF 75%);
	font-size: 15px;
	color: var(--swatch-var-Unnamed-Swatch) !important;
	font-family: "Abril Fatface";
	line-height: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	box-shadow: inset 4.41px 2.35px 11px #FEFFFF;
	position: relative;
	left: 5px;
	right: 5px;
	top: 5px;
	bottom: 5px;
	margin-left: 5px;
	margin-right: 5px;
	width: 150px;
	max-width: 150px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-3) !important;
	stroke: #FEFB00;
	stroke-linecap: square;
	border-width: 2px 2px 2px 2px;
	text-shadow: 1.29px 1.53px 0px #FEFFFF;
}

.namapeg {
	font-size: 14px;
	color: #FEFFFF !important;
	line-height: 20px;
	font-family: "Poppins";
	font-weight: 700;
	background: linear-gradient(0deg, #FF40FF 0%, #FFFFFF 100%);
	padding-top: 5px;
	padding-bottom: 5px;
	border-style: solid;
	border-color: #FF40FF !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 20px 20px 20px 20px;
	text-shadow: 1.81px 0.85px 1px #000000;
}

.subjudul {
	font-size: 25px;
	color: #0432FF !important;
	line-height: 25px;
	font-weight: bold;
	background: linear-gradient(359deg, var(--swatch-var-Unnamed-Swatch-copy-2) 0%, #FFFFFF 66%);
	background-clip: border-box !important;
	-webkit-background-clip: border-box !important;
	border-radius: 10px 10px 10px 10px;
	border-style: solid;
	border-color: #FEFFFF !important;
	border-width: 2px 2px 2px 2px;
	box-shadow: 3.53px 4.85px 8px #000000;
}

.tentang1 {
	font-size: 24px;
	color: #0432FF !important;
	font-weight: bold;
	line-height: 24px;
}

.logobesar {
	max-width: 1000px;
}

.papanjab {
	width: 250px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch) !important;
	border-radius: 20px 20px 20px 20px;
	border-width: 2px 2px 2px 2px;
	box-shadow: inset 16.74px 2.95px 22px #FEFFFF;
}

.namaboard {
	width: 400px;
	height: 100px;
}

.board1 {
	width: 300px;
}

.board2 {
	max-width: 250px;
	width: 300px;
	height: 250px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-1) !important;
	border-radius: 20px 20px 20px 20px;
	border-width: 2px 2px 2px 2px;
}

.fontfooter {
	color: #0432FF !important;
	font-size: 18px;
	line-height: 19px;
}

.board3 {
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	border-radius: 10px 10px 10px 10px;
	border-width: 2px 2px 2px 2px;
}

.icondepan {
	padding: 20px 20px 20px 20px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	border-radius: 20px 20px 20px 20px;
	border-width: 2px 2px 2px 2px;
	box-shadow: 0.00px -2.00px 8px #FFFB00;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-4520) 0%, var(--swatch-var-Unnamed-Swatch-copy-9) 100%);
	width: 200px;
	height: 200px;
	margin: 20px 20px 20px 20px;
	left: 5px;
}

.defenisigeo {
	font-size: 20px;
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	text-shadow: 1.36px 1.46px 0px #000000;
}

.judulgeo {
	text-shadow: 1.06px 1.70px 0px #000000;
	font-size: 24px;
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	line-height: 24px;
}

.logodepan-kecil {
	width: 300px;
}

.judulpilihan {
	font-family: "Airstrike3D";
	font-size: 40px;
	color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	line-height: 40px;
	text-shadow: 0.00px -2.00px 2px #FEFFFF;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 20px 20px 20px 20px;
}

.icondepan2 {
	box-shadow: 0.00px -2.00px 10px #FFFB00;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
	border-width: 2px 2px 2px 2px;
	border-radius: 20px 20px 20px 20px;
	background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-copy-1) 0%, var(--swatch-var-Unnamed-Swatch-copy-9) 99%);
	padding: 10px 5px 10px 5px;
	margin-top: 20px;
}

.subsektor {
	width: 150px;
	height: 150px;
	border-style: solid;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	border-width: 3px 3px 3px 3px;
	padding: 2px 2px 2px 2px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 0.00px -2.00px 12px #FEFFFF;
	margin: 10px 10px 10px 10px;
}

/* = Colour
-------------------------------------------------------------- */

/* Swatch Variables */
:root {

	--swatch-var-Unnamed-Swatch: rgba(0, 0, 0, 1.00);

	--swatch-var-Unnamed-Swatch-copy-1: rgba(255, 64, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-2: rgba(255, 251, 0, 1.00);

	--swatch-var-1607: rgba(255, 255, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-3: rgba(255, 251, 0, 1.00);

	--swatch-var-Unnamed-Swatch-copy-4: rgba(254, 255, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-5: rgba(234, 234, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-6: rgba(255, 255, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-7: rgba(255, 251, 0, 1.00);

	--swatch-var-Unnamed-Swatch-copy-8: rgba(0, 253, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-9: rgba(192, 192, 245, 0.55);

	--swatch-var-Unnamed-Swatch-copy-10: rgba(250, 250, 95, 0.44);

	--swatch-var-Unnamed-Swatch-copy-11: rgba(4, 51, 255, 1.00);

	--swatch-var-3480: rgba(255, 64, 255, 1.00);

	--swatch-var-Unnamed-Swatch-copy-4520: rgba(4, 138, 255, 0.10);

	--swatch-var-Unnamed-Swatch-Copy-Copy: rgba(255, 204, 216, 0.54);

	--swatch-var-Unnamed-Swatch-Copy-copy-1: rgba(4, 6, 29, 0.27);

	--swatch-var-1953: rgba(220, 220, 220, 1.00);

	--swatch-var-Unnamed-Swatch-Copy-Copy-Copy: rgba(194, 48, 255, 0.28);

}


/* Background colour styles */

.bgc-7848 {
	background-color: var(--swatch-var-Unnamed-Swatch-copy-9);
}

.bgc-5276 {
	background-color: var(--swatch-var-Unnamed-Swatch-copy-11);
}

.bgc-2520 {
	background-color: var(--swatch-var-Unnamed-Swatch-copy-4520);
}

.bgc-6470 {
	background-color: var(--swatch-var-Unnamed-Swatch-Copy-copy-1);
}

.bgc-3480 {
	background-color: var(--swatch-var-3480);
}

.bgc-1953 {
	background-color: var(--swatch-var-1953);
}

.bgc-1792 {
	background-color: var(--swatch-var-Unnamed-Swatch);
}

.bgc-4118 {
	background-color: var(--swatch-var-Unnamed-Swatch-Copy-Copy);
}

.bgc-4980 {
	background-color: var(--swatch-var-Unnamed-Swatch-copy-10);
}

.bgc-1607 {
	background-color: var(--swatch-var-1607);
}

.bgc-5881 {
	background-color: var(--swatch-var-Unnamed-Swatch-Copy-Copy-Copy);
}

/* Text colour styles */

.tc-3817 {
	color: var(--swatch-var-Unnamed-Swatch-copy-5) !important;
}

/* Icon colour styles */

.icon-5485 {
	color: var(--swatch-var-Unnamed-Swatch-copy-6) !important;
	border-color: var(--swatch-var-Unnamed-Swatch-copy-6) !important;
}

/* Bloc image backgrounds */

.bg-1 {
	background-image: url("img/1-1.jpg");
	background-image: -webkit-image-set(url("img/1-1.webp") 1x,
			url("img/1-1.webp") 2x);
	background-image: image-set(url("img/1-1.jpg") 1x,
			url("img/1-1.jpg") 2x, url("img/1-1.webp") 1x,
			url("img/1-1.webp") 2x);
}

.bg-3 {
	background-image: url("img/3.jpg");
	background-image: -webkit-image-set(url("img/3.webp") 1x,
			url("img/3.webp") 2x);
	background-image: image-set(url("img/3.jpg") 1x,
			url("img/3.jpg") 2x, url("img/3.webp") 1x,
			url("img/3.webp") 2x);
}

.mt-lg-0 {}

.bg-beautiful-white-cloud {
	background-image: url("img/beautiful-white-cloud.jpg");
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: -webkit-image-set(url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
	background-image: image-set(url("img/beautiful-white-cloud.jpg") 1x,
			url("img/beautiful-white-cloud.jpg") 2x, url("img/beautiful-white-cloud.webp") 1x,
			url("img/beautiful-white-cloud.webp") 2x);
}

.bg-vivid-blurred-colorful-wallpaper-background-2 {
	background-image: url("img/vivid-blurred-colorful-wallpaper-background-2.jpg");
	background-image: -webkit-image-set(url("img/vivid-blurred-colorful-wallpaper-background-2.webp") 1x,
			url("img/vivid-blurred-colorful-wallpaper-background-2.webp") 2x);
	background-image: image-set(url("img/vivid-blurred-colorful-wallpaper-background-2.jpg") 1x,
			url("img/vivid-blurred-colorful-wallpaper-background-2.jpg") 2x, url("img/vivid-blurred-colorful-wallpaper-background-2.webp") 1x,
			url("img/vivid-blurred-colorful-wallpaper-background-2.webp") 2x);
}

.bg-vivid {
	background-image: url("img/vivid.jpg");
	background-image: -webkit-image-set(url("img/vivid.webp") 1x,
			url("img/vivid.webp") 2x);
	background-image: image-set(url("img/vivid.jpg") 1x,
			url("img/vivid.jpg") 2x, url("img/vivid.webp") 1x,
			url("img/vivid.webp") 2x);
}

.bg-3 {
	background-image: url("img/3.jpg");
	background-image: -webkit-image-set(url("img/3.webp") 1x,
			url("img/3.webp") 2x);
	background-image: image-set(url("img/3.jpg") 1x,
			url("img/3.jpg") 2x, url("img/3.webp") 1x,
			url("img/3.webp") 2x);
}

.bg-0-a {
	background-image: url("img/0.a.png");
	background-image: -webkit-image-set(url("img/0.a.webp") 1x,
			url("img/0.a.webp") 2x);
	background-image: image-set(url("img/0.a.png") 1x,
			url("img/0.a.png") 2x, url("img/0.a.webp") 1x,
			url("img/0.a.webp") 2x);
}

.bg-abstract-blue-geometric-shapes-background {
	background-image: url("img/abstract-blue-geometric-shapes-background.jpg");
	background-image: -webkit-image-set(url("img/abstract-blue-geometric-shapes-background.webp") 1x,
			url("img/abstract-blue-geometric-shapes-background.webp") 2x);
	background-image: image-set(url("img/abstract-blue-geometric-shapes-background.jpg") 1x,
			url("img/abstract-blue-geometric-shapes-background.jpg") 2x, url("img/abstract-blue-geometric-shapes-background.webp") 1x,
			url("img/abstract-blue-geometric-shapes-background.webp") 2x);
}

.bg-White {
	background-image: url("img/White.jpg");
	background-image: -webkit-image-set(url("img/White.webp") 1x,
			url("img/White.webp") 2x);
	background-image: image-set(url("img/White.jpg") 1x,
			url("img/White.jpg") 2x, url("img/White.webp") 1x,
			url("img/White.webp") 2x);
}

.bg-3d-render-low-poly-plexus-design-network-communications {
	background-image: url("img/3d-render-low-poly-plexus-design-network-communications.jpg");
	background-image: -webkit-image-set(url("img/3d-render-low-poly-plexus-design-network-communications.webp") 1x,
			url("img/3d-render-low-poly-plexus-design-network-communications.webp") 2x);
	background-image: image-set(url("img/3d-render-low-poly-plexus-design-network-communications.jpg") 1x,
			url("img/3d-render-low-poly-plexus-design-network-communications.jpg") 2x, url("img/3d-render-low-poly-plexus-design-network-communications.webp") 1x,
			url("img/3d-render-low-poly-plexus-design-network-communications.webp") 2x);
}

.bg-1-1 {
	background-image: url("img/1-1.jpg");
	background-image: -webkit-image-set(url("img/1-1.webp") 1x,
			url("img/1-1.webp") 2x);
	background-image: image-set(url("img/1-1.jpg") 1x,
			url("img/1-1.jpg") 2x, url("img/1-1.webp") 1x,
			url("img/1-1.webp") 2x);
}

/* = Custom Bric Data
-------------------------------------------------------------- */

#particles-js {
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.stickyalert-bg {
	display: block;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0);
	z-index: 9997
}

.stickyalertwrapper {
	display: block;
	position: relative;
	width: 100%;
	padding: 1% 5% 1% 1%;
	text-align: left;
	background-color: #d8d8d8;
	border-radius: 3px;
	box-shadow: 0 0 5px #555555;
	z-index: 9998
}

.stickyalertwrapper.top {
	top: 9%
}

.stickyalertwrapper.bottom {
	bottom: 0%
}

.stickyalertwrapper p.stickyalert-txt {
	display: inline;
	position: relative;
	margin: 0;
	padding: 0;
	color: #515151;
	font-size: 1.25em;
	line-height: 140%
}

.stickyalertwrapper p.stickyalert-policy,
.stickyalertwrapper p.stickyalert-agree,
.stickyalertwrapper p.stickyalert-leave {
	display: inline-block;
	position: relative;
	margin: .25em 0 0 .5em;
	padding: 0;
	font-size: 1.25em;
	line-height: 140%
}

.stickyalertwrapper p.stickyalert-policy a,
.stickyalertwrapper p.stickyalert-agree a,
.stickyalertwrapper p.stickyalert-leave a,
.stickyalertwrapper p.stickyalert-policy a:visited,
.stickyalertwrapper p.stickyalert-agree a:visited,
.stickyalertwrapper p.stickyalert-leave a:visited {
	padding: .2em .35em .2em .35em;
	border: 2px solid #bcbcbc;
	border-radius: .5em;
	color: #4c8dbb
}

/* .stickyalertwrapper p.stickyalert-policy a:hover, .stickyalertwrapper p.stickyalert-leave a:hover {
	  border: 2px solid #ffffff;
	  color: #ffffff}   */
.stickyalertwrapper .icon-md {
	display: block;
	position: absolute;
	top: 10%;
	right: 1%;
	color: #ff0000;
	text-shadow: 1px 1px 2px #929292;
	cursor: pointer
}

.stickyalertwrapper .display-in-blocs-edit-mode-only {
	display: block;
	position: relative;
	height: 40px;
	padding-top: 6px;
	padding-left: 10px;
	font-size: 1.5em;
	background-color: #cccccc
}

@media only screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (max-width: 768px) and (min--moz-device-pixel-ratio: 2),
only screen and (max-width: 768px) and (-moz-min-device-pixel-ratio: 2),
only screen and (max-width: 768px) and (-o-min-device-pixel-ratio: 2/1),
only screen and (max-width: 768px) and (min-device-pixel-ratio: 2),
only screen and (max-width: 768px) and (min-resolution: 192dpi),
only screen and (max-width: 768px) and (min-resolution: 2dppx) {
	.stickyalertwrapper p.stickyalert-txt {
		padding: 0 !important
	}

	.stickyalertwrapper p.stickyalert-policy,
	.stickyalertwrapper p.stickyalert-agree,
	.stickyalertwrapper p.stickyalert-leave {
		margin-left: 0em;
		line-height: calc(140% * 1.33) !important
	}
}

/* = Animated Scroll Symbol-------------------------------------------------------------- */
.mouse-symbol,
.device-symbol {
	width: 29px;
	height: 50px;
	border: 2px solid rgba(0, 0, 0, .5);
	border-radius: 30px;
	margin: 0 auto;
	position: relative;
}

.device-symbol {
	border-radius: 6px;
}

.device-symbol:before {
	content: "";
	display: block;
	position: absolute;
	background-color: rgba(0, 0, 0, .23);
	height: 42px;
	width: 21px;
	border-radius: 2px;
	margin: 2px 0 0 2px;
}

.mouse-symbol:after,
.device-symbol:after {
	content: "";
	display: block;
	position: absolute;
	top: 10px;
	width: 3px;
	height: 3px;
	margin-left: 11px;
	background-color: #000000;
	border-radius: 100%;
}

.device-symbol:after {
	top: 12px;
}

.mouse-symbol-light.mouse-symbol,
.mouse-symbol-light.device-symbol {
	border: 2px solid rgba(255, 255, 255, .5);
}

.mouse-symbol-light.mouse-symbol:after,
.mouse-symbol-light.device-symbol:after {
	background-color: #FFFFFF;
}

.mouse-symbol-light.device-symbol:before {
	background-color: rgba(255, 255, 255, .23);
}

.slow-touch-scroll:after {
	animation: mouse-scroll-slow 2s cubic-bezier(0.68, -0.65, 0.265, 1.35) infinite
}

.fast-touch-scroll:after {
	animation: mouse-scroll-fast 2s cubic-bezier(0.68, -0.65, 0.265, 1.35) infinite
}

.fast-invert-touch-scroll:after {
	animation: mouse-scroll-fast-invert 2s cubic-bezier(0.68, -0.65, 0.265, 1.35) infinite
}

@keyframes mouse-scroll-slow {
	0% {
		-webkit-transform: translateY(0px) scaleY(1);
		transform: translateY(0px) scaleY(1);
	}

	20% {
		-webkit-transform: translateY(0px) scaleX(1.2);
		transform: translateY(0px) scaleX(1.2);
		opacity: 1;
	}

	100% {
		-webkit-transform: translateY(25px) scaleY(3) scaleX(0.8);
		transform: translateY(25px) scaleY(3) scaleX(0.8);
		opacity: .1;
	}
}

@keyframes mouse-scroll-fast {

	0%,
	20% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
		opacity: 1;
	}

	50% {
		-webkit-transform: translateY(20px);
		transform: translateY(20px);
		opacity: 1;
	}

	80%,
	100% {
		-webkit-transform: translateY(20px);
		transform: translateY(20px);
		opacity: .1;
	}
}

@keyframes mouse-scroll-fast-invert {

	0%,
	20% {
		-webkit-transform: translateY(15px);
		transform: translateY(15px);
		opacity: 1;
	}

	50% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
		opacity: 1;
	}

	80%,
	100% {
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
		opacity: .1;
	}
}

.img-hover-tilt-container {
	position: relative;
	transform-style: preserve-3d;
}

.hover-tilt-label {
	position: absolute;
	top: 50%;
	transform: translateY(-50%) translateZ(20px);
	width: 100%;
	text-align: center;
	font-size: 40px;
}

.hover-tilt-light-text {
	color: rgba(255, 255, 255, .8);
}


/* = Bloc Padding Multi Breakpoint
-------------------------------------------------------------- */

@media (min-width: 576px) {
	.bloc-xxl-sm {
		padding: 200px 20px;
	}

	.bloc-xl-sm {
		padding: 150px 20px;
	}

	.bloc-lg-sm {
		padding: 100px 20px;
	}

	.bloc-md-sm {
		padding: 50px 20px;
	}

	.bloc-sm-sm {
		padding: 20px;
	}

	.bloc-no-padding-sm {
		padding: 0 20px;
	}
}

@media (min-width: 768px) {
	.bloc-xxl-md {
		padding: 200px 20px;
	}

	.bloc-xl-md {
		padding: 150px 20px;
	}

	.bloc-lg-md {
		padding: 100px 20px;
	}

	.bloc-md-md {
		padding: 50px 20px;
	}

	.bloc-sm-md {
		padding: 20px 20px;
	}

	.bloc-no-padding-md {
		padding: 0 20px;
	}
}

@media (min-width: 992px) {
	.bloc-xxl-lg {
		padding: 200px 20px;
	}

	.bloc-xl-lg {
		padding: 150px 20px;
	}

	.bloc-lg-lg {
		padding: 100px 20px;
	}

	.bloc-md-lg {
		padding: 50px 20px;
	}

	.bloc-sm-lg {
		padding: 20px;
	}

	.bloc-no-padding-lg {
		padding: 0 20px;
	}
}


/* = Mobile adjustments 
-------------------------------------------------------------- */
@media (max-width: 1024px) {

	.bloc.full-width-bloc,
	.bloc-tile-2.full-width-bloc .container,
	.bloc-tile-3.full-width-bloc .container,
	.bloc-tile-4.full-width-bloc .container {
		padding-left: 0;
		padding-right: 0;
	}
}

@media (max-width: 991px) {
	.container {
		width: 100%;
	}

	.bloc {
		padding-left: constant(safe-area-inset-left);
		padding-right: constant(safe-area-inset-right);
	}

	/* iPhone X Notch Support*/
	.bloc-group,
	.bloc-group .bloc {
		display: block;
		width: 100%;
	}
}

@media (max-width: 767px) {

	.bloc-tile-2 .container,
	.bloc-tile-3 .container,
	.bloc-tile-4 .container {
		padding-left: 0;
		padding-right: 0;
	}

	.btn-dwn {
		display: none;
	}

	.voffset {
		margin-top: 5px;
	}

	.voffset-md {
		margin-top: 20px;
	}

	.voffset-lg {
		margin-top: 30px;
	}

	form {
		padding: 5px;
	}

	.close-lightbox {
		display: inline-block;
	}

	.blocsapp-device-iphone5 {
		background-size: 216px 425px;
		padding-top: 60px;
		width: 216px;
		height: 425px;
	}

	.blocsapp-device-iphone5 img {
		width: 180px;
		height: 320px;
	}
}

@media (max-width: 991px) {
	.hero-header-text {
		font-size: 140px;
	}

	.hero-subheader {
		font-size: 30px;
	}

	.nav-top {}

	.logo {
		width: 150px;
		height: 40px;
	}

	.apple-blue-button {
		font-size: 11px;
		margin-right: 5px;
		margin-top: 0px;
		line-height: 11px;
		width: 90px;
		height: 20px;
	}

	.profil {
		font-size: 150px;
		background: linear-gradient(0deg, var(--swatch-var-928) 9%, var(--swatch-var-517) 100%);
		background-clip: text !important;
		-webkit-background-clip: text !important;
		text-align: center;
		line-height: 100px;
		color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
	}

	.h4-sekretariat -style {
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	}

	.icon-logo-2 {
		width: 100px;
		height: 50px;
	}

	.icon-logo-3 {
		width: 60px;
		height: 60px;
		padding: 1px 1px 1px 1px;
		border-radius: 3px 3px 3px 3px;
	}

	.icon-logo-bpsdm {
		width: 100px;
		height: 35px;
	}

	.tombol-bidang {
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-7) 5%, #FFFFFF 100%);
	}

	.h3-kepala-bagian-style {
		font-size: 20px;
	}

	.kadis {
		width: 180px;
		height: 190px;
	}

	.kaban {
		font-size: 18px;
		line-height: 20px;
	}

	.jabatan {
		font-size: 14px;
		line-height: 16px;
		text-shadow: 1.26px 1.55px 2px #00002A;
		background: linear-gradient(0deg, #FEFFFF 26%, var(--swatch-var-Unnamed-Swatch-copy-11) 100%);
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	}

	.nama {
		font-family: "Oswald";
		font-size: 17px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	}

	.photo-aselon3 {
		width: 120px;
		height: 130px;
	}

	.icon-medsos {
		background: linear-gradient(0deg, #000000 0%, #FFFFFF 100%);
		border-width: 2px 2px 2px 2px;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	}

	.logoprov {
		width: 100px;
		height: 100px;
	}

	.footer {
		font-size: 12px;
		color: var(--swatch-var-Unnamed-Swatch) !important;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 35%, var(--swatch-var-5972) 71%, var(--swatch-var-Unnamed-Swatch-copy-4) 100%);
		box-shadow: inset 1.29px 1.53px 7px #0432FF, inset 0.00px -17.00px 43px transparent;
		line-height: 20px;
		margin: 5px 5px 5px 5px;
	}

	.footer-link {
		font-size: 10px;
	}

	.judulbidang {
		font-size: 35px;
		line-height: 40px;
		color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
		background: linear-gradient(0deg, var(--swatch-var-6651) 47%, #FFFFFF 100%);
		font-weight: 800;
	}

	.gambar-bidang {
		height: 280px;
		width: 350px;
	}

	.subbagian-judul {
		font-size: 16px;
	}

	.photo-aselon4 {
		width: 100px;
		height: 100px;
	}

	.namanip-peg {
		font-size: 17px;
		color: var(--swatch-var-6651) !important;
		background: linear-gradient(0deg, var(--swatch-var-6651) 47%, #FFFFFF 100%);
		background-clip: text !important;
		-webkit-background-clip: text !important;
	}

	.bloc-style {
		width: 100%;
	}

	.apple-wire-button {
		text-align: center;
		position: relative;
	}

	.bloc-pkm-style {
		width: 46.24%;
	}

	.container-div-style {
		width: 100%;
	}

	.bloc-pkti-style {
		width: 100%;
	}

	.gambar-bidang2 {
		height: 300px;
	}

	.bloc-skpk-style {
		width: 100%;
	}

	.bloc-pktuf-style {
		width: 100%;
	}

	.icondepan {
		width: 150px;
		height: 150px;
		padding: 10px 10px 10px 10px;
		margin: 12px 12px 12px 12px;
		left: 1px;
	}

	.isibatanghari {
		font-family: "Open Sans";
		font-weight: 800;
		text-shadow: 1.18px 1.62px 0px #FEFFFF;
		color: var(--swatch-var-Unnamed-Swatch) !important;
		font-size: 14px;
		line-height: 20px;
	}

	.fontfooter {
		color: var(--swatch-var-1607) !important;
		font-size: 14px;
		line-height: 16px;
	}

	.logolhkpn {
		width: 100px;
		height: 50px;
		border-radius: 20px 20px 20px 20px;
		border-style: solid;
		border-color: var(--swatch-var-1607) !important;
	}

	.logosirup {
		height: 50px;
		padding: 5px 5px 5px 5px;
	}

	.jdihn {
		width: 70px;
		height: 70px;
		padding: 2px 2px 2px 2px;
		border-radius: 20px 20px 20px 20px;
	}

	.esakip {
		height: 40px;
		width: 100px;
	}

	.iconlogoptsp {
		width: 50px;
		height: 60px;
	}

	.gambarjudul {
		max-width: 700px;
		height: 200px;
	}

	.img-style {
		height: 400px;
	}

	.defenisi {}

	.fonttentang {
		font-size: 25px;
		line-height: 25px;
	}

	.judulbatanghari2 {
		font-size: 30px;
	}

	.wisataalam {
		height: 200px;
	}

	.gambarwisata2 {
		width: 200px;
		height: 120px;
	}

	.logobesar {
		max-width: 700px;
	}

	.board1 {
		width: 250px;
	}

	.papanjab {
		width: 200px;
	}

	.board2 {
		width: 200px;
		height: 200px;
	}

	.card2 {
		box-shadow: inset 0.00px -2.00px 9px #0433FF;
	}

	.namapeg {
		font-size: 14px;
		line-height: 14px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 0%, #FFFFFF 100%);
	}

	.navbar-brand img {
		width: 120px;
		height: 40px;
	}

	.logodepan-kecil {
		width: 240px;
	}

}

@media (max-width: 767px) {
	.hero-header-text {
		font-size: 100px;
	}

	.hero-subheader {
		font-size: 22px;
	}

	.logo {}

	.apple-blue-button {
		font-size: 8px;
		box-shadow: inset 0.89px 0.45px 0px #FAFD00, inset 0.89px 0.45px 1px #00FCFF;
		width: 70px;
		height: 20px;
		margin-bottom: 2px;
		margin-top: 2px;
		font-weight: bold;
		line-height: 10px;
	}

	.profil {
		background: linear-gradient(0deg, var(--swatch-var-928) 7%, var(--swatch-var-517) 100%);
		line-height: 70px;
		font-size: 90px;
	}

	.h4-sekretariat -style {
		font-size: 15px;
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	}

	.icon-logo-2 {
		width: 140px;
		height: 30px;
	}

	.icon-logo-3 {
		width: 40px;
		height: 50px;
	}

	.icon-logo-bpsdm {
		width: 150px;
		height: 50px;
	}

	.tombol-bidang {
		background: linear-gradient(0deg, var(--swatch-var-517) 4%, #FFFFFF 100%);
	}

	.h3-kepala-bagian-style {
		font-size: 20px;
		color: var(--swatch-var-4799) !important;
		font-family: "Roboto";
		text-shadow: 0.72px 0.69px 0px #AA7941;
	}

	.kadis {
		width: 150px;
		height: 150px;
	}

	.kaban {
		font-size: 18px;
	}

	.jabatan {
		font-size: 15px;
		line-height: 18px;
		text-shadow: 0.63px 0.78px 2px #AA7942;
	}

	.nama {
		font-size: 16px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	}

	.photo-aselon3 {
		width: 100px;
		height: 100px;
	}

	.icon-medsos {
		border-color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	}

	.icon-medsos-xs {
		background: linear-gradient(0deg, #00FCFF 0%, #FFFFFF 100%);
		border-style: solid;
		border-color: #FEFFFF !important;
		box-shadow: inset 0.00px -2.00px 7px #0432FF;
		border-width: 4px 4px 4px 4px;
	}

	.logoprov {
		text-align: center;
		position: relative;
	}

	.footer {
		font-size: 12px;
	}

	.footer-link {
		font-size: 9px;
	}

	.judulbidang {
		font-size: 30px;
		line-height: 25px;
		color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
		background: linear-gradient(356deg, var(--swatch-var-6651) 52%, #FFFFFF 95%);
	}

	.h1-bloc-44-style {
		font-size: 18px;
		line-height: 25px;
	}

	.gambar-bidang {
		height: 250px;
	}

	.namanip-peg {
		font-size: 14px;
		color: var(--swatch-var-6651) !important;
	}

	.container-div-pkm-style {
		width: 100%;
	}

	.bloc-pkm-style {
		width: 100%;
	}

	.btn-style {
		width: 100%;
	}

	.gambar-bidang2 {
		height: 350px;
	}

	.icondepan {
		width: 100px;
		height: 100px;
		border-width: 2px 2px 2px 2px;
		margin: 8px 8px 8px 8px;
		left: 1px;
	}

	.subsektor {
		width: 100px;
		height: 100px;
	}

}

@media (max-width: 575px) {
	.hero-header-text {
		font-size: 50px;
	}

	.footer-link {
		text-align: center;
		line-height: 13px;
		font-size: 10px;
		font-family: "Lato";
		font-weight: 700;
	}

	.nav-top {
		stroke: transparent;
		background-color: #07FBFF;
		box-shadow: 0.12px 0.99px 11px #FFFB00;
	}

	.logo {
		width: 70px;
		height: 40px;
		max-width: 100px;
	}

	.apple-blue-button {
		float: none;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-4110) 0%, var(--swatch-var-Unnamed-Swatch) 100%);
		box-shadow: inset 6.69px 2.05px 4px #0432FF, inset -4.99px -0.35px 8px #0432FF, inset 0.00px -0.00px 50px #FEFFFF, inset 0.89px 0.45px 0px #FAFD00, inset 0.89px 0.45px 1px #00FCFF, inset 0.00px 0.00px 3px #FEFB00;
		line-height: 8px;
		color: var(--swatch-var-Unnamed-Swatch) !important;
		text-shadow: 0.00px 0.00px 0px #000000;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-2) !important;
		font-family: "Lato";
		font-weight: bold;
		border-radius: 20px 20px 20px 20px;
		font-size: 8px;
	}

	.profil {
		line-height: 60px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-copy-1) 0%, var(--swatch-var-Unnamed-Swatch-Copy-Copy) 40%);
		font-size: 60px;
		color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
		text-shadow: 3.89px 3.15px 0px #FFFFFF;
		background-clip: text !important;
		-webkit-background-clip: text !important;
	}

	.h4-sekretariat -style {
		font-size: 12px;
		line-height: 15px;
		text-shadow: -0.82px -0.57px 2px #000000;
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
	}

	.icon-logo-2 {
		width: 100px;
		height: 20px;
		padding: 2px 2px 2px 2px;
	}

	.icon-logo-3 {
		height: 30px;
		width: 30px;
		max-width: 40px;
		padding: 2px 2px 2px 2px;
	}

	.icon-logo-bpsdm {
		width: 100px;
		height: 20px;
	}

	.visi {
		font-size: 10px;
		line-height: 13px;
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
		text-shadow: 1.09px 1.68px 2px #000000;
	}

	.tombol-bidang {
		font-size: 8px;
		font-weight: normal;
		border-width: 1px 1px 1px 1px;
		border-color: var(--swatch-var-6651) !important;
		line-height: 9px;
	}

	.h3-kepala-bagian-style {
		font-size: 10px;
		text-shadow: 0.72px 0.69px 0px #AA7941;
		line-height: 10px;
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
		font-family: "PT Serif Caption";
		font-weight: bold;
	}

	.kadis {
		width: 90px;
		height: 90px;
	}

	.kaban {
		font-size: 12px;
		line-height: 12px;
	}

	.text-span-style {
		font-weight: normal;
	}

	.jabatan {
		line-height: 12px;
		font-family: "PT Serif";
		font-weight: bold;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		text-shadow: 1.26px 1.55px 0px #121212;
		box-shadow: inset 0.00px -0.00px 5px #FF40FF;
		border-color: var(--swatch-var-3480) !important;
		background: linear-gradient(0deg, #FEFFFF 0%, var(--swatch-var-Unnamed-Swatch-copy-4520) 100%);
		border-radius: 5px 5px 5px 5px;
		padding-bottom: 2px;
		padding-top: 2px;
		background-clip: text !important;
		-webkit-background-clip: text !important;
		font-size: 9px;
	}

	.nama {
		font-size: 11px;
		line-height: 9px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		font-weight: bold;
		font-family: "PT Sans Narrow";
	}

	.photo-aselon3 {
		width: 60px;
		height: 60px;
	}

	.icon-medsos {
		background: linear-gradient(0deg, #000000 0%, #FFFFFF 25%);
	}

	.icon-medsos-xs {
		box-shadow: inset 0.00px -2.00px 7px #0432FF;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-1) 0%, var(--swatch-var-5854) 100%);
		border-color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
		border-style: solid;
		border-width: 2px 2px 2px 2px;
		border-radius: 4px 4px 4px 4px;
	}

	.h4-18-style {
		font-size: 14px;
		line-height: 18px;
		font-family: "Roboto Slab";
		font-weight: 700;
	}

	.p-29-style {
		font-size: 12px;
		line-height: 15px;
	}

	.p-30-style {
		font-size: 10px;
	}

	.logoprov {
		text-align: center;
		width: 80px;
		height: 70px;
	}

	.footer {
		font-size: 9px;
		padding-bottom: 3px;
		border-width: 2px 2px 2px 2px;
		line-height: 10px;
		color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 0%, var(--swatch-var-5972) 28%, var(--swatch-var-Unnamed-Swatch-copy-4047) 67%);
		background-clip: padding-box !important;
		-webkit-background-clip: padding-box !important;
		box-shadow: inset 1.29px 1.53px 5px #0432FF, inset 0.00px -17.00px 43px transparent;
		font-family: "Alef";
		font-weight: bold;
		text-decoration: none;
		padding-top: 3px;
		margin: 2px 2px 2px 2px;
	}

	.judulbidang {
		font-size: 19px;
		line-height: 18px;
		font-weight: 700;
		letter-spacing: 0px;
		font-family: "Roboto Slab";
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		text-shadow: 3.06px 2.57px 2px #000000, -1.62px 1.18px 2px #000000;
	}

	.h1-bloc-44-style {
		font-size: 12px;
		line-height: 14px;
		color: var(--swatch-var-517) !important;
	}

	.bpsdm-bidang {
		width: 70px;
		height: 25px;
	}

	.bidang {
		font-size: 10px;
		line-height: 10px;
	}

	.gambar-bidang {
		width: 210px;
		height: 170px;
	}

	.defenisi-bidang {
		line-height: 12px;
		font-size: 12px;
		color: var(--swatch-var-6651) !important;
	}

	.peraturan {
		font-size: 12px;
		line-height: 11px;
	}

	.card2 {
		border-radius: 20px 20px 20px 20px;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		border-width: 2px 2px 2px 2px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-Copy) 0%, #FFFFFF 100%);
		box-shadow: inset 0.00px -2.00px 6px #0433FF;
	}

	.subbagian-judul {
		font-size: 9px;
		line-height: 10px;
		color: var(--swatch-var-5972) !important;
		font-weight: 100;
		font-family: "Roboto";
	}

	.photo-aselon4 {
		width: 60px;
		height: 60px;
	}

	.namanip-peg {
		line-height: 10px;
		font-size: 9px;
		font-weight: normal;
		font-family: "Oswald";
		color: var(--swatch-var-6651) !important;
	}

	.apple-wire-button {
		line-height: 22px;
		font-size: 12px;
	}

	.link-style {
		font-size: 10px;
		color: #000000 !important;
	}

	.container-div-style {
		width: 100%;
	}

	.gambar-bidang2 {
		width: 250px;
		height: 200px;
	}

	.judul {
		font-size: 21px;
	}

	.fontvisi {
		font-size: 9px;
		font-family: "Roboto Slab";
		font-weight: normal;
		color: var(--swatch-var-Unnamed-Swatch) !important;
		line-height: 13px;
		text-shadow: 1.20px 1.60px 0px #000000;
	}

	.icon2 {
		width: 50px;
		height: 50px;
		border-radius: 50px 50px 50px 50px;
	}

	.fonttentang {
		font-size: 12px;
		text-align: center;
		border-radius: 50px 50px 50px 50px;
	}

	.icon4 {
		height: 60px;
	}

	.font-icon {
		font-size: 9px;
		line-height: 11px;
	}

	.logolhkpn {
		height: 25px;
		width: 110px;
		border-radius: 10px 10px 10px 10px;
	}

	.logosirup {
		height: 30px;
		padding-top: 7px;
		padding-bottom: 7px;
	}

	.iconlogoptsp {
		max-width: 50px;
		height: 30px;
		width: 30px;
		padding: 2px 3px 2px 3px;
	}

	.jdihn {
		max-width: 60px;
		width: 30px;
		height: 30px;
		padding: 2px 2px 2px 2px;
	}

	.esakip {
		max-width: 60px;
		width: 50px;
		height: 20px;
	}

	.gambarjudul {
		width: 270px;
		height: 80px;
		max-width: 300px;
	}

	.judulbatanghari2 {
		font-size: 18px;
		line-height: 19px;
		text-align: center;
	}

	.defenisi {
		font-size: 10px;
		line-height: 10px;
		text-align: justify;
		color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
		text-shadow: 1.36px 1.46px 0px #FEFFFF;
	}

	.h2-style {
		line-height: 18px;
	}

	.isibatanghari {
		font-size: 9px;
		line-height: 12px;
		color: var(--swatch-var-Unnamed-Swatch-copy-11) !important;
		text-shadow: 1.18px 1.62px 0px #FEFFFF, 1.18px 1.62px 0px #FEFFFF, 1.78px 0.91px 0px #FEFFFF, 1.18px 1.62px 0px #FEFFFF;
	}

	.bupati {
		height: 60px;
		max-width: 50px;
	}

	.nama-bupati {
		font-size: 10px;
		line-height: 13px;
	}

	.img-sertifika-style {
		height: 250px;
		border-radius: 10px 10px 10px 10px;
	}

	.gambarkotak {
		width: 130px;
		height: 100px;
		box-shadow: 7.19px 5.42px 9px #000000;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-8) !important;
		border-width: 1px 1px 1px 1px;
		border-radius: 10px 10px 10px 10px;
		padding: 5px 5px 5px 5px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-Copy) 0%, #FFFFFF 100%);
	}

	.gambarlandscape {
		width: 125px;
		height: 80px;
		box-shadow: 0.64px 0.77px 3px #000000;
		padding: 3px 3px 3px 3px;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		border-radius: 10px 10px 10px 10px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-9) 0%, #FFFFFF 100%);
	}

	.shadow {
		padding-top: 5px;
		padding-bottom: 6px;
	}

	.font1 {}

	.fontabout {}

	.kotak {}

	.gambar-wisata {
		height: 160px;
		box-shadow: 5.66px 5.66px 5px #000000;
		width: 260px;
	}

	.gambarwisata2 {
		height: 50px;
		box-shadow: 2.62px 3.02px 7px #000000, inset 0.00px 0.00px 0px #000000;
		width: 80px;
	}

	.gambarwisata3 {
		width: 100px;
		height: 60px;
		box-shadow: 7.19px 6.95px 5px #000000;
	}

	.logokecil {
		height: 30px;
	}

	.icon {
		border-width: 1px 1px 1px 1px;
		border-radius: 2px 2px 2px 2px;
	}

	.logosedang {}

	.logofooter {
		width: 100px;
		height: 30px;
	}

	.gambar {
		height: 130px;
		width: 300px;
	}

	.wisataalam {
		width: 250px;
		height: 70px;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch) !important;
		border-width: 3px 3px 3px 3px;
	}

	.fontfooter {
		font-size: 8px;
		line-height: 9px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		font-weight: normal;
	}

	.menunav {
		font-size: 9px;
		padding-top: 3px;
		padding-bottom: 3px;
		margin: 1px 3px 1px 3px;
		line-height: 10px;
		width: 90px;
		border-width: 1px 1px 1px 1px;
		border-color: #FEFB00 !important;
		top: 2px;
		bottom: 2px;
		left: 2px;
		right: 2px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 0%, #FFFFFF 100%);
		color: var(--swatch-var-Unnamed-Swatch) !important;
		text-shadow: 1.77px 0.94px 0px #00FCFF;
	}

	.navbar-brand img {
		width: 100px;
		height: 35px;
	}

	.font3 {
		font-size: 14px;
		line-height: 14px;
		text-shadow: 2.43px 1.76px 1px #FEFFFF;
	}

	.namakadis {
		font-size: 12px;
	}

	.iconfungsional {
		border-width: 1px 1px 1px 1px;
		border-radius: 10px 10px 10px 10px;
		padding-bottom: 2px;
		padding-top: 2px;
		width: 40px;
	}

	.jabatan2 {
		font-size: 7px;
		color: #FEFB00 !important;
		text-shadow: 1.58px 1.23px 0px #000000;
		line-height: 8px;
		background: linear-gradient(0deg, #FF40FF 0%, #FFFFFF 100%);
		border-radius: 6px 6px 6px 6px;
		border-style: solid;
		border-color: #FF40FF !important;
		border-width: 1px 1px 1px 1px;
	}

	.tentang {
		font-size: 10px;
		line-height: 12px;
	}

	.h3-style {
		line-height: 11px;
	}

	.namapeg {
		font-size: 8px;
		line-height: 9px;
		border-width: 1px 1px 1px 1px;
		padding-top: 2px;
		padding-bottom: 2px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-4520) 0%, #FFFFFF 100%);
	}

	.contact {
		font-size: 9px;
		color: var(--swatch-var-Unnamed-Swatch-copy-7) !important;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-11) 0%, #FFFFFF 100%);
		text-shadow: 1.94px 0.48px 0px #000000;
		font-family: "Poppins";
	}

	.tentang1 {
		font-size: 12px;
		line-height: 14px;
		text-align: center;
	}

	.subjudul {
		font-size: 14px;
		line-height: 15px;
	}

	.logobesar {
		max-width: 260px;
	}

	.board1 {
		max-width: 130px;
		width: 350px;
	}

	.papanjab {
		width: 100px;
		max-width: 100px;
		border-radius: 8px 8px 8px 8px;
		border-width: 1px 1px 1px 1px;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
	}

	.namaboard {
		height: 40px;
		width: 180px;
	}

	.board2 {
		width: 120px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-Copy-Copy) 0%, #FFFFFF 100%);
		background-clip: padding-box !important;
		-webkit-background-clip: padding-box !important;
		box-shadow: inset 6.56px 7.55px 15px #FEFFFF;
		border-color: var(--swatch-var-1953) !important;
		border-style: solid;
		border-width: 1px 1px 1px 1px;
		border-radius: 10px 10px 10px 10px;
		height: 120px;
	}

	.board3 {
		height: 40px;
		width: 150px;
		border-style: solid;
		border-color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		border-radius: 5px 5px 5px 5px;
		border-width: 1px 1px 1px 1px;
		background: linear-gradient(0deg, var(--swatch-var-Unnamed-Swatch-copy-9) 0%, #FFFFFF 100%);
	}

	.icondepan {
		width: 100px;
		height: 100px;
		padding: 6px 6px 6px 6px;
		border-radius: 10px 10px 10px 10px;
		border-width: 1px 1px 1px 1px;
		margin: 10px 10px 10px 10px;
		left: 0px;
		font-size: 7px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		line-height: 7px;
		font-weight: normal;
	}

	.logodashboard {
		width: 250px;
		max-width: 300px;
	}

	.bloc-divider-b-fill {
		fill: var(--swatch-var-Unnamed-Swatch-Copy-copy-1);
		height: 66px;
	}

	.defenisigeo {
		font-size: 10px;
		line-height: 11px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		text-shadow: 1.73px 1.00px 0px #000000;
		font-family: "PT Serif";
	}

	.judulgeo {
		font-size: 12px;
		color: var(--swatch-var-Unnamed-Swatch-copy-4) !important;
		text-shadow: 0.91px 1.78px 2px #000000;
	}

	.grid-style {
		grid-template-rows: 51.00px auto 26.00px;
		height: 152px;
	}

	.grid-pariwisata-style {
		grid-template-rows: 54.00px auto;
	}

	.img-style {
		height: 386px;
	}

	.logo-dashboard {}

	.logodepan-kecil {
		width: 140px;
		height: 50px;
	}

	.judulaccordion {
		color: var(--swatch-var-Unnamed-Swatch-copy-1) !important;
		font-family: "BarcadeExpanded";
		font-size: 20px;
		line-height: 20px;
		text-align: center;
	}

	.accordion {
		background-image: url("img/background%20gentala.png");
		background-image: -webkit-image-set(url("img/background%20gentala.webp") 1x,
				url("img/background%20gentala.webp") 2x);
		background-image: image-set(url("img/background%20gentala.png") 1x,
				url("img/background%20gentala.png") 2x, url("img/background%20gentala.webp") 1x,
				url("img/background%20gentala.webp") 2x);
	}

	.icondepan2 {
		border-radius: 10px 10px 10px 10px;
		padding: 5px 5px 5px 5px;
	}

	.judulpilihan {
		font-size: 16px;
		line-height: 18px;
	}

	/* Mobile Text Margin Offsets */
	.mg-clear-xs {
		margin: 0;
	}

}

/* Custom Style */
.d-none {
	display: none;
}

.flex-grow {
	flex-grow: 1;
}

.ml-2 {
	margin-left: 0.5rem !important;
}

.mr-2 {
	margin-right: 0.5rem !important;
}

#lightbox-modal .prev-lightbox,
#lightbox-modal .next-lightbox {
	display: none !important;
}

#lightbox-modal .close-lightbox {
	position: absolute;
	top: 5px;
	right: 5px;
	z-index: 1000;
	background: rgba(0, 0, 0, 0.5);
	border: 0;
	border-radius: 5px;
	padding: 5px;
}

.lightbox-close-svg {
	display: block;
}

.lightbox-close-svg path {
	fill: none;
	stroke: #FFF;
	stroke-width: 2px;
}

.left-navigation {
	visibility: hidden;
}

.map-container .left-navigation {
	visibility: visible !important;
}

.login-form {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	height: 100vh;
	z-index: 10000;
	background: rgba(0, 0, 0, 0.5);
}

.login-form>.page-content {
	display: block;
	margin: 0 auto;
	max-width: 500px;
	margin-top: 100px;
	padding: 20px;
	box-shadow: 0px 0px 15px rgba(255, 255, 255, 0.5);
	border-radius: 10px;
	overflow: hidden;
}

.login-form>.page-content h4 {
	margin: -20px;
	margin-bottom: 20px;
	padding: 15px;
	background: #191A22;
	color: #FFF;
}

.login-form>.page-content h4:after {
	content: "\f057";
	display: inline-block;
	font: normal normal normal 20px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	float: right;
	cursor: pointer;
}

.login-form>.page-content hr {
	display: none;
}

.show-login-form .login-form {
	display: block;
}

#bloc-0 {
	padding: 0 30px !important;
}

.map-container {
	position: relative !important;
	padding: 10px !important;
	border-radius: 5px !important;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.map-container {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: calc(100vh);
	z-index: 1;
	background: #FFF;
}

#map {
	width: 100%;
	height: 100%;
}

#main-overlay,
.main-overlay {
	position: absolute;
	width: max-content;
	max-width: 300px;
	left: 50%;
	bottom: 50px;
	transform: translateX(-50%);
	background: #FFF;
	padding: 10px;
	box-shadow: 0 5px 10px 0px rgb(0 0 0 / 20%);
	border-radius: 5px;
}

#main-overlay::after,
.main-overlay::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #FFF;
	position: absolute;
	left: 50%;
	bottom: -10px;
	transform: translateX(-50%);
}

.direction-controls {
	margin-top: 0px !important;
}

.left-navigation {
	position: absolute !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
	z-index: 9999999 !important;
	height: 100% !important;
}

.potensi-view {
	padding-top: 10px !important;
	left: 85px !important;
	padding-bottom: 10px !important;
}

.gmnoprint[role='menubar']>div button {
	width: 28px;
	height: 30px;
}

.gmnoprint[role='menubar']>div button span>div {
	width: 25px !important;
	text-align: center;
}

.gmnoprint[role='menubar']>div button span>div img {
	width: 20px !important;
}

.action-controls button,
.direction-controls button {
	width: 28px !important;
}

.action-controls button span,
.action-controls button i,
.direction-controls button span,
.direction-controls button i {
	font-size: 24px !important;
}

.potensi-view-container .info h5 {
	color: #000;
}

.potensi-view-container .mulai-navigasi {
	color: #FFF;
}

.navigation-controls button {
	color: #FFF;
}

.navigation-controls button.btn-default {
	background: #fff;
}

.badge.kecamatan {
	background: red;
	font-size: 10px;
}

.badge.kelurahan {
	background: blue;
	font-size: 10px;
}

#map .gm-style::after {
	top: 10px;
}

#map-overview .gm-style::after {
	display: none !important;
}

.kecamatan-list-item {
	align-items: center;
	min-height: 32px;
}

.sektor-list-item .icon {
	background: transparent;
	border: 0;
	font-size: 18px;
}

.show-share-loc .share-loc {
	bottom: unset !important;
	top: 0px;
	border-radius: 0;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.show-street-view .sticky-nav {
	visibility: hidden;
}

/* Login */
.login-form .input-group-text {
	height: 100%;
	display: block;
	width: 40px;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

.login-form .input-group {
	margin: 10px 0;
}

.login-form .btn-block {
	width: 100%;
	margin-bottom: 20px;
}

@media (max-width: 575px) {
	#bloc-0 {
		padding: 0 !important;
	}

	#bloc-0 .peta-potensi-container.py-5,
	#bloc-0 .peta-potensi-container.py-2 {
		padding: 10px 0px !important;
	}
}

@media (max-width: 450px) {
	#bloc-0 {
		padding: 0 !important;
	}

	#bloc-0 .peta-potensi-container.py-5,
	#bloc-0 .peta-potensi-container.py-2 {
		padding: 0px 0px !important;
	}

	#bloc-0 .container-fluid {
		padding: 0px 0px !important;
		padding-bottom: 20px !important;
	}

	.map-container {
		padding: 0 !important;
	}
}

/* Custom Menu */
/* .navbar-brand img {
    width: 100px;
    height: auto !important;
}

.menunav{
    background: linear-gradient(0deg, #0432FF 0%, #FFFFFF 100%);
    color: #FFF !important;
    text-shadow: 0 0 5px #000;
} */

@media (max-width: 575px) {
	.nav .row div:nth-child(1) {
		text-align: left !important;
		margin-bottom: 0px !important;
	}

	.nav .row div:nth-child(2) {
		position: absolute;
		width: 40px;
		height: 40px;
		border: 1px solid #0149FF9a;
		right: 0px;
		top: 50%;
		transform: translatey(-50%);
		cursor: pointer;
		border-radius: 5px;
		box-shadow: 2px 2px 0px rgba(0, 0, 0, 0.5);
	}

	.show-nav .nav .row div:nth-child(2) {
		background: rgba(0, 0, 0, 0.1);
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
	}

	.nav .row div:nth-child(2) .menunav {
		display: none;
	}

	.nav .row div:nth-child(2)::before {
		font-family: 'Material Icons';
		content: "menu";
		font-size: 28px;
		-webkit-font-feature-settings: 'liga';
		color: #0149FF;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}

	.show-nav .nav .row div:nth-child(2) {
		position: fixed;
		width: 200px !important;
		height: 100vh;
		top: 0;
		right: 0;
		z-index: 10000;
		padding-top: 60px;
		transform: unset !important;
		border: 0;
		padding: 10px 20px;
	}

	.show-nav .nav .row div:nth-child(2) .menunav {
		display: block;
	}

	.show-nav .nav .row div:nth-child(2)::before {
		content: "";
		position: absolute;
		left: unset;
		top: 0;
		right: 0;
		width: 100%;
		height: 100vh;
		z-index: 0;
		transform: unset !important;
	}

	.show-nav .nav .row div:nth-child(2)::after {
		content: "";
		position: fixed;
		left: unset;
		top: 0;
		right: 0;
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0);
		z-index: -1;
		transform: unset !important;
	}

	.nav .row div:nth-child(2) .menunav {
		text-align: center;
		margin: 8px 0;
		max-width: unset;
		width: 100%;
		font-size: 14px;
		padding: 5px 10px !important;
		color: #FFF !important;
		text-shadow: 1.77px 0.94px 0px #000 !important;
		letter-spacing: 3px;
		font-family: "Arial" !important;
		font-weight: 700 !important;
	}
}

@media (max-width: 575px) {
	#bloc-0.nav {
		padding: 8px 20px !important;
	}

	/* .logofooter {
		width: 200px;
		height: auto;
	} */
	.nav .row div:nth-child(2) .menunav {
		font-size: 10px;
		padding: 10px 10px !important;
	}
}

@media (min-width: 891px) {
	.map-container {
		height: calc(100vh - 110px);
	}
}

@media (max-width: 890px) {
	.map-container {
		height: calc(100vh - 110px);
	}
}

@media (max-width: 802px) {
	.map-container {
		height: calc(100vh - 130px);
	}
}

@media (max-width: 768px) {
	.map-container {
		height: calc(100vh - 135px);
	}
}

@media (max-width: 575px) {
	.map-container {
		height: calc(100vh - 150px);
	}

	.peta-potensi-container .container-fluid {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}
}

@media (max-width: 450px) {
	.map-container {
		height: calc(100vh - 125px);
	}

	.peta-potensi-container .container-fluid>.row>.col-12 {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}
}

/* @media (max-width: 991px){
    .footer{
        box-shadow: inset 1.29px 1.53px 12px #0432FF;
        color: #0432FF !important;
        line-height: 22px;
    }
}

@media (max-width: 575px){
    .footer{
        line-height: 15px;
    }
} */

@media (max-width:992px) {
	.hover-tilt-label {
		font-size: 30px;
	}
}

@media (max-width:768px) {
	.hover-tilt-label {
		font-size: 20px;
	}
}


.braintsystems {
	font-size: 8px;
	text-shadow: 1px 1px 0px #000;
}

.braintsystems a {
	color: #0e218d;
	text-shadow: 0px 0px 0px #000 !important;
	text-decoration: none;
}

@media (min-width:575px) {
	.braintsystems {
		font-size: 10px;
	}
}

@media (max-width: 480px){
    .nearby-item {
        padding: 0px !important;
        font-size: 10px !important;
    }
    .nearby-item .img-view {
        min-width: 60px !important;
        width: 60px !important;
        height: 40px !important;
    }
    .nearby-item .detail-view .nama-usaha {
        font-size: 12px !important;
        margin-bottom: 0px !important;
    }
    .nearby-item .detail-view .alamat {
        font-size: 10px !important;
        line-height: 12px !important;
    }
}