/**

  Style   : Frontend web theme OpenSID
  Version : 1.3.5
  Author  : Diki Siswanto

 **/

html {
	scroll-behavior: smooth;
}
body {
	background: #f0f0f0;
}

/* Header */
.top-header {
	background: #008080;
	/* background: linear-gradient(to right, teal,  #6ed3cf, cornflowerblue, #9068be); */
}
.top-header .container {
	display: flex;
	justify-content: space-between;
}
.top-header ul {
	list-style: none;
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
}
.top-header ul li {
	display: inline-flex;
	font-size: 85%;
	color: whitesmoke;
}
.top-header ul > li > a {
	padding: 6px 10px;
	color: whitesmoke;
}
.top-header ul > li:first-child > a {
	padding-left: 1px;
}
.top-header ul > li > a:hover {
	text-decoration: none;
	color: #ffa500;
}
.top-header .meta-desa ul {
	display: flex;
	justify-content: flex-end;
}
.top-header .meta-desa ul li {
	padding: 6px 10px;
}
.top-header .meta-desa ul li:last-child {
	padding-right: 0;
}
.top-header .meta-desa ul li span {
	padding: 0px 5px;
}
.top-header .meta-desa ul li:last-child span {
	padding-right: 0;
}

/* Teks Berjalan */
.teks-berjalan {
	background: rgba(9,9,9,.04);
	border-bottom: 1px solid #e2e1e1;
}
.teks-berjalan .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.teks-berjalan .teks-wrapper {
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 0px 7px;
	font-weight: bold;
	color: aliceblue;
	background: #a52a2a;
}
.teks-berjalan .teks-wrapper::after{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	left: 100%;
	border: 12px solid transparent;
	border-left: 12px solid #a52a2a;
	z-index: 3;
}
.teks-berjalan ul.marquee {
	margin: 0;
	padding: 3px 0;
	overflow: hidden;
	list-style-type: disc;
}
.teks-berjalan ul li {
	display: inline-flex;
	justify-content: space-between;
	margin-right: 20px;
}

/* Identitas Desa */
.identitas-desa {
	padding: 20px 0;
	background: url('../image/bg-header.png');
}
.identitas-desa .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.identitas-desa .brand {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-weight: bold;
}
.identitas-desa .brand:hover {
	text-decoration: none;
}
.identitas-desa .brand .logo {
	width: 75px;
	height: auto;
	margin-right: 16px;
}
.identitas-desa .brand .detail .h1 {
	font-size: calc(23px + 6 * ((100vw - 320px) / 680));
	color: teal;
	font-weight: bold;
}
.identitas-desa .brand .detail .ket {
	font-size: calc(13px + 6 * ((100vw - 320px) / 680));
	color: #555;
}

/* Navigation Menu */
#navigation {
	min-height: 50px;
}
nav.nav {
	background: #22264b !important;
	padding: none;
	animation-duration: 0.2s;
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	font-size: calc(14px + 6 * ((100vw - 320px) / 680));
}
nav.nav .container {
	display: flex;
	align-items: center;
	flex-direction: column;
}
nav #navMenu {
	background: #22264b !important;
}
nav #navMenu li a {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 12px;
	background: #22264b !important;
	color: #ccc !important;
	padding: 15px 18px 15px 12px;
	margin-bottom: 0;
	line-height: 1.5rem;
	transition: all .3s;
}
nav #navMenu li:first-child a i {
	color: #ccc;
}
nav #navMenu li:first-child a:hover i {
	color: #FF5737;
}
nav #navMenu li.menu-active > a, nav #navMenu li.active a {
	background: #181b35 !important;
	color: #fff !important;
}
nav #navMenu li ul.sub-menu {
	background: #22264b !important;
	z-index: 9999;
}
nav #navMenu li ul.sub-menu li a {
	padding: 10px 12px;
}
nav .menu-toggle {
	background: #22264b !important;
}
nav .menu-toggle .val {
	color: #fff;
}
nav .menu-toggle #menu-btn {
	border: none;
	background: transparent !important;
	margin-left: 0 !important;
}
.search-button > .btn, .search-button > .btn:active, .search-button > .btn:focus {
	border: 0;
	box-shadow: none;
	color: #fff;
}

/* Slider */
.slider {
	padding: 0;
	margin: 0;
	background: #f5f5f5;
}
#slides .item {
	display: block;
	overflow: hidden;
}
#slides .item img {
	width: 100%;
	object-fit: cover;
	height: 250px;
}

