body {
	font-family: 'Roboto', sans-serif;
}

h1, h2, h3 {
	font-family: 'Nunito', sans-serif;
}

h4,h5,h6,p {
	font-family: 'Roboto', sans-serif;
}

.nunito {
	font-family: 'Nunito', sans-serif;
}

.roboto {
	font-family: 'Roboto', sans-serif;
}

.white {
	background-color: white;
}

.grey {
	background-color: #FBFBFF;
}

.grey-white-text {
	color: rgba(255,255,255,0.6);
}

.grey-black-text {
	color: rgba(0,0,0,0.6);
}

.white-text {
	color: white;
}

.purple {
	background-color: #1e2c5c;
}

.purple-text, .purple-text:hover {
	color: #1e2c5c !important; 
}

.red {
	background-color: #EC5923;
}

.red-text {
	color: #EC5923;
}

.green {
	background-color: #00BDAA;
}

.green-text {
	color: #00BDAA;
}

.rounded-up {
	border-radius: 100px 100px 0px 0px;
}

.rounded-up-25 {
	border-radius: 25px 25px 0px 0px;
}

.rounded-down-25 {
	border-radius: 0px 0px 25px 25px;
}

.rounded-25 {
	border-radius: 25px;
}

.rounded-50 {
	border-radius: 50px;
}

.rounded-100 {
	border-radius: 100px;
}

.overlap {
	margin-top: -100px;
	z-index: 1000;
}

.shadow-purple{
	box-shadow: 0px 15px 30px rgba(30, 44, 92, 0.1);
}

nav a:hover {
	color:white;
}


.cover {
	min-height: 300px;
	background-image: url("../img/cover-2.png?2");
	background-repeat: no-repeat;
 	background-size: 60rem;
 	background-position: right bottom;
}

.lawan-covid {
	width: 33%;
}


.tentang {
	min-height: 500px;
	background-image: url("../img/tentang.png");
	background-repeat: no-repeat;
 	background-size: 100%;
 	background-position: center bottom;
}

.tentang3 {
	min-height: 500px;
	background-image: url("../img/tentang 3.png");
	background-repeat: no-repeat;
 	background-size: 100%;
 	background-position: center bottom;
}

.tentang4 {
	min-height: 500px;
	background-image: url("../img/tentang4.png");
	background-repeat: no-repeat;
 	background-size: 100%;
 	background-position: center bottom;
}

.small-text {
	font-size: 16px;
}

.logo {
	width: 300px
}

.menu {
	box-shadow: 0px -20px 40px rgba(30, 44, 92, 0.2);
	position: fixed;
	bottom: 0;
	z-index: 1000;
	width: 100%;
}

.menu .nav-link {
	font-family: 'Nunito', sans-serif;
	font-size: 11px;
	font-weight: 700;
	padding-top: 0px;
	padding-bottom: 0px;
}

.menu .nav-link:hover, .menu .nav-link {
	color: rgba(0,0,0,0.6);
}

.icon-menu {
	width: 24px;
}
.cover-detail-artikel {
	width: 100%;
    height: 400px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50
}

@media(max-width: 768px) {
	.cover {
		min-height: 200px;
		background-image: url("../img/cover.png?2");
		background-repeat: no-repeat;
	 	background-size: 40rem;
	 	background-position: right bottom;
	}
	.rounded-up {
	border-radius: 50px 50px 0px 0px;
	}
	.overlap {
		margin-top: -50px;
	}
	.lawan-covid {
		width: 160px;
		margin-left: 0;
	}
	.container {
		padding-right: 30px;
		padding-left: 30px;
	}

	.tentang {
		min-height: 500px;
		background-color: #1e2c5c;
		background-image: none;
	}

    .tentang4 {
		min-height: 500px;
		background-color: #1e2c5c;
		background-image: none;
	}

	.small-text {
		font-size: 	11px;
	}

	.footer {
		padding-bottom:70px !important;
	}
	.cover-detail-artikel {
    height: 200px;
	}
}
.card {
	border: none;
}
@media(max-width: 400px) {
	.cover {
		min-height: 100px;
		background-image: url("../img/cover.png?2");
		background-repeat: no-repeat;
	 	background-size: 35rem;
	 	background-position: right bottom;
	}
	.lawan-covid {
		width: 130px;
		margin-left: 0;
	}
	.logo {
		width: 250px;
	}
	.icon-menu {
		width: 16px;
	}
	.menu .nav-link{
		font-size: 8px;
	}
	.footer {
		padding-bottom:70px !important;
	}
}


.bps-long {
	width: 20%;
}

.icon-status {
	max-height: 100px;
}

/*.footer {
	background-color: #f0f0f7;
}*/

.btn-hover:hover {
	color: white;
}

.icon-active {
	height: 24px;
	fill: #1e2c5c; 
}

.cover-artikel {
	width: 100%;
    height: 200px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50
}