@media only screen and (max-width: 320px) {
#logo {
    position: absolute; 
    left: 3.5rem;
    width: 180px;
}
.navbar-nav {
    margin-left: 0rem;
    margin-top: 6.5rem;
    background-color: darkred;
    width: 85vw;
    text-align: center;
    height: 100vw !important;
}
#navbarTogglerDemo02 .social {
    padding: 0;
    position: absolute;
    margin-left: -3rem;
}
#navbarTogglerDemo02 .social2 {
    padding: 0;
    position: absolute;
    right: 6.5rem;
}
.sec-empresa {height: 450px;}

.sec-empresa #sec-empresa-bx h3 {width: 55%;}
.sec-empresa #sec-empresa-bx p { width: 290px;}

.sec-servicos img { margin-top: 6rem;}

.sec-servicos .bolinhos { margin-top: 5.2rem;}

.tt-localizacao-home { width: 50%;}
.tt-orcamento-home { width: 48%;}

.infoLocaliza {height: 237px;}
.infoOrcamento { height: 193px;}

footer {
    background: url(../img/bg-footer-mobile.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 290px;
}

#logo-footer {margin: -8rem 0 0 0 !important;}

footer #sitesrecife {
    float: right;
    position: relative !important;
    margin-left: 1rem !important;
    margin-top: -2rem !important;
    width: 35px;
}

.tt-servico {width: 60%;}
.tt-orcamento {width: 80%;}
.tt-localizacao {width: 80%;}
.tt-contato { width: 60%;}

}

@media (min-width: 360px) and (max-width: 375px) {
#logo {
    position: absolute; 
    left: 5.5rem;
    width: 180px;
}
.navbar-nav {
    margin-left: 0rem;
    margin-top: 6.5rem;
    background-color: darkred;
    width: 85vw;
    text-align: center;
    height: 85vw;
}
#navbarTogglerDemo02 .social {
    padding: 0;
    position: absolute;
    margin-left: -3rem;
}
#navbarTogglerDemo02 .social2 {
    padding: 0;
    position: absolute;
    right: 8.5rem;
}
.sec-empresa {height: 450px;}

.sec-empresa #sec-empresa-bx h3 {width: 46%;}
.sec-empresa #sec-empresa-bx p { width: 340px;}

.sec-servicos img { margin-top: 4rem;}

.sec-servicos .bolinhos { margin-top: 5.2rem;}

.tt-localizacao-home { width: 40%;}
.tt-orcamento-home { width: 38%;}

.infoLocaliza img {margin-top: 12rem; width: 500px;}

.infoOrcamento { height: 229px;}

footer {
    background: url(../img/bg-footer-mobile.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 290px;
}

#logo-footer {margin: -8rem 0 0 6% !important;}

footer #sitesrecife {
    float: right;
    position: relative !important;
    margin-left: 1rem !important;
    margin-top: -2rem !important;
    width: 35px;
}

.tt-servico {width: 50%;}
.tt-orcamento {width: 65%;}
.tt-localizacao {width: 65%;}
.tt-contato { width: 50%;}

}


@media (min-width: 412px) and (max-width: 414px) {
#logo {
    position: absolute; 
    left: 6.5rem;
    width: 180px;
}
.navbar-nav {
    margin-left: 0rem;
    margin-top: 6.5rem;
    background-color: darkred;
    width: 85vw;
    text-align: center;
    height: 80vw;
}
#navbarTogglerDemo02 .social {
    padding: 0;
    position: absolute;
    margin-left: -3rem;
}
#navbarTogglerDemo02 .social2 {
    padding: 0;
    position: absolute;
    right: 10rem;
}
.sec-empresa {height: 450px;}

.sec-empresa #sec-empresa-bx h3 {width: 40%;}
.sec-empresa #sec-empresa-bx p { width: 380px;}

.sec-servicos .bolinhos { margin-top: 5.2rem;}

.tt-localizacao-home { width: 38%;}
.tt-orcamento-home { width: 35%;}

