/* Hero */

.hero {
	background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.7)),
		url('../assets/impresifindonesia.jpg');
	min-height: 60vh;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: stretch;
}

.hero-div {
	margin-top: 300px;
	flex: 1;
	flex-direction: column;
	text-align: center;
}
.hero-div h1 {
    margin-top:-150px!important;
	font-size: 2.55rem;
	padding-bottom: 0.4rem;
}
.hero-div p {
	color: var(--white-smoke);
	font-size: 1.05rem;
	letter-spacing: 3px;
}

.hero-btns {
	margin-top: 2.8rem;
}
.hero-btns button {
	background-color: #28faac;
	border: 3.5px solid #28faac;
	border-radius: 2rem;
	padding: 0.8rem 2rem;
	text-transform: uppercase;
	font-family: "rubik";
	color: white;
}

/* Hero End*/

.card-img {
	width: 40%;
}

@media (max-width: 768px) {
	.card-img {
		width: 100%;
	}
}

.card-img img {
	height: 100%;
	width: 100%;
}

#cards {
	padding: 50px 0;
}

#cards .container .card-item {
	padding: 50px 30px;
	-webkit-box-shadow: -2px 2px 20px 0px #00000013;
	box-shadow: -2px 2px 20px 0px #00000013;
	margin-bottom: 50px;
	border-radius: 10px;
	text-align: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: reverse;
	-ms-flex-direction: column-reverse;
	flex-direction: column-reverse;
}

#cards .container .card-item .card-info {
	margin-top: 30px;
}

#cards .container .card-item .card-info h3 {
	font-size: 1.3rem;
	margin-bottom: 20px;
}

#cards .container .card-item .card-info p {
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5rem;
	color: #808d99;
}

@media only screen and (min-width: 768px) {
	#cards .container .card-item {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
		padding: 50px 100px;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		text-align: left;
	}
	#cards .container .card-item .card-info {
		margin-right: 50px;
	}
	#cards .container .card-item .card-info h3 {
		font-size: 1.7rem;
	}
	#cards .container .card-item .card-info p {
		font-size: 1rem;
	}
	#cards .container .card-item:nth-child(even) {
		-webkit-box-orient: horizontal;
		-webkit-box-direction: reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
	}
	#cards .container .card-item:nth-child(even) .card-info {
		margin-left: 50px;
	}
}