#level-up-guide{
	width: 100%;
	max-width: 1800px;
	margin: 2rem auto;
	padding: 0 1rem;
	text-align: center;
	color: #BBB;
	font-size: 1em;
	h2{
	 font: 500 1.75rem / 2.625rem RazerF5, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #44D62C;
	}
	.steps{
		margin: 1rem auto;
		display: grid;
		grid-template-row: repeat(5, minmax(0, auto));
		row-gap: 1rem;
		column-gap: 2rem;
		width: fit-content;
	}
@media (min-width:500px) and (max-width:1000px){
	.steps{
		grid-template-columns: repeat(2, minmax(0, auto));
	}
}
@media (min-width:1000px){
	h2{
		font-size: 40px;
	}
	.steps{
		display: grid;
		grid-template-columns: repeat(5, minmax(0, auto));
		column-gap: 2rem;
		row-gap: 1rem;
	}
}
	.step-title{
			display: grid;
			grid-template-columns: 35px 1fr;
			grid-template-areas: "icon title"
																	 "icon description";
			text-align: left;
			:nth-child(1){
				grid-area: icon;
			}
			:nth-child(2){
				grid-area: title;
			}
			:nth-child(3){
				grid-area: description;
				font-size: 12px;
			}
	}
}
 @media screen and (max-width:767px){} @media screen and (-webkit-max-device-pixel-ratio: 1) and (min-width: 1200px), screen and (min-width: 768px) and (max-width: 1200px){} @media screen and (-webkit-min-device-pixel-ratio: 1) and (min-width: 1200px){} @media screen and (-webkit-min-device-pixel-ratio: 1.5) and (min-width: 1200px){}