@charset "utf-8";
/*
* Copyright © 2019 | Website Design by Webfrog
*
*/
/* Extra small devices (phones, less than 576px) */
/* No media query since this is the default in Bootstrap */
#middle-menu {
	overflow: hidden;
}
.mid-box {
	background-color: var(--main);
	color: #fff;
}
.mid-box img {
	max-width: 72px;
	max-width: 4.5rem;
}
.mid-box:nth-of-type(2n) {
	background-color: var(--alt);
}
.mid-box h3 {
	margin: 0;
	font-size: 20px;
	font-size: 1.25rem;
	color: #fff;
}
.mid-box:hover {
	background-color: #4d4d4d;
	color: #fff;
}
.house {
	position: relative;
	overflow: hidden;
}
.house .image-box {
	display: table;
	margin: 0 auto;
	position: relative;
}
.house .image-box img {
	width: 400px;
    height: auto;
}
.house-box {
	width: 100%;
    float: left;
    text-align: center;
	margin: 1rem 0;
}
.house-box h3 {
	font-size: 30px;
	font-size: 1.875rem;
	color: var(--header);
	margin-bottom: 0.25rem;
}
.house-box p {
	font-size: 13px;
	font-size: 0.8125rem;
	color: var(--text-dark);
	line-height: 1.2;
	margin-bottom: 1rem;
}

.house-box .btn-readMore {
    padding: 0.25rem 1rem;
}


/* Small devices (tablets, 768px and up) */
@media (min-width: 576px) {
.house-box {
	width: 48%;
    float: left;
    text-align: center;
	margin: 1rem 0;
}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
/* house positioning */
.house-box {
	position: absolute;
	width: auto;
    float: none;
    text-align: left;
	margin: 0 0;
}
.house-box .text-wrap {
	width: 230px;
	width: 14.375rem;
	padding-left: 1rem;
	padding-right: 1rem;
}
.commercial {
	top: -8.5rem;
	left: 14rem;
}
.acoustic {
	top: -4.5rem;
	left: 28rem;
}
.Roofing {
	top: -5rem;
	left: -4rem;
}
.wall {
	top: 6.5rem;
	left: -9.75rem;
}
.industrial {
	top: 8.5rem;
    left: 27rem;
}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
/* house positioning */
.house-box {
	position: absolute;
}
.house .image-box img {
	width: 700px;
    height: auto;
}
.house-box .text-wrap {
	width: 200px;
	width: 12.5rem;
	padding-left: 1rem;
	padding-right: 1rem;
}
.commercial {
	top: -8.5rem;
	left: 23.125rem;
}
.acoustic {
	top: -6.5rem;
	left: 40rem;
}
.Roofing {
	top: -4rem;
	left: 0;
}
.wall {
	top: 11.5rem;
	left: -5.75rem;
}
.industrial {
	top: 14.5rem;
    left: 45rem;
}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
.house .image-box img {
	width: 900px;
}
	
.commercial {
	top: -8.5rem;
	left: 30rem;
}
.acoustic {
	top: -25px;
	top: -1.5625rem;
	left: 48rem;
}
.Roofing {
	top: 0;
	left: -4.5rem;
}
.wall {
	top: 17.5rem;
	left: -4.75rem;
}
.industrial {
	top: 20.5rem;
    left: 58.5rem;
}
}

/* Webfrog extra devices (large desktops, 1600px and up) */
@media (min-width: 1600px) {
.commercial {
	top: -120px;
	top: -7.5rem;
	/*left: 47.4%;*/
	left: 450px;
	left: 28.125rem;
}
.acoustic {
	top: -25px;
	top: -1.5625rem;
	left: 760px;
	left: 47.5rem;
}
.Roofing {
	top: 0;
	left: -120px;
	left: -7.5rem;
}
.wall {
	top: 280px;
	top: 17.5rem;
	left: -140px;
	left: -8.75rem;
}
.industrial {
	top: 280px;
	top: 17.5rem;
    left: 850px;
    left: 53.125rem;
}
.house-box .text-wrap {
	width: 280px;
	width: 17.5rem;
}
}
/*
* Copyright © 2019 | Website Design by Webfrog
*
*/