.maincontent {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    border: none;
}

.service-ov-heading {
padding: 40px 0px;
color: #000000;
background-color: #f5f5f5;
text-align: center;
border-width: 0px 0px 5px ;
border-style: solid;
border-color: #000000;
}

.service-ov-heading h1 {
max-width: 88%;
width: 100%;
margin: auto;
font-weight: 700px;
}

.service-selector {
display: flex;
flex-flow: row wrap;
justify-content: center;
gap: 5px;
background-color: #000000;
}

.selector-item{
position: relative;
height: 620px;
flex: 1 435px;
width: 100%;
text-align: center;
transition: all 0.55s ease-in-out;
color: #ffffff;
}

.selector-item:hover {
color: #dddddd;
text-decoration: none;
}

.selector-item h2 {
position: relative;
top: 40%;
font-size: 2.4em;
font-weight: 700;
}

.selector-item p {
position: relative;
top: 55%;
}


#res-selector {
background: url(/imageserver/UserMedia/exteriorpros/res-roof-brown.jpg);
background-size: cover;
background-position: bottom;
background-repeat: no-repeat;
background-color: #2d2d2d;
background-blend-mode: multiply;

}

#comm-selector {
background: url(/imageserver/UserMedia/exteriorpros/contractors_commercial-default.jpg);
background-size: cover;
background-position: bottom;
background-repeat: no-repeat;
background-color: #2d2d2d;
background-blend-mode: multiply;
}

.selector-item#res-selector:hover,
.selector-item#comm-selector:hover {
background-color: #888888;
}

.selector-item#res-selector:hover h2,
.selector-item#comm-selector:hover h2 {
transform: scale(1.05);
}