.infoLocaliza img { margin-top: 11.5rem; width: 500px;}

.infoOrcamento { height: 255px;}

footer {
    background: url(../img/bg-footer-mobile.png) center center no-repeat;
    background-size: cover;
    width: 100%;
    height: 290px;
}

#logo-footer {margin: -8rem 0 0 11% !important;}

.tt-servico {width: 50%;}
.tt-orcamento {width: 60%;}
.tt-localizacao {width: 60%;}
.tt-contato { width: 50%;}


}

@media (min-width: 600px) and (max-width: 769px) {
#logo {
    position: absolute; 
    left: 16rem;
    width: 220px;
}
.navbar-nav {
    margin-left: 3rem;
    margin-top: 9rem;
    background-color: darkred;
    width: 80vw;
    text-align: center;
    height: 40vw;
}
#navbarTogglerDemo02 .social {
    padding: 0;
    position: absolute;
    margin-left: -3rem;
}
#navbarTogglerDemo02 .social2 {
    padding: 0;
    position: absolute;
    right: 19rem;
}
.sec-empresa #sec-empresa-bx h3 {width: 25%;}
.tt-localizacao-home { width: 22%;}

.infoLocaliza img { margin-top: 7.5rem; width: 690px;}

#logo-footer {margin: -5.2rem 0 0 25% !important;}

.tt-servico {width: 25%;}
.tt-orcamento {width: 35%;}
.tt-localizacao {width: 35%;}
.tt-contato { width: 30%;}

}

@media (min-width: 770px) and (max-width: 800px) {
#logo {
    position: absolute; 
    left: 17rem;
    width: 220px;
}
.navbar-nav {
    margin-left: 3rem;
    margin-top: 9rem;
    background-color: darkred;
    width: 80vw;
    text-align: center;
    height: 40vw;
}
#navbarTogglerDemo02 .social {
    padding: 0;
    position: absolute;
    margin-left: -3rem;
}
#navbarTogglerDemo02 .social2 {
    padding: 0;
    position: absolute;
    right: 19rem;
}
.sec-empresa #sec-empresa-bx h3 {width: 25%;}
.tt-localizacao-home { width: 22%;}

.infoLocaliza img { margin-top: 7.8rem; width: 690px;}

#logo-footer {margin: -5.2rem 0 0 25% !important;}

.tt-servico {width: 25%;}
.tt-orcamento {width: 35%;}
.tt-localizacao {width: 35%;}
.tt-contato { width: 30%;}

}


@media (min-width: 992px) and (max-width: 1024px) {
#navbarTogglerDemo02 ul {font-size: 18px;}
#navbarTogglerDemo02 .social2 {right: -3rem;}
.navbar-nav {margin-left: 15rem;}

#logo {left: 3rem; width: 200px;}

.sec-empresa #sec-empresa-bx h3 { width: 18%;}
.tt-localizacao-home { width: 40%;}
.tt-orcamento-home { width: 26%;}
.infoLocaliza img {margin-top: 11.8rem;}
.sec-servicos .bolinhos { margin-top: 1.3rem;}

#logo-footer {margin: -5.2rem 0 0 30% !important;}

.tt-servico {width: 21%;}
.tt-orcamento {width: 27%;}
.tt-localizacao {width: 30%;}

}


@media (min-width: 1200px) and (max-width: 1280px) {
.navbar-nav {margin-left: 20rem;}
#navbarTogglerDemo02 .social2 {right: -3.5rem;}

}

@media (min-width: 1360px) and (max-width: 1366px) {
.navbar-nav {margin-left: 26.5rem;}
#navbarTogglerDemo02 .social2 {right: -3.5rem;}

}

@media (min-width: 1600px) {

.navbar-nav {margin-left: 40rem;}
#navbarTogglerDemo02 .social2 {right: -17rem;}
footer {height: 360px;}

#logo-footer {margin: -4.2rem 0 0 25% !important;}
}