/* Artikel Area */
.headline {
	border-left: 5px solid #ffa500;
}
.headline .jumbotron {
	padding: 0;
	margin: 0;
}
.headline .headline-berita {
	padding-top: 45px;
	padding-bottom: 45px;
	padding-left: 6vw;
	padding-right: 25px;
	color: #555;
}
.headline .headline-berita a:hover {
	text-decoration: none;
}
.headline .headline-gambar {
	min-width: 30%;
	margin: 0;
	padding: 0;
}
.headline .headline-gambar img {
	height: 100%;
	width: 600px;
	object-fit: cover;
}
#artikel-area {
	background: #f5f5f5;
}
#artikel-area .h3 {
	font-family: 'Montserrat', 'Roboto', sans-serif;
	font-weight: 700;
	font-size: calc(18px + 6 * ((100vw - 320px) / 680));
}
#article-content-wrapper [class*=col-]{
	-webkit-box-direction: normal;
	-webkit-box-orient: horizontal;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-flow: row wrap;
	overflow: hidden;
	object-fit: fill;
}
#article-content-wrapper .card {
	-ms-flex-flow: column;
	-webkit-box-direction: normal;
	-webkit-box-orient: vertical;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-flow: column;
	width: 100%;
	height: 100%;
	position: relative;
	background: #fff;
	color: #555;
	box-shadow: 0px 0px 8px rgba(9,9,9,.15);
}
#article-content-wrapper .card .card-image a {
	display: block;
	position: relative;
	overflow: hidden;
}
#article-content-wrapper .card .card-image a .flash {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
  transition: all 0.3s .09s cubic-bezier(0.39, 0.575, 0.565, 1);
}
#article-content-wrapper .card .card-image img {
	width: 100%;
	height: 180px;
	object-fit: cover;
}
#article-content-wrapper .card .card-image a:hover .flash {
	-webkit-transform: translate(100%);
	transform: translate(100%);
	background: linear-gradient(to right,rgba(255,255,255,.1), rgba(255,255,255,.3), transparent, transparent, transparent, transparent, transparent);
}
#article-content-wrapper .card .card-body {
	flex-grow: 1;
	padding-bottom: 8px;
}
#article-content-wrapper .card .card-body a {
	text-decoration: none !important;
}
#article-content-wrapper .card .card-body .kategori-berita {
	width: auto;
	background: teal;
	color: #fff;
	padding: 3px 5px;
	font-size: 80%;
}
#article-content-wrapper .card .card-body .judul-berita {
	width: auto;
	color: #22264b;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	font-weight: 700;
	border-bottom: 1px solid #f5f5f5;
}
#article-content-wrapper .card .card-body a:hover .judul-berita {
	color: #60299e;
}
.meta-berita {
	display: flex;
	justify-content: space-between;
	font-size: 75%;
	color: #909090;
}
.meta-berita span {
	margin-right: 5px;
}
.meta-berita span i {
	margin-right: 5px;
}
img.lazy, img.owl-lazy {
	background-image: url('../image/dot-loading.gif');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

/* Pagination */
.halaman-ke {
	font-size: 85%;
	text-align: center;
	color: #909090;
	padding-top: 10px;
	padding-bottom: 10px;
}
.page-link {
	color: cornflowerblue;
}
.page-link:hover {
	color: #3365c2;
}

/* Kolom Telusuri Dengan */
#telusuri-by {
	background: #fff;
	padding-top: 40px;
	padding-bottom: 40px;
}
.kolom-telusuri {
	display: grid;
	grid-template-rows: auto;
	grid-template-columns: auto;
	justify-content: center;
	align-items: center;
	grid-column-gap: 55px;
	grid-row: 25px;
	margin: 0 -15px	;
}
.kolom-telusuri a {
	position: relative;
	display: flex;
 	justify-content: center;
 	align-items: center;
 	flex-direction: column;
 	text-align: center;
}
.kolom-telusuri a:hover {
	text-decoration: none;
}
.kolom-telusuri a .fa {
	display: flex;
	font-size: calc(60px + 6 * ((100vw - 320px) / 680));
	align-items: center;
	justify-content: center;
	width: calc(150px + 6 * ((100vw - 320px) / 680));
	height: calc(150px + 6 * ((100vw - 320px) / 680));
 	border-radius: 50%;
}
.kolom-telusuri a span {
	font-weight: bold;
	font-size: calc(20px + 6 * ((100vw - 320px) / 680));
	padding: 10px;
	display: flex;
	font-family: 'Montserrat', sans-serif;
}
.kolom-telusuri .berita a {
	color: #0d9aac;
}
.kolom-telusuri .berita a:hover {
	color: #076d7a;
}
.kolom-telusuri .berita a .fa {
	border: 8px solid #0d9aac;
}
.kolom-telusuri .berita a:hover .fa {
	border: 8px solid #076d7a;
}
.kolom-telusuri .agenda a {
	color: #FF5737;
}
.kolom-telusuri .agenda a:hover {
	color: #cf3213;
}
.kolom-telusuri .agenda a .fa {
	border: 8px solid #FF5737;
}
.kolom-telusuri .agenda a:hover .fa {
	border: 8px solid #cf3213;
}
.kolom-telusuri .peraturan a {
	color: #9068be;
}
.kolom-telusuri .peraturan a:hover {
	color: #6028a1;
}
.kolom-telusuri .peraturan a .fa {
	border: 8px solid #9068be;
}
.kolom-telusuri .peraturan a:hover .fa {
	border: 8px solid #6028a1;
}

