:root{
	--main-color: #00abf0;
	--border: .125rem solid #00abf0;
	--box-shadow: 0 0 .6rem rgba(0,0,0, .5);
	
}

.skillTitleSection{
	text-align: center;
	/*margin-bottom: 1rem;*/
	color:var(--primary-text-color);
    font-size: 5rem;
    padding:1rem 0;
	text-transform: uppercase;
}

.section-SkillIcons .skillTitleSection span{
	color:var(--main-color);
	text-transform: uppercase;
}


.section-SkillIcons{
	display: flex;
	align-items: center;
    justify-content: center;
	flex-direction: column;
}

.skills-box{
	display: block;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-left: 40px;
}

.skills-box .skills-content{
	flex: 1 1 20rem;
}

.skills-content h3{
	font-size: 2rem;
	line-height: 1;
	margin-bottom: .6rem;
	 color:var(--secondary-text-color);
    /*font-size: 1.5rem;*/
    padding:1rem 0;
    /*color:var(--main-color);*/
}


.skills-content .content{
	display: flex;
	flex-wrap: wrap;
	gap: .8rem;
}

.skills-content .content span{
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 11rem;
	height: 11rem;
	border: var(--border);
	border-radius: .3rem;
	font-weight: 600;
	transition: .3s ease;
	color:var(--secondary-text-color);
	font-size: 1.5rem;
}

.skills-content .content span:hover{
	box-shadow: var(--box-shadow);
	
}

.skills-content .content i{
	color: var(--main-color);
	font-size: 7rem;
}


