section {
	  padding: 40px 0;
	  overflow-x: hidden;
	}

	.navbar { background-color:rgba(0,0,0,0.3) !important; transition: background-color 1s ease; }
	.navbar.scrolled { background-color:rgba(0,0,0,0.8) !important; transition: background-color 1s ease; }
	@media (max-width: 991px) {
		.navbar { background-color:rgba(0,0,0,0.7) !important; transition: background-color 1s ease; }
	}

	.navbar-dark .navbar-text {
	  margin:6px 0 0 6px;
	}
	
	.navbar .search-area {
	  display: none;
	  z-index: 9999;
	}
	
	.navbar .icon-close { cursor:pointer; }
		
	
	.navbar .search-area-inner {
	  position: fixed;
	  top: 0;
	  right: 0;
	  width: 100vw;
	  height: 100vh;
	  background: rgba(255, 255, 255, 0.99);
	  padding: 20px !important;
	}
	
	.navbar .search-area-inner .close-btn {
	  position: absolute;
	  top: 20px;
	  right: 20px;
	}
	
	.navbar .search-area-inner .row {
	  width: 100%;
	}
	
	.navbar .search-area-inner .form-group {
	  position: relative;
	}
	
	.navbar .search-area-inner .submit {
	  background: none;
	  border: none;
	  position: absolute;
	  right: 10px;
	  bottom: 15px;
	}
	
	.navbar .search-area-inner input {
	  width: 100%;
	  border: none;
	  border-bottom: 1px solid #ddd;
	  background: none;
	  padding: 10px 0;
	  font-size: 1.6em;
	  font-weight: 300;
	  font-family: "Open Sans", sans-serif;
	}
	
	.navbar .search-area-inner input::-moz-placeholder {
	  font-family: "Open Sans", sans-serif;
	  color: #555;
	  font-weight: 300;
	  font-size: 1.1em;
	}
	
	.navbar .search-area-inner input::-webkit-input-placeholder {
	  font-family: "Open Sans", sans-serif;
	  color: #555;
	  font-weight: 300;
	  font-size: 1.1em;
	}
	
	.navbar .search-area-inner input:-ms-input-placeholder {
	  font-family: "Open Sans", sans-serif;
	  color: #555;
	  font-weight: 300;
	  font-size: 1.1em;
	}
	
	
	
	.invisible {
	  visibility: hidden !important; }
	
	.hidden-xs-up {
	  display: none !important; }
	
	@media (max-width: 575px) {
	  .hidden-xs-down {
		display: none !important; } }
	
	@media (min-width: 576px) {
	  .hidden-sm-up {
		display: none !important; } }
	
	@media (max-width: 767px) {
	  .hidden-sm-down {
		display: none !important; } }
	
	@media (min-width: 768px) {
	  .hidden-md-up {
		display: none !important; } }
	
	@media (max-width: 991px) {
	  .hidden-md-down {
		display: none !important; } }
	
	@media (min-width: 992px) {
	  .hidden-lg-up {
		display: none !important; } }
	
	@media (max-width: 1199px) {
	  .hidden-lg-down {
		display: none !important; } }
	
	@media (min-width: 1200px) {
	  .hidden-xl-up {
		display: none !important; } }
	
	.hidden-xl-down {
	  display: none !important; }
	
	
	.shown-sm { display: none; }
	@media (min-width: 769px) and (max-width: 991px) {
	  .shown-sm { display: inline-block !important; } 
	  .hidden-sm { display: none !important; } 
	}
	
	/*
	* ==========================================================
	*     LATEST INFOS SECTION
	* ==========================================================
	*/
	section.latest-infos header {
	  margin-bottom: 50px;
	  margin:20px 0 50px;
	}
	
	.info-meta {
	  margin: 10px 0;
	  font-size: 0.8em;
	}
	
	.info-meta .date {
	  text-transform: uppercase;
	  font-weight: 400;
	}
	
	.info-meta .date::after {
	  display: none;
	}
	
	.info p:not(.lead) {
	  font-weight: 400;
	  color: #777;
	  font-size: 0.95em;
	}
	
	.info a {
	  text-decoration: none;
	}
	
	.info a:hover, .info a:focus {
	  text-decoration: none;
	}
	
	.info h3 {
	  line-height: 1.1em;
	  color: #222;
	  -webkit-transition: all 0.3s;
	  transition: all 0.3s;
	  margin-bottom: 1rem;
	}
	
	.info h3:hover {
	  color: #555;
	}
	
	.info .category a {
	  color: #999;
	  letter-spacing: 0.05em;
	  font-weight: 700;
	  text-transform: uppercase;
	  text-decoration: none;
	}
	
	.info .date {
	  letter-spacing: 0.05em;
	  font-weight: 400;
	  text-transform: uppercase;
	  color: #aaa;
	}
	
	.info .avatar {
	  max-width: 40px;
	  min-width: 40px;
	  height: 40px;
	  overflow: hidden;
	  border-radius: 50%;
	  margin-right: 10px;
	}
	
	.info .title,
	.info .date,
	.info .comments,
	.info .views {
	  font-weight: 400;
	  color: #999;
	  text-transform: capitalize;
	}
	
	.info .title i,
	.info .date i,
	.info .comments i,
	.info .views i {
	  margin-right: 5px;
	  font-size: 1.1em;
	}
	
	.info .title::after,
	.info .date::after,
	.info .comments::after,
	.info .views::after {
	  content: '|';
	  display: inline-block;
	  margin: 0 7px;
	  font-size: 0.9em;
	  color: #ccc;
	}
	
	.info .info-tags {
	  margin-top: 30px;
	}
	
	.info .info-tags .tag {
	  padding: 5px 25px;
	  border: 1px solid #ddd;
	  margin: 5px;
	  color: #777;
	  font-size: 0.75em;
	  text-transform: uppercase;
	  font-weight: 600;
	  text-decoration: none;
	  border-radius: 50px;
	}
	
	.info .info-tags .tag:hover {
	  background: #999;
	  color: #fff;
	  border-color: #999;
	}
	
	.info .meta-last::after {
	  display: none;
	}
	
	/* Latest infos Section Media Query ------------------------------------- */
	@media (max-width: 767px) {
	  .info {
		margin-bottom: 40px;
	  }
	  .info:last-of-type {
		margin-bottom: 0;
	  }
	}
	
	/*
	* ==========================================================
	*     NEWSLETTER SECTION
	* ==========================================================
	*/
	section.newsletter .form-group {
	  position: relative;
	}
	
	section.newsletter input {
	  width: 100%;
	  height: 60px;
	  line-height: 60px;
	  padding: 0 15px;
	  border: 1px solid #111;
	  /*font-size: 1.1em;*/
	  font-family: "Open Sans", sans-serif;
	  font-weight: 300;
	}
	
	section.newsletter .submit {
	  height: 60px;
	  padding: 0 30px;
	  line-height: 60px;
	  background: #111;
	  border: 1px solid #111;
	  color: #fff;
	  position: absolute;
	  top: 0;
	  right: 0;
	  font-family: "Open Sans", sans-serif;
	}
	
	/* Newsletter Section Media Query ------------------------------------- */
	@media (max-width: 575px) {
	  section.newsletter input {
		/*font-size: 0.95em;*/
		width: 100%;
	  }
	  section.newsletter .submit {
		position: static;
		width: 100%;
		margin-top: 10px;
	  }
	}



	/*.newsletter .add-comment {
	  margin-top: 50px;
	}*/
	
	.newsletter .add-comment header {
	  margin-bottom: 30px;
	}
	
	.newsletter .add-comment input,
	.newsletter .add-comment textarea {
	  background: none;
	  border: none;
	  border-bottom: 1px solid #ddd;
	  padding: 10px 0;
	  border-radius: 0;
	  font-family: "Open Sans", sans-serif;
	}
	
	.newsletter .add-comment input::-moz-placeholder,
	.newsletter .add-comment textarea::-moz-placeholder {
	  font-weight: 400;
	  font-size: 0.9em;
	  color: #aaa;
	  font-weight: 400;
	  font-family: "Open Sans", sans-serif;
	}
	
	.newsletter .add-comment input::-webkit-input-placeholder,
	.newsletter .add-comment textarea::-webkit-input-placeholder {
	  font-weight: 400;
	  font-size: 0.9em;
	  color: #aaa;
	  font-weight: 400;
	  font-family: "Open Sans", sans-serif;
	}
	
	.newsletter .add-comment input:-ms-input-placeholder,
	.newsletter .add-comment textarea:-ms-input-placeholder {
	  font-weight: 400;
	  font-size: 0.9em;
	  color: #aaa;
	  font-weight: 400;
	  font-family: "Open Sans", sans-serif;
	}
	
	.newsletter .add-comment input:focus,
	.newsletter .add-comment textarea:focus {
	  -webkit-box-shadow: none;
	  box-shadow: none;
	  border-bottom: 1px solid #999;
	}
	
	.newsletter .add-comment textarea {
	  min-height: 150px;
	}

	@media (max-width: 991px) {
		.newsletter .add-comment {
		  margin-bottom: 50px;
		}
	}
	
	/*
	* ==========================================================
	*     FEATURED POSTS SECTION
	* ==========================================================
	*/
	section.featured-posts {
	  margin-bottom:40px;
	}
	section.featured-posts .row:nth-of-type(odd) .text {
	  background: #fafafa;
	}
	
	section.featured-posts .row:last-of-type {
	  margin-bottom: 0;
	}
	
	section.featured-posts p {
	  font-weight: 400;
	  color: #777;
	  font-size: 0.95em;
	}
	
	section.featured-posts .text-inner {
	  padding: 70px 30px;
	  height: 100%;
	  -webkit-transition: all 0.3s;
	  transition: all 0.3s;
	}
	
	section.featured-posts a {
	  color: inherit;
	  text-decoration: none;
	}
	
	section.featured-posts h2 {
	  line-height: 1.1em;
	  color: #333;
	  -webkit-transition: all 0.3s;
	  transition: all 0.3s;
	}
	
	section.featured-posts h2:hover {
	  color: #555;
	}
	
	section.featured-posts .avatar {
	  max-width: 40px;
	  min-width: 40px;
	  height: 40px;
	  overflow: hidden;
	  border-radius: 50%;
	  margin-right: 10px;
	}
	
	section.featured-posts .title,
	section.featured-posts .date,
	section.featured-posts .comments {
	  font-size: 0.8em;
	  font-weight: 400;
	  color: #999;
	}
	
	section.featured-posts .title i,
	section.featured-posts .date i,
	section.featured-posts .comments i {
	  margin-right: 5px;
	}
	
	section.featured-posts .title::after,
	section.featured-posts .date::after,
	section.featured-posts .comments::after {
	  content: '|';
	  display: inline-block;
	  margin: 0 7px;
	  font-size: 0.9em;
	  color: #ccc;
	}
	
	section.featured-posts .comments::after {
	  display: none;
	}
	
	section.featured-posts .image {
	  max-height: 200px;
	  width: auto;
	  overflow: hidden;
	  padding: 0;
	  max-height: 400px;
	}
	
	section.featured-posts .image img {
	  height: 100%;
	}
	
	section.featured-posts .post-header {
	  margin-bottom: 10px;
	}
	
	section.featured-posts .post-footer {
	  margin-top: 30px;
	}
	
	/* Featured Posts Section Media Query ------------------------------------- */
	@media (max-width: 991px) {
	  section.featured-posts .image {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
		max-height: 300px;
		/*min-height: auto !important; diganti/ditambah VVV */
		min-height: 300px;
		width:100%;

	  }
	  section.featured-posts .image img {
		width: 100%;
		height: auto !important;
	  }
	  /* added ================================= */
	  section.featured-posts .image .img {
		/*width: 100% ;*/
		min-height:300px !important;
		width:auto !important;
	  }
	  /* ======================================= */
	  section.featured-posts .text {
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 2;
		order: 2;
	  }
	}
	
	@media (max-width: 575px) {
	  section.featured-posts .post-footer {
		font-size: 0.9em;
	  }

	  section.featured-posts .image {
		padding:20px; /* biar gambar gak full, karena ini diganti berita */
	  }
	}
	
	@media (max-width: 350px) {
	  section.featured-posts .text-inner {
		padding: 15px;
	  }
	  section.featured-posts .post-footer {
		font-size: 0.75em;
	  }
	}
	
	/*
	* ==========================================================
	*     DIVIDER SECTION
	* ==========================================================
	*/
	section.divider {
	  color: #fff;
	  padding: 100px 0;
	}
	/*section.divider .row {
	  display:table;
	}
	section.divider .kolom {
		display:table-cell; vertical-align:middle;	
	}*/
	section.divider h2 {
	  margin-bottom: 0.5rem;
	  font-family: inherit;
	  font-weight: 700;
	  line-height: 1.1;
	  color: inherit;

	  font-size: 2rem;
	}
	
	/*
	* ==========================================================
	*     LINK BANNER
	* ==========================================================
	*/
	#banner img { margin:10px 0; }
	#banner .banner-link { margin:20px; }

	#banner header h1 {
	  position: relative;
	  padding-bottom: 30px;
	  margin-bottom: 20px;
	}
	
	#banner header h1::before {
	  content: '';
	  position: absolute;
	  left: 50%; margin-left:-100px;
	  bottom: 0;
	  height: 2px;
	}
	#banner header h1::after {
	  content: '';
	  position: absolute;
	  left: 50%; margin-left:-30px;
	  bottom: 0;
	  height: 2px;
	}
	
	#banner header h1::before {
	  background: #CCC;
	  width:200px;
	}
	
	#banner header h1::after {
	  background: #fccf00;
	  width: 60px;
	}
	/*
	* ==========================================================
	*     FOOTER
	* ==========================================================
	*/
	footer.page-footer {
	  background: #0e0e0e;
	  padding: 100px 0 0;
		/* berli's */
	  padding: 0;
	  color: #fff;
	}
	
	footer.page-footer .contact-details p {
	  font-weight: 300;
	  color: #fff;
	  margin-bottom: 5px;
	  font-size: 0.95em;
	}
	
	footer.page-footer .contact-details a {
	  text-decoration: underline;
	  margin-bottom: 0;
	}
	
	footer.page-footer a {
	  color: inherit;
	  font-weight: 300;
	  margin-bottom: 7px;
	}
	
	footer.page-footer a:hover, footer.page-footer a:focus {
	  color: #999;
	}
	
	footer.page-footer ul {
	  margin-right: 30px;
	}
	
	footer.page-footer .list-unstyled a {
	  font-size: 0.95em;
	}
	
	footer.page-footer .latest-posts .image {
	  max-width: 50px;
	  padding: 4px;
	  border: 2px solid #333;
	  margin-right: 10px;
	}
	
	footer.page-footer .latest-posts a {
	  font-size: 0.95em;
	  text-decoration: none;
	}
	
	footer.page-footer .latest-posts a:hover {
	  color: #fff;
	}
	
	footer.page-footer .latest-posts strong {
	  display: block;
	}
	
	footer.page-footer .latest-posts .date {
	  font-size: 0.85em;
	  color: #aaa;
	}
	
	footer.page-footer .credit {
	  background: #090909;
	  margin-top: 100px;
		/* berli's */
	  margin-top: 20px;
	  padding: 20px 0;
	  font-size: 0.9em;
	}
	
	footer.page-footer .credit * {
	  margin-bottom: 0;
	}
	
	footer.page-footer .social-menu {
	  margin-top: 20px;
	}
	
	footer.page-footer .social-menu li {
	  padding: 0 5px;
	}
	
	footer.page-footer .date::after,
	footer.page-footer .title::after {
	  display: none !important;
	}
	
	/* Footer Media Query ------------------------------------- */
	@media (max-width: 767px) {
	  footer.page-footer div[class*="col-"] {
		margin-bottom: 40px;
	  }
	  footer.page-footer div[class*="col-"]:last-of-type {
		margin-bottom: 0;
	  }
	  footer.page-footer .latest-posts > a {
		width: 100%;
		margin-bottom: 20px;
	  }
	  footer.page-footer .credit div[class*="col-"] {
		margin-bottom: 20px;
		text-align: center !important;
	  }
	  footer.page-footer .credit div[class*="col-"]:last-of-type {
		margin-bottom: 0;
	  }
	}


	/* ======================================== */
	footer .widget { margin-bottom:30px; }
	
	footer .widget ul {
		list-style: none;
		margin-left:0;
		padding-left:0;
	}

	footer .widget h5 {
	  position: relative;
	  padding-bottom: 16px;
	  margin-bottom: 20px;

	  margin-top: 60px;
	}
	
	footer .widget h5::before, footer h5::after {
	  content: '';
	  position: absolute;
	  left: 0;
	  bottom: 0;
	  height: 1px;
	}
	
	footer .widget h5::before {
	  right: 0;
	  background: #CCC;
	}
	
	footer .widget h5::after {
	  background: #fccf00;
	  width: 60px;
	}
	
	footer .widget span i.fa-inverse { color:#0e0e0e; }
	
	footer .counters  { padding:16px; }
	footer .counters span {
	  font-family: "Montserrat", sans-serif;
	  font-weight: bold;
	  font-size: 36px;
	  display: block;
	  color: #fccf00;
	}
	
	.company-social {
		margin-left: 0;
		padding-left: 0;
		margin-top: 10px;
	}
	
	.company-social {
		text-align: left;
		list-style: none;
	}
	
	.company-social li{
		margin:0;
		padding:0;
		display: inline-block;
	}
	
	.company-social a{
		margin:0 2px 0 0;
	}
	
	.company-social a:hover {
		color: #fff;
	}
	
	.company-social a i {
		width: 40px;
		height: 40px;
		line-height: 40px;
		text-align: center;
		color: #fff;
		-webkit-transition: background .3s ease-in-out;
		transition: background .3s ease-in-out;
		text-align: center;
		border-radius: 3px;
		padding:0;
	}
	
	.company-social .social-facebook a i{background: #3873ae;}
	.company-social .social-twitter a i{background: #62c6f8;}
	.company-social .social-dribble a i{background: #d74980;}
	.company-social .social-deviantart a i{background: #8da356;}
	.company-social .social-google a i {background: #ea4335;}
	.company-social .social-vimeo a i {background: #51a6d3;}
	.company-social .social-instagram a i { background: linear-gradient(45deg, #feda75, #d62976, #8134af, #515bd4); }
	.company-social .social-tiktok a i { background-color: #010101; color: #69c9d0; }
	.company-social .social-threads a i { background-color: #000000; }
	.company-social .social-x a i { background-color: #000000; }
	.company-social .social-youtube a i { background-color: #ff0000; }


	.company-social .social-facebook a:hover i {background: #4893ce;}
	.company-social .social-twitter a:hover i {background: #82e6ff;}
	.company-social .social-dribble a:hover i {background: #f769a0;}
	.company-social .social-deviantart a:hover i {background: #adc376;}
	.company-social .social-google a:hover i {background: #f2584b;}
	.company-social .social-vimeo a:hover i {background: #71c6f3;}
	.company-social .social-instagram a:hover i { background: linear-gradient(45deg, #feda75, #d62976, #8134af, #515bd4); }
	.company-social .social-tiktok a:hover i { background-color: #4d4c4c; color: #69c9d0; }
	.company-social .social-threads a:hover i { background-color: #353535; }
	.company-social .social-x a:hover i { background-color: #272727; }
	.company-social .social-youtube a:hover i { background-color: #f84444; }





	a.btn-aspirasi { background-color:rgba(0,0,0,0.5); border:none; color:#ccc; }
	a.btn-aspirasi:hover { background-color:rgba(0,0,0,0.3); border:none; color:#fff; }	

	a.btn-transparent { background-color:transparent; border:1px solid #999 !important; color:#999 !important; }
	a.btn-transparent:hover { background-color:rgba(0,0,0,0.2); border:1px solid #ccc !important; color:#fff !important; }	
	
	
	.text-big { font-size:1.2rem; }
	
	
/* pagination ========================== */
.pagination-template li.page-item {
  margin: 0 5px;
}

.pagination-template a.page-link {
  width: 40px;
  height: 40px;
  line-height: 27px;
  border-radius: 50% !important;
  border: 1px solid #ddd;
  color: #555;
  text-align: center;
}

.pagination-template a.page-link:hover, .pagination-template a.page-link.active {
  background: #f5f5f5;
}

.pagination-template li.page-item {
  margin: 0 5px;
}

.pagination-template a.page-link {
  width: 40px;
  height: 40px;
  line-height: 27px;
  border-radius: 50% !important;
  border: none;
  color: #555;
  text-align: center;
}

.pagination-template a.page-link:hover, .pagination-template a.page-link.active {
  background: #eee;
}	

.pagination-template .page-ellipsis {

	position:relative;
	display:block;
	padding:.5rem .75rem;
	margin-left:-1px;
	/*line-height:1.25;
	color:#007bff;
	background-color:#fff;
	border:1px solid #dee2e6;*/	
	
  width: 40px;
  height: 40px;
  line-height: 27px;
  border-radius: 50% !important;
  border: none;
  color: #555;
  text-align: center;
}