/* Layanan Mandiri */
#layanan-mandiri {
	background: url('../image/bg_green.jpg') no-repeat center center fixed;
	background-size: cover;
	overflow: hidden;
}
#layanan-mandiri .container {
	display: flex;
	align-items: center !important;
	justify-content: flex-start;
}
#layanan-mandiri .mandiri-headline {
	display: flex;
	align-items: center !important;
	color: #fff;
	margin: 20px 0;
	padding-left: 0;
	padding-right: 0;
}
#layanan-mandiri .mandiri-headline .h3 {
	font-size: calc(18px + 6 * ((100vw - 320px) / 680));
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
}
#layanan-mandiri .form-mandiri-login {
	background: rgba(23, 26, 52, .6);
	color: #fff;
	margin: 20px 0;
}
#layanan-mandiri .form-mandiri-login form {
	padding: 50px 0;
}
#layanan-mandiri .form-mandiri-login .form-control {
	background: transparent;
	border: 1px solid #ccc;
	color: #cecece;
}
#layanan-mandiri .form-mandiri-login .form-control:focus {
	/* background: rgb(255, 255, 255, .6); */
	color: #fff
}
#layanan-mandiri ul.list-layanan {
	margin: 0;
	padding: 30px 0;
	list-style: none;
}
#layanan-mandiri ul.list-layanan li {
	display: block;
	margin: 8px auto;
}
#layanan-mandiri ul.list-layanan li > a {
	display: block;
	color: #fff;
}
#layanan-mandiri ul.list-layanan li > a.btn-item {
	border: 2px solid #008080;
	transition: all .3s;
}
#layanan-mandiri ul.list-layanan li > a.btn-item:hover {
	background: #008080;
}
.modul-mandiri table tr td {
	padding: 5px 12px;
}

/* Galeri Foto */
#galeri-foto {
	padding: 50px 0;
	background: #f5f5f5;
}
#galeri-foto .galeri-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 0px;
	margin-bottom: 20px;
}
#galeri-foto .h3 {
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
	font-size: calc(18px + 6 * ((100vw - 320px) / 680));
}
.btn-lihat-semua {
	color: #181b35;
	border:1px solid #181b35;
}
.btn-lihat-semua:hover {
	color: #fff;
	border:1px solid #181b35;
	background: #181b35;
}
.galeri-wrapper {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	margin-bottom: 20px;
}
.galeri-wrapper .item-foto {
	display: block;
	overflow: hidden;
}
.galeri-wrapper a {
	transition: all .3s;
}
.galeri-wrapper img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	filter: grayscale(1);
	transition: all .3s;
}
.galeri-wrapper .item-foto:hover img {
	filter: grayscale(0);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}
.album .galeri-wrapper {
	column-gap: 5px;
	row-gap: 5px;
}

