/* Riset 6 Us Section
--------------------------------*/
#landing #riset6 {
	background: url(../../../img/home_lp/background_riset6.png) center top no-repeat;
	background-size: cover;
	height: 100vh;
	overflow: hidden;
}


#landing #riset6 .judul-riset6 {
	background: url(../../../img/home_lp/judul-riset6.png) left top no-repeat;
	background-size: contain;
}


@media (max-width: 991px) {
	#landing #riset6 {
		background: url(../../../img/home_lp/background_riset6-1.png) right top no-repeat;
		height: fit-content;
	}


	#landing #riset6 .riset6-container .title {
		text-align: center;
		font-size: 2rem;
	}

}

#landing #riset6 .riset6-container .counters .angka {
	font-size: 10vmin;
	font-weight: 700;
	display: inline;
	color: #2a4354;
}

#landing #riset6 .riset6-container .counters .persen {
	font-size: 5vmin;
	font-weight: 700;
	display: inline;
	color: #2a4354;
}


#landing #riset6 .riset6-container .counters p {
	padding: 0;
	margin: 0 0 20px 0;
	font-family: "Poppins", sans-serif;
	font-size: 2.5vmin;
	font-weight: 500;
	text-align: center;
	color: #2a4354;
}

#landing #riset6 .riset6-container .counters .progress {
	height: 3vmin;
	background: none;
	border-top: 5px solid rgba(7, 36, 56, 1);
	border-bottom: 5px solid rgba(7, 36, 56, 1);
	border-radius: 0;
	margin-bottom: 25px;
	overflow: visible;
	position: relative;
}

@media (max-width: 767px) {
	#landing #riset6 .riset6-container .counters .angka {
		font-size: 15vmin;
	}

	#landing #riset6 .riset6-container .counters .persen {
		font-size: 7vmin;
	}


	#landing #riset6 .riset6-container .counters p {
		font-size: 5vmin;
	}

	#landing #riset6 .riset6-container .counters .progress {
		height: 6vmin;
	}
}

#landing #riset6 .riset6-container .counters .progress:before,
#landing #riset6 .riset6-container .counters .progress:after {
	content: "";
	width: 5px;
	background: rgba(7, 36, 56, 1);
	position: absolute;
	top: 0;
	left: -5px;
	bottom: 0;
}

#landing #riset6 .riset6-container .counters .progress:after {
	left: auto;
	right: -5px;
}

#landing #riset6 .riset6-container .counters .progress .progress-bar {
	border: none;
	box-shadow: none;
	-webkit-animation: 2s linear 0s normal none infinite running progress-bar-stripes, animate-positive 1s;
	animation: 2s linear 0s normal none infinite running progress-bar-stripes, animate-positive 1s;
}

@-webkit-keyframes animate-positive {
	0% {
		width: 0;
	}
}

@keyframes animate-positive {
	0% {
		width: 0;
	}
}

#landing #riset6 .riset6-container .counters .progress-bar-custom {
	background: rgba(7, 36, 56, 1);
}

#landing #riset6 .riset6-container .counters .progress-striped .progress-bar-custom {
	background-color: rgba(7, 36, 56, 1);
	background-image: -webkit-gradient(linear,
			0 100%,
			100% 0,
			color-stop(0.25,
				rgba(42, 67, 84, 1),
				color-stop(0.25, transparent),
				color-stop(0.5, transparent),
				color-stop(0.5, rgba(42, 67, 84, 1)),
				color-stop(0.75, rgba(42, 67, 84, 1)),
				color-stop(0.75, transparent),
				to(transparent)));
	background-image: -webkit-linear-gradient(45deg,
			rgba(42, 67, 84, 1) 25%,
			transparent 25%,
			transparent 50%,
			rgba(42, 67, 84, 1) 50%,
			rgba(42, 67, 84, 1) 75%,
			transparent 75%,
			transparent);
	background-image: linear-gradient(45deg,
			rgba(42, 67, 84, 1) 25%,
			transparent 25%,
			transparent 50%,
			rgba(42, 67, 84, 1) 50%,
			rgba(42, 67, 84, 1) 75%,
			transparent 75%,
			transparent);
	background-size: 40px 40px;
}

.grid-container {
	display: grid;
	grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto auto;
	grid-gap: 10px;
	padding: 10px;
}

.progress {
	grid-column: 2/12;
}