@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');




:root {
	--white: #FFF;
	--blue: #105dbb;
	--light: #F5F5F5;
	--light-blue: #F3F0FF;
	--grey: #eee;
	--dark-grey: #666;
	--black: #222;
}


.container1 {
	max-width: 100%;
	width: 100%;
	background: var(--white);
	background-color: #f8f9fa;
/*
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .05);
*/
	
}
.wrapper1 {
	display: flex;
}
.indicator1 {
	padding: 1.5rem 0;
	border-right: 1px solid var(--grey);
	
	
}
.indicator1 li {
	display: flex;
	align-items: center;
	grid-gap: .5rem;
	padding: 10px 2rem;
	cursor: pointer;
	font-size: 18px;
	color: var(--black);
	border-right: 3px solid transparent;
	border-bottom: 1px solid var(--grey);
	
	width: 320px;
	
}
.indicator1 li i {
	font-size: 1rem;
}
.indicator1 li:hover {
	background: var(--light-blue);
}
.indicator1 li.active {
	border-right-color: var(--blue);
	color: var(--blue);
	background: var(--light-blue);
}
.content {
	padding: 1.5rem 2rem;
	font-family: 'Cabin', sans-serif; 
}
.content li {
	display: none;
}
.content li.active {
	display: block;
}
.content li h1 {
	font-size: 26px;
	font-weight: 600;
	color: var(--black);
	margin-bottom: .75rem;
}
.content li p {
	margin-bottom: .5rem;
	color: #888;
	
	 font-size: 17px;
  line-height: 28px;
	font-family: 'Cabin', sans-serif; 
}




@media screen and (max-width: 576px) {
	.wrapper1 {
		flex-direction: column;
	}
	.indicator1 {
		border-right: none;
	}
}