/* Akses Data */
#akses-data {
	background: #fff;
	padding: 60px 0px 100px;
}
#akses-data .h3 {
	color: #008080;
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
	font-size: calc(18px + 6 * ((100vw - 320px) / 680));
	text-align: center;
	padding: 10px 0px 30px;
}
#akses-data-wrapper .item {
	font-weight: 700;
	font-family: 'Montserrat', sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 25px;
	height: 120px;
	border: 3px solid cornflowerblue;
	background: url('../image/bg_batik.png');
	border-radius: 8px;
}
#akses-data-wrapper .item a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	transition: all .3s;
}
#akses-data-wrapper .item a:hover {
	color: #181b35;
	text-decoration: none;
	font-size: 110%;
}
#akses-data-wrapper .item a:hover .layer {
	background: linear-gradient(to right, rgba(128, 87, 0, 0.25),  rgba(110, 211, 207, .25), rgba(100, 149, 237, .25), rgba(144, 104, 190, .25));
}
#akses-data-wrapper .item .layer {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	transition: all .3s !important;
	/* background: linear-gradient(to right, rgba(128, 87, 0, 0.45),  rgba(110, 211, 207, .45), rgba(100, 149, 237, .45), rgba(144, 104, 190, .45)); */
}
#akses-data-wrapper .item .jenis-akses-data {
	color: #22264b;
	z-index: 3;
	font-family: 'Montserrat', sans-serif;
}

/* APDES Progressbar  */
#apdes {
	padding-top: 60px;
	padding-bottom: 100px; 
}

/* Footer */
footer {
	text-align: center;
	background: url('../image/bg-header.png');
	padding: 20px 15px;
	border-top: 1px solid #ccc;
	margin-bottom: -70px;
}
footer .logo {
	max-width: 80px;
	height: auto;
	margin: auto;
	margin-top: -70px;
	margin-bottom: 10px;
}
footer .detail {
	position: relative;
}
footer .detail span {
	display: block;
	color: #22264b;
	font-size: 87%;
}
footer .detail::before {
	margin: auto;
	content: '';
	position: absolute;
	bottom: -10px;
	-ms-transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	height: 1px;
	width: 150px;
	background: #ccc;
}
footer .copyright {
	margin-top: 40px;
}
footer .copyright span{
	display: block;
	color: #181b35;
	font-size: 78%;
}
footer .copyright a {
	color: #6028a1;
	font-weight: 500;
}

/* Tombol Kembali Ke Atas */
.tombol-ke-atas {
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	bottom: 3.5vw;
	right: 3.5vw;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #a52a2a;
	box-shadow: 2px 2px 10px rgba(9,9,9,.2);
	z-index: 7777;
	color: #fff;
	animation-duration: .5s;
	animation-name: slideInUp;
	transition: all .3s;
}
.tombol-ke-atas.hide {
	transition: all .3s;
	display: none;
}
.tombol-ke-atas:hover {
	text-decoration: none;
	color: #fff;
}
.tombol-ke-atas .fa {
	font-size: 20px;
}

/* Main - Single Content */
main {
	margin-top: 25px;
	padding-bottom: 120px;
}
main .col-lg-8 {
	padding: 15px 20px 15px;
	margin-bottom: 20px;
}
h2.judul-artikel {
	padding: 10px 0;
	color: #22264b;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: calc(21px + 6 * ((100vw - 320px) / 680));
}
.posting .meta-berita {
	justify-content: flex-start;
	flex-direction: column;
	padding: 8px 3px;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	margin-bottom: 15px;
}
.posting .meta-berita span {
	padding: 2px 0;
}
.posting figure img {
	width: 100%;
	height: 300px;
	object-fit: cover;
}
article {
	padding: 0px 3px;
	color: #555;
	word-wrap: break-word;
}
#form-komentar table tr td {
	margin-bottom: 10px;
}

/* Modal search form */
body.search-form-open {
	position: relative;
}
.search-form-open header, .search-form-open nav, .search-form-open #main-content, .search-form-open footer {
	filter: blur(5px);
	-webkit-filter: blur(5px);
	box-shadow: none;
}
#modal-search-form {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(9,9,9,.7);
	z-index: 99999;
	visibility: visible;
	animation-duration: .2s;
	animation-name: slideInDown;
}
#modal-search-form form {
	width: calc(90vw - 10px);
}
#modal-search-form form input.form-control {
	border: none;
	border-bottom: 1px solid rgb(238, 238, 238, .7);
	border-radius: 0;
	color: #f5f5f5;
	padding-left: 3px;
	font-size: 120%;
}
#modal-search-form form input.form-control:focus {
	border-bottom: 1px solid rgb(238, 238, 238, 1);
	box-shadow: none;
}
#modal-search-form form input.form-control::placeholder {
	color: #f5f5f5;
}
#modal-search-form form .input-group-append .btn {
	background: transparent !important;
	color: #f5f5f5;
	border: none;
	border-bottom: 1px solid rgb(238, 238, 238, .5);
	border-radius: 0;
}
#modal-search-form .close-search-form {
	position: fixed;
	top: 20px;
	right: 5vw;
	background: transparent;
	border: 0;
	padding: 3px;
	color: #fff;
}
.close-search-form i, .close-search-form span {
	display: block;
}
#modal-search-form .close-search-form.btn:focus, .close-search-form.btn:active {
	box-shadow: none;
}

