.row-steps {
    width: 1199px;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}
.steps-title {
	width: 80%;
	margin: 0 .5em 1em 0em;
	background-color: lightgray;
	text-decoration: none;
	color: #444;
	position: relative;
	height: 80px;
	text-align: center;
	padding-top: 8px;
	padding-left: 7px;
}
.steps-title-active {
	/*background-color: #318dde;*/
	background-color: #333;
	color: white;
}
.steps-title > p{
    font-size: 13px;
}
.steps-title-active > p {
	font-weight: bold;
}
.steps-title::after {
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border-top: 40px solid transparent;
	border-bottom: 40px solid transparent;
	border-left: 35px solid lightgray;
	position: absolute;
	top: 61.7%;
	margin-top: -50px;
	left: 100%;
	z-index: 2;
}
.steps-title-active::after {
	border-left: 35px solid #333;
}
@media only screen and (min-width:1200px){
	.row-steps {
		max-width: 1140px;
	}
}
@media screen and (max-width: 1299px) {
	.row-steps {
		width: 100%;
	}
}
@media only screen and (max-width:1199px){
	.steps-title > p{
		font-size: 12px;
	}
	.steps-title > h4{
		font-size: 1.1rem;
	}
	.steps-title-active::after {
		border-left: 35px solid #333 !important;
	}
	.steps-title::after {
		border-left: 35px solid lightgray;
	}
}
@media only screen and (max-width:576px){
    .steps-title {
        width: 80%;
        margin: 0 auto 10px;
        background-color: lightgray;
        text-decoration: none;
        color: #444;
        position: relative;
        height: auto;
        text-align: center;
        padding: 10px;
    }
    .steps-title-active {
        background-color: #333;
        color: white;
    }
    .steps-title::after {
        border: none;
    }
    .steps-title-active::after {
        border: none;
    }
}