@media(max-width: 991px) {
	
}


@media(min-width: 992px) {
	.diy-conten .site-content{
		padding-top: 17.2rem !important;
	}
	.media-block__image img {
	    max-width: 100%;
	    margin-left: 0%;
	}
	.generic-content h1, .generic-content h2, .generic-content h3, .generic-content h4, .generic-content h5, .generic-content h6 {
	    color: #10384d;
	}
	.media-block h1, .media-block h2, .media-block h3, .media-block h4, .media-block h5, .media-block h6 {
	    color: #10384d;
	}
	.media-block--blue {
	    background: #10384d;
	}
	.generic-content--blue {
		background: #10384d;
	}
	.generic-content .intro {
	    padding-top: 0rem;
	}
	.generic-content ul.key-strengths li {
	    text-align: left;
	    flex-basis: 30%;
	    margin-bottom: 1rem;
	    font-weight: 600;
	}
	
	.generic-content .about-hero {
	    padding-top: 76rem;
		background: transparent;
	}
	.generic-content ul.key-strengths li .fa-square {
	    margin-right: 2rem;
	    color: rgb(16 56 77);
	}
	.the-1-p{
		font-size: 2.2rem !important;
	}
	.the-1-tit{
		position: absolute;
		top: 68rem;
	}
	.diy-2-h2{
		text-align: center;
		padding-bottom: 2rem;
		margin-top: 6rem;
		text-align: center;
	}
	.generic-content .about-hero .blue-box {
	    background: rgb(16,56,77,0.8);
	    top: 8rem;
		max-width: 46%;
	}
	.generic-content .about-hero::before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.3);
		z-index: 0;
	}
	.media-block .container {
	    align-items: flex-start;
	}
	
	.generic-content .about-hero h1 {
	    color: white;
	    text-shadow: 2px 2px 10px #333;
	}
	
}


@media(min-width: 1200px) {
	
}

@media(min-width: 1400px) {
	
}