/* Kustomisasi Widget */
aside {
	padding-right: 0 !important;
	padding-left: 0 !important;
}
aside .widget {
	max-width: 100%;
  width: 100%;
}
aside .widget .box {
  margin: 0;
  padding: 12px 15px;
	background: #fff;
	margin-bottom: 15px;
	box-shadow: 0px 0px 4px rgba(9,9,9,.1);
}
aside .widget .box h3.box-title {
	position: relative;
	background: #008080;
	color: #fff;
	margin-bottom: 15px;
	margin-left: -27px;
	padding: 10px 15px 10px 30px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: calc(15px + 6 * ((100vw - 320px) / 680));
}
aside .widget .box h3.box-title i {
	font-size: 95%;
}
aside .widget .box h3.box-title:before {
	content: '';
	position: absolute;
	left: 0;
	top: 100%;
	border: 6px solid transparent;
	border-right: 6px solid #023535;
	border-top: 6px solid #023535;
}
aside .widget .box iframe {
	width: 100% !important;
}
form#search {
	margin: -12px -15px;
}
form#search input {
	border-color: #f5f5f5;
	border-right: 0;
	box-shadow: 0 0 0;
	color: #555;
}
form#search .input-group-append button{
	background: #fff !important;
	border-radius: 0;
}
aside .widget .box ul {
	list-style: none;
}
aside .widget .box .box-title a {
	color: #fff;
}
aside .widget .box .box-title a:hover {
	text-decoration: none;
	color: #f1f1f1;
}
aside .widget .box .box-body > a img {
	margin-right: 5px !important;
	margin-bottom: 10px !important;
}
aside .widget .box .box-body > a:hover {
	text-decoration: none;
}
aside .widget .box ul li a {
	display: block;
	border-bottom: 1px solid #f1f1f1;
	color: #555;
	padding: 6px 0;
}
aside .widget .box ul li a:hover {
	text-decoration: none;
	color: #000;
}
aside .widget #aparatur_desa {
	overflow: hidden;
}
aside .widget .box-body h4 {
	margin-top: 15px;
	font-size: 16px;
}
aside .widget .box-body input {
	border: 1px solid #008080;
	width: 100%;
	margin-bottom: 10px;
	padding: 5px 10px;
	background: #fffefe;
}
aside .widget .box-body #but {
	background: #181b35;
	color: #fff;
	padding: 8px 15px;
	border: 0;
}
aside .widget .box-body #note {
	margin: 5px 0;
	background: rgb(255, 0, 0, .9);
	padding: 10px 15px;
	color: #fff;
}
aside table#mandiri tr td {
	padding: 5px;
}
aside table#mandiri tr td > h4 {
	margin-top: 5px;
	margin-bottom: 0;
	padding: 0;
}
aside table#mandiri tr td > h4 .btn-primary {
	background: transparent;
	border: 1px solid #076d7a;
	color: #076d7a;
	transition: all .4s;
}
aside table#mandiri tr td > h4 a:hover {
	text-decoration: none;
}
aside table#mandiri tr td > h4 a:hover .btn-primary {
	background: #076d7a;
	color: #fff;
}
aside .info-desa table tr td {
	padding: 5px 10px;
	font-size: 85%;
}
aside ul#li-komentar a img {
	width: 48%;
	height: 130px;
	object-fit: cover;
	margin-bottom: 5px;
}
aside ul#li-komentar li {
	margin-bottom: 20px;
	font-size: 14px;
}
aside ul#li-komentar li i {
	padding-right: 10px;
}
aside ul#li-komentar li a {
	padding: 5px;
	color: skyblue;
	display: block
}
aside ul#li-komentar li br {
	display: none;
}
aside ul#ul-menu {
	list-style: square;
	margin-left: 18px
}
aside #container table {
	width: 100%;
	padding: 0;
	margin: 0;
}
aside #container table tbody tr {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
aside #container table tbody tr td:last-child {
	text-align: right;
}
aside .widget ul.nav.nav-tabs>li a {
	display: inline-block;
	padding: 8px 10px;
}
aside .widget ul.nav.nav-tabs>li a.active.show {
	background: #fff;
	color: #222;
	border-radius: 5px 5px 0 0;
	border: 1px solid #ccc;
	border-bottom: 0;
}

/* Halaman statistik */
.box-stats .btn-group {
	border: 1px solid #007bff;
}
.box-stats .btn-group.btn-group-sm .btn {
	font-size: 80%;
	padding: 5px;
}
.box-stats .btn {
	border-radius: 0;
}
.box-stats .btn-default {
	background: transparent;
	color: #007bff;
}
.stat .tr-lebih {
	transition: all 1s;
	animation-duration: 1s;
	animation-name: fadeInDown;
}
.stat table {
	font-size: 95%;
	color: #555;
}
#showData {
	background: #008080;
}

/* Halaman error 404 */
#notfound {
  position: relative;
	height: 100vh;
}

#notfound .notfound {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}
.notfound {
  max-width: 520px;
  width: 100%;
  text-align: center;
  line-height: 1.4;
}
.notfound .notfound-404 {
  height: 190px;
}
.notfound .notfound-404 .h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: 146px;
  font-weight: 700;
  margin: 0px;
  color: #232323;
}
.notfound .notfound-404 .h1 > span {
  display: inline-block;
  width: 120px;
  height: 120px;
  background-image: url('../image/emoji.png');
  background-size: cover;
  -webkit-transform: scale(1.4);
	-ms-transform: scale(1.4);
	transform: scale(1.4);
  z-index: -1;
}
.notfound .h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 22px;
  font-weight: 700;
  margin: 0;
  text-transform: uppercase;
	color: #232323;
	padding-left: 10px;
	padding-right: 10px;
}
.notfound p {
  font-family: 'Montserrat', sans-serif;
	color: #787878;
	font-weight: 400;
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
}
.notfound a {
  font-family: 'Montserrat', sans-serif;
  display: inline-block;
  padding: 12px 30px;
  font-weight: 700;
  background-color: #008080;
  color: #fff;
  border-radius: 40px;
  text-decoration: none;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
}
.notfound a:hover {
  opacity: 0.8;
}

/* Media Query Khusus */
@media screen and (min-width: 800px) {
	nav.nav .container {
		flex-direction: row;
	}
	nav.nav.fixed {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 10000;
		box-shadow: 0px 5px 20px 8px rgba(9,9,9,.35);
		animation-duration: 0.8s;
		-webkit-animation-name: slideInDown;
		animation-name: slideInDown;
	}
	nav #navMenu, nav #navMenu li > a {
		display: flex;
		align-items: center;
	}
	nav #navMenu li ul.sub-menu li > a{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	#modal-search-form form {
		width: calc(50vw - 10px);
	}
	#slides .item img {
		height: 450px;
	}
	.kolom-telusuri {
		grid-template-columns: repeat(3, auto);
	}
	.galeri-wrapper {
		grid-template-columns: repeat(4, 1fr);
	}
	.album .galeri-wrapper {
		grid-template-columns: repeat(3, 1fr);
	}
	.posting .meta-berita {
		flex-direction: row;
	}
	.posting .meta-berita span {
		margin-right: 35px;
	}
	.posting  figure img {
		height: 350px;
	}
	aside {
		padding-left: 30px !important;
	}
	aside .widget .box h3.box-title {
		font-size: calc(12px + 6 * ((100vw - 320px) / 680));
	}
}
@media screen and (max-width: 767px){
	.notfound .notfound-404 {
    height: 115px;
  }
  .notfound .notfound-404 .h1 {
    font-size: 86px;
  }
  .notfound .notfound-404 .h1>span {
    width: 86px;
    height: 86px;
  }
	.article-content-wrapper [class*='col-'] {
		padding-left: 0;
		padding-right: 0;
	}
	.posting  figure img {
		height: 180px;
	}
	#galeri-foto .item-foto img {
		height: 120px;
	}
	.album .galeri-wrapper {
		grid-template-columns: repeat(1, auto);